Check out our FREE Web Developer Track!
Completely free • Community Driven

Web Development Projects

Interesting and completely free projects for all web developers. Choose from projects in React, Python, JavaScript, and more and complete them by following a recommended action plan.

image

Multiplayer Game - Connect4

If you ever wondered how multiplayer games are made or wanted to make a game for you weekend,this is the project for you. In this python project you will be creating a multiplayer Connect4 game for you and your friends using fundamentals of PyGame, Sockets and game development

Author

Apoorv Goyal

Collaborator(s)

Kevin Paulose
,
Kiran Suresh

Prerequisite(s)

Python
25 hours
Difficulty: Intermediate

Skills to be Learned

Pygame
Game Development
Networking Fundamentals
Socket Communication
Game Engine
Download Project

Amazon clone using React

Nowadays the first thing that someone does when they create a new business for trading goods is to convert their commerce to e-commerce. Many businesses even prefer to have e-commerce as their only mode of doing business. The potential of e-commerce is nearly limitless, reason for which we'll be going on a ride to create an e-commerce solution of our own!

Author

Ayush Kumar Shaw

Collaborator(s)

Mridula Reddy,
Kiran Suresh

Prerequisite(s)

HTML, CSS, JavaScript
100 hours
Difficulty: Advanced

Skills to be Learned

React.js
Stripe
Firebase
Download Project

Sorting Visualizer

If you are searching for a new JavaScript Project idea and want to dive deep into JavaScript or want to take your JavaScript skills to the next level, this is the perfect project for you. At the end of this module you will have a platform where anyone can visualize how sorting algorithms works and you also can showcase your HTML, CSS, Bootstrap, JavaScript Skills.

Author

Swapnoneel Dutta Majumdar

Collaborator(s)

Kevin Paulose
,
Kiran Suresh

Prerequisite(s)

HTML, CSS, JavaScript (introductory level)
20 hours
Difficulty: Intermediate

Skills to be Learned

JavaScript
Sorting Algorithms
Web application development
Web Hosting
Download Project

Visualising and forecasting stocks using Dash

If you are interested in the stock market, then this project will help you visualise stock data easily. Python is the only programming language used for this powerful project. This intermediate project also encompasses web development.

Author

Sujay Goswami

Collaborator(s)

Kiran Suresh
,
Kevin Paulose

Prerequisite(s)

Python, HTML, CSS
25 hours
Difficulty: Intermediate

Skills to be Learned

Dash Python
Data visualisations
Machine Learning
Web Development
Download Project

OurApp - a social media web app in NodeJS

Want to be a full stack developer and take your skills from HTML, CSS and JS to beyond? Build this full stack application where you will get to learn about building modern, fast and scalable server-side web applications with NodeJS, databases like MongoDB and more. If you've been looking to build something interesting and master your NodeJS skills, this is the perfect project for you.

Author

Shubhadarshie Nanda

Collaborator(s)

Kiran Suresh
,
Kevin Paulose

Prerequisite(s)

HTML, CSS, Javascript
90 hours
Difficulty: Advanced

Skills to be Learned

NodeJS
ExpressJS
MongoDB
Template Engine(EJS)
Socket.IO
Heroku
Download Project

Online Code Editor (React)

Want to take your frontend development skills to the next level? Build an online code editor in React and start using it to edit your source code. All you enthusiastic frontend developers reading this, make sure to tick this off from your bucket list of react projects for beginners.

Author

Kevin Paulose

Collaborator(s)

Kiran Suresh
,
Mridula Reddy

Prerequisite(s)

HTML, CSS, React (Intermediate level)
35 hours
Difficulty: Intermediate

Skills to be Learned

React
Web development
Website hosting
Download Project

YouTube Transcript Summarizer

People are watching YouTube videos daily which can be educational, documentary or of any genre with longer length; think about how much time can be saved by creating summarized content. In this project, you will be a creating a Chrome Extension which will make a request to backend REST API where it will perform NLP and respond with a summarized version of a YouTube transcript.

Collaborator(s)

Ayush Kumar Shaw
,
Kiran Suresh

Prerequisite(s)

HTML, CSS, JavaScript, Python, Flask
30 hours
Difficulty: Intermediate

Skills to be Learned

Natural Language Processing
Download Project

Customer Relationship Manager

Developing a web application with help of Spring, Hibernate and HTML/CSS. The journey is about how to create a backend web application.Customer Relationship Manager will keep track of all the customers. Adding new customers, editing their information and deleting them when needed.

Author

Shourya Roy

Collaborator(s)

Ayush Kumar Shaw
,
Kevin Paulose
,
Kiran Suresh

Prerequisite(s)

Java, HTML, CSS
75 hours
Difficulty: Advanced

Skills to be Learned

Spring Framework
Spring Core
Spring MVC
Hibernate
JDBC
ORM framework
Maven
JSP
HTTP
MySQL
Download Project

Student Result Management System

Are you looking for a beginner level full-stack project after learning the basics of front-end, back-end, and database? If yes, complete this project and gets a flavor of full-stack development along with various database concepts. This project will also help to brush up on your HTML, CSS, JavaScript, PHP and MySQL skills.

Author

Chirag Jindal

Collaborator(s)

Ayush Kumar Shaw
,
Mridula Reddy

Prerequisite(s)

Front-end Basics, Back-end Basics, Databases
25 hours
Difficulty: Intermediate

Skills to be Learned

Full Stack Development
Basic Authentication
Normalization
MySQL
Download Project

Codechef Notifier

Codechef is a very common platform used by many aspiring coders to improve their coding skills. Often when using codechef, its servers are so overloaded that our submissions take a long time to get verified by the judge and our time is wasted in checking for results again and again. This extension aims to save this time by automating the process of fetching the result and informing you as soon as the result is available so that you can move on to solve the next question and not worry about whether the result has been passed by the judge or not.

Author

Satyam Kumar

Collaborator(s)

Kiran Suresh
,
Kevin Paulose

Prerequisite(s)

Javascript, Chrome Developer Tools
10 hours
Difficulty: Beginner

Skills to be Learned

Chrome extension API
Asynchronous Javascript
Chrome dev tools
Download Project

Online Code Editor (JQuery)

Have you been looking for Javascript project ideas to take your skills to the next level? If yes, complete this project and have your own online code editor to edit your source code. This is the perfect project to test your understanding of HTML, CSS, Javascript.

Author

Kevin Paulose

Collaborator(s)

Mridula Reddy,
Kiran Suresh

Prerequisite(s)

HTML, CSS, JQuery (Introductory level)
20 hours
Difficulty: Beginner

Skills to be Learned

JQuery
Web application development
Website hosting
Notify when download is available

Authentication in Node.js for a web app

This project is useful for anyone who wants to get started with Node.js; anyone who wants to learn about authentication and build an authentication app from scratch (backend-intensive) from scratch.

Author

Subham Agarwal

Collaborator(s)

Kevin Paulose
,
Kiran Suresh

Prerequisite(s)

JavaScript
25 hours
Difficulty: Beginner

Skills to be Learned

Node.js
Express.js
Authentication
JWT
Middlewares
Notify when download is available

Rat in a Maze

A simple web app made using React that shows all the possible paths a rat can take from top left to bottom right of a square maze with fixed obstacles in between. The app will be a visualisation of the famous Rat in a Maze problem.

Author

Shubham Chhimpa

Collaborator(s)

Kiran Suresh
,
Kevin Paulose

Prerequisite(s)

JavaScript, ReactJs(Beginner), Data Structure and Algorithm
10 hours
Difficulty: Beginner

Skills to be Learned

ReactJs
Backtracking
Recursion
Problem Solving
Web development
Notify when download is available

FuzzyURLs

URL Shortener using Django. Often we have heard about tinyurl or bit.ly, so how about creating something alike of your own? Sounds interesting right? Apart from learning Django in a beginner friendly way, you will be creating a URL Shortening service of your own from scratch, and host it live on a server.

Author

Swarnabha Das

Collaborator(s)

Mridula Reddy,
Ayush Kumar Shaw

Prerequisite(s)

Git, Python Basics
25 Hours
Difficulty: Intermediate

Skills to be Learned

Python (Intermediate)
Django
MongoDB (using pymongo)
Heroku Deployment
Notify when download is available

Slack clone using React

If you’ve been looking for challenging react native projects to apply React-Redux concepts along with an opportunity to get acquainted with the fundamentals of Firebase databases, this is the perfect project to include in your resume. By the end of this project, you will be flaunting a web messaging app that provides useful features similar to Slack.

Author

Kevin Paulose

Collaborator(s)

Kiran Suresh
,
Mridula Reddy

Prerequisite(s)

React, Redux (Basic Level)
80 hours
Difficulty: Advanced

Skills to be Learned

Advanced React - Redux
Firebase
Web application development
Website hosting
Notify when download is available

TinyMCE Synonyms Plugin

Get started with building a custom plugin to search and insert synonyms within the popular TinyMCE WYSIWYG rich text editor.

Author

Parthipan Natkunam

Collaborator(s)

Kevin Paulose
,
Mridula Reddy

Prerequisite(s)

HTML, CSS, JavaScript (Intermediate level)
20 hours
Difficulty: Intermediate

Skills to be Learned

JavaScript
Web development
Plugin development
Notify when download is available

Explore our Categories!

image

Submit your Projects!

Would you like to contribute your own projects to Crio Projects Hub? Share your project with us and we will work with you to feature it here.

Submit Project