Open In App

100 Days of Web Development – A Complete Guide For Beginners

Last Updated : 13 Mar, 2024
Like Article

How to become Web Developer? 

What is the salary of a Web Developer?

What are the skills required to become a web developer? 

How many days will it take to become a web developer?

To answer all these questions and give you a correct pathway, we have come up with 100 Days of Web Development that will guide you day-by-day on how to become a full-stack web developer.

From Social Media Apps to watching and reading News, Streaming OTT platforms, doing payments, or connecting with colleagues, we need technology and that particular technology is Web Technology. According to the data of the Bureau of Labor Statistics(2021), there were 197,100 Jobs, 45,500 Employment Changes, and 30.3% Employment Growth for web developers between 2021 and 2031 which is much faster than the average rate.

100 Days of Web Development – A Complete Guide For Beginners

Today, whenever we need to search for anything we just Google it, and it suggests n number of links to different websites which eventually leads us to Web pages.

Web pages, what are those?

Digital documentation of information that contains text, images, links, and multimedia can be displayed through a web browser. So, ever imagined, How they are created? Don’t worry we are going to take a deeper dive into it.

What is Web Development?

Web development is a rapidly growing field as most businesses and organizations are relying on websites and web apps to reach out to their target audience. Creation of web pages using Hypertext Markup Languages(HTML) which defines the structure and content of the page.

In this journey of 100 days of Web development we are going to learn the:

Web Development = Front-End + Back-End + Database

Front-End Web Development (Day 1 – Day 65)

What is Front-End Web Development?

Front-end Development is the creation of that part of the website which is used by the user directly. From User Interface to Layout and Visual Design whatever we see on the browser comes under the umbrella of-Front End Web Development. It includes the tasks such as designing Web pages, Creating Navigation Bars, Implementing forms, and adding some interesting features such as Animations and Hover effects.

Front-End development is not limited to HTML, CSS, and Javascript. Once you are done with the basics. Then there is more to explore such as Frontend Frameworks like React, Next, and Angular. Not only the frameworks, if you don’t want to focus on the code then we can shift it to UI and UX.

Introduction to HTML (Day 1 – Day 5)

Advance HTML / HTML 5 (Day 6 – Day 10)

Introduction to CSS (Day 11 – Day 15)

Advance CSS (Day 16  – Day 20)

Introduction to Bootstrap (Day 21)

Introduction to Tailwind CSS (Day 21)*

Advance Bootstrap (Day22- Day23)

Advance Tailwind CSS (Day22- Day23)*

*The number of days can vary in learning Tailwind CSS.

Projects Related to HTML, CSS, and Bootstrap (Day 24 – Day25)

Introduction to JavaScript (Day 26 – Day 35)

Advance JavaScript (Day36 – Day45)

Projects Related to JavaScript (Day 46 – Day 47)

For more projects related to HTML, CSS, and JavaScript visit Web Development Projects

Front-End Frameworks (Day 48  – Day 65)

What is a Frontend Framework?

Basically, it is a collection of prewritten Code and Libraries which makes the job of a web developer easy by building Web Applications quickly and efficiently. There are many frameworks/libraries in the field but we would be focusing on the two major frameworks/libraries of JavaScript.



Note: Please choose any one framework from the above-mentioned to continue the journey.

For Front-End Development, you can explore the following:

Back-End Web Development (Day 66 – Day 85 )

What is Back-End Development?

Backend Development can be referred to as the process of developing and maintaining the server side of Web Applications. Basically, the Backend of a web application is responsible for the tasks that occur on the server, such as retrieving data from clients, fetching requests

Backend Language (Day 66 – Day 75)



Node JS


Note: Pick any one from the above-mentioned according to your interest and scope.

API (Day 76 – Day 78)

Back-End Frameworks (Day 79  – Day 85)

What is a Back-End Framework?

The frameworks that are designed to support the development at the server side of the application are referred to as Back-End Frameworks. The motive of these frameworks is to provide a set of tools and libraries to the developers which make it easier to Build, Deploy and Manage Web Applications.

There are many backend frameworks in the field but we would be focusing on the 4 major backend development frameworks according to your chosen backend language.

Django (Python)

Laravel (PHP)

Express JS (Node JS)

Ruby on Rails (Ruby)

Version Control (Day 86)

Databases (Day 87 – Day 95)

What is a Database?

An organized collection of data that can be stored, accessed, and modified remotely with the help of the internet is called a Database. Basically, it can be referred to as a Digital Filing System that is used for the Storage and Retrieval of data.

A Database can be used in a variety of applications such as Social Media Platforms, E-Commerce websites, Online Banking Systems, etc. The main motive of Databases is to store large amounts of information securely and efficiently and then provide fast access to that information.

We would be discussing three major Databases which are capable of performing all tasks required.

Mongo DB



Note: Please pick one of the above three mentioned Databases as per your preference.


Projects (Day 95 – Day 100)

  • E-Commerce Platform
  • Social Media App
  • Data Analytics App
  • Food Delivery App
  • Content Management System

For more related projects visit 12 Best Full Stack Project Ideas in 2023

Don’t forget to explore the Full Stack Web Development Courses by GeeksforGeeks

Like Article
Suggest improvement
Share your thoughts in the comments

Similar Reads