Tutorials are great, but building projects is the best way to learn. Do project based learning and learn code the right way!
ProjectLearn provides a curated list of project tutorials in which learners build an application from scratch. These are divided into different categories, namely, web development, mobile development, game development, machine learning, deep learning and artificial intelligence.
The list has project tutorials on many in-demand languages and technologies including ReactJS, NodeJS, VueJS, Flutter, React Native, .NET Core, Unity, TensorFlow, OpenCV, Keras, and more.
To contribute to this list, head over to CONTRIBUTE.md for more details :)
List of Project Tutorials:
Web Development:
Project | Technologies | Link |
---|---|---|
Build A Full Stack Ecommerce Store With Admin Dashboard | Next.js, React, JavaScript, Tailwind, Stripe | Link |
Build a Full Stack Uber Clone | Next.js, React, JavaScript, Tailwind, Stripe | Link |
Build and Deploy a Full Stack Social Media App using React | React, JavaScript, HTML, CSS, Tailwind | Link |
Create Your Own ChatGPT Clone in HTML CSS and JavaScript | HTML, CSS, JavaScript, OpenAI API, API | Link |
Build Reddit 2.0 clone with NextJS | React, SQL, Supabase, Next.js, GraphQL | Link |
Build a YouTube Clone with React | Express, Node, JavaScript, HTML, CSS | Link |
Create a Diverging Bar Chart with a JavaScript Charting Library | JavaScript, HTML, CSS | Link |
Learn CSS Basics by Building a Card Component | HTML, CSS | Link |
Create a Serverless Meme as a Service | JavaScript, Rust, CSS, HTML | Link |
Weather Forecast Website | JavaScript, HTML, CSS, React | Link |
Link Shortener Website | JavaScript, Vue, HTML, CSS, React | Link |
Plagiarism Checker Website | Python, Bootstrap | Link |
Build a Custom Google Maps Theme | JavaScript, HTML, CSS | Link |
Build a Super Mario themed Google map with JavaScript | JavaScript, HTML5, CSS3 | Link |
Build a community-driven delivery application | Python, Django, PostgreSQL, JavaScript, Mapbox | Link |
Build a local Store search-and-discovery application | Python, Django, PostgreSQL, JavaScript, Mapbox | Link |
Medium Clone using React.js and Node.js | React, Node, CSS3, JavaScript, HTML5 | Link |
Facebook Clone with React JS | React, Firebase, CSS3, JavaScript, HTML5 | Link |
JavaScript30 - 30 Day Vanilla JS Coding Challenge | JavaScript | Link |
Travel Bucket List Map with Gatsby and GraphCMS | Gatsby, Leaflet, GraphCMS, HTML, CSS | Link |
Memory Card Game with Vue.js | Vue, JavaScript, HTML, CSS | Link |
Strapi and GatsbyJS Course - Portfolio Project | Strapi, Gatsby, JavaScript, HTML, CSS | Link |
Storybook - Node, Express, MongoDB and Google OAuth | MongoDB, Node, JavaScript, HTML, CSS | Link |
Breathe and Relax App - JavaScript and CSS Animations | JavaScript, HTML, CSS | Link |
Node.js CLI For Cryptocurrency Prices | Node, JavaScript | Link |
React and Tailwind CSS Image Gallery | React, Tailwind, JavaScript, HTML, CSS | Link |
Pomodoro Clock using React | React, JavaScript, HTML, CSS | Link |
Keyword Density Tool with Laravel from Scratch | Laravel, PHP, JQuery, AJAX, SEO | Link |
YouTube Clone using Yii2 PHP Framework | Yii2, PHP | Link |
Reddit Clone with React, GraphQL and Amplify | React, Amplify, AWS, GraphQL, Node | Link |
Full-Stack Yelp Clone with React and GraphQL | React, GraphQL, HTML, CSS, JavaScript | Link |
Pokémon Web App with React Hooks and Context API | React, HTML, CSS, JavaScript | Link |
Watershed Monitor using JavaScript and Rails | Ruby, Rails, JavaScript | Link |
Climate Data Dashboard using React and Redux | React, Redux, HTML, CSS, JavaScript | Link |
Flipping UNO Cards using only CSS | HTML, CSS | Link |
Chat App with Redis, WebSocket and Go | Redis, Web Socket, Go, Azure | Link |
Spotify Login Animation With React Navigation | React, HTML, CSS, JavaScript | Link |
Dynamic Weather Interface with just CSS | HTML, CSS | Link |
Simple CRUD App with Airtable and Vue | Airtable, Vue, Vuetify, API, HTML | Link |
Full Stack RPG Character Generator with MEVN stack | MongoDB, Express, Vue, Node, HTML | Link |
Todo App with the PERN stack | PostgreSQL, Express, React, Node, HTML | Link |
Summer Road Trip Mapping App with Gatsby | React, Gatsby, Leaflet | Link |
Multiplayer Card Game with Socket.io | Phaser 3, Express, Socket.io, JavaScript | Link |
COVID-19 Dashboard and Map App with Gatsby | React, Gatsby, Leaflet | Link |
Flashcard Quiz With React | React, API, JavaScript, HTML5, CSS3 | Link |
Whack-a-Mole with pure JavaScript | JavaScript, HTML5, CSS3 | Link |
NOKIA 3310 Snake Game using JavaScript | JavaScript, HTML5, CSS3 | Link |
Meme Maker with React | React, JavaScript, HTML5, CSS3 | Link |
Evernote Clone with React | React, Firebase, Node, JavaScript, HTML5 | Link |
Developer Meetup App with Vue | Vue, Firebase, Vuetify, JavaScript, HTML5 | Link |
Real-Time Chat App with Vue | Vue, Firebase, Vuex, JavaScript, HTML5 | Link |
Cryptocurrency Tracker with Vue | Vue, Vuetify, API, JavaScript, HTML5 | Link |
Multiplayer Quiz Game with Vue | Vue, Pusher, Node, Express, JavaScript | Link |
Minesweeper Game with Vue | Vue, Vuex, Vuetify, JavaScript, HTML5 | Link |
Instagram Clone with Vue | Vue, CSSGram, JavaScript, HTML5, CSS3 | Link |
Hacker News Clone with Angular | Angular, Lighthouse, JavaScript, HTML5, CSS3 | Link |
Chat Interface | HTML5, CSS3 | Link |
Pure CSS3 Tooltip | HTML5, CSS3 | Link |
Social Media Buttons | HTML5, CSS3 | Link |
Testimonial Card | HTML5, CSS3 | Link |
Navigation Bar with CSS3 Flexbox | HTML5, CSS3 | Link |
Mobile App Layout with CSS3 Flexbox | HTML5, CSS3 | Link |
Reddit-inspired Loading Spinner | HTML5, CSS3 | Link |
Calendar with CSS3 Grid | JavaScript, HTML5, CSS3 | Link |
Tetris Game in React | React, JavaScript, HTML5, CSS3 | Link |
2D Breakout Game | JavaScript, HTML5, CSS3 | Link |
Sprite Animation | JavaScript, HTML5, CSS3 | Link |
Snake Game | JavaScript, HTML5, CSS3 | Link |
Memory Game | JavaScript, HTML5, CSS3 | Link |
Simple Authentication and Authorization | GraphQL, Apollo, Node, JavaScript, HTML5 | Link |
Cryptocurrency Tracker | NextJS, GraphQL, Apollo, Node, JavaScript | Link |
Instant Search With Vanilla Javascript | JavaScript, HTML5, CSS3 | Link |
Calculator App | JavaScript, HTML5, CSS3 | Link |
Todo App | Vue, JavaScript, CSS3, HTML5 | Link |
Blog App | Vue, GraphQL, Apollo, JavaScript, CSS3 |