21 Days Frontend Challenge
Day 1

Digital Clock

Create a real-time digital clock using JavaScript. The time should update every second without refreshing the page.

Go to link →
Day 2

Theme Toggle

Build a dark/light mode toggle. Save user preference in localStorage so it persists after reload.

Go to link →
Day 3

Responsive Navbar

Create a responsive navbar with a hamburger menu for mobile devices. Clicking should toggle menu visibility.

Go to link →
Day 4

Image Slider

Build an image slider with next/previous buttons and optional auto-slide feature.

Go to link →
Day 5

Form Validation

Design a login/signup form with real-time validation and proper error messages.

Go to link →
Day 6

To-Do App (Basic)

Create a basic to-do app where users can add and delete tasks dynamically.

Go to link →
Day 7

To-Do App (Advanced)

Enhance the to-do app with edit, mark complete, and localStorage functionality.

Go to link →
Day 8

Notes App

Build a notes app where users can create and save notes using localStorage.

Go to link →
Day 9

Weather App

Create a weather app using an API to fetch and display real-time weather data

Go to link →
Day 10

Product Filter UI

Display a list of products and implement filtering based on category or search input.

Go to link →
Day 11

Quiz App

Build a quiz app with multiple questions, score tracking, and timer functionality.

Go to link →
Day 12

Password Generator

Create a password generator with options like length, symbols, numbers, etc.

Go to link →
Day 13

Search with Debounce

Implement a search input that delays API/function calls using debouncing.

Go to link →
Day 14

Modal / Popup System

Build a reusable modal component that can open and close with buttons.

Go to link →
Day 15

E-commerce Product Page

Create a product listing page with UI and add-to-cart functionality.

Go to link →
Day 16

Cart System

Implement a cart system with quantity management and total price calculation.

Go to link →
Day 17

Login/Signup UI

Build authentication UI with validation and store user data in localStorage.

Go to link →
Day 18

Dashboard UI

Design a dashboard layout with sidebar, cards, and basic data display.

Go to link →
Day 19

Blog UI

Create a blog page where posts are rendered dynamically from data.

Go to link →
Day 20

Final Project

Choose and build a complete project like Netflix clone, portfolio, or dashboard.

Go to link →
Day 21

Deployment

Deploy your project using Netlify or Vercel and share on LinkedIn and GitHub.

Go to link →