Week 1: Frontend with React.js (Days 1–7)

📍 Day 1 – Web Dev Overview + JavaScript Refresher

• HTML/CSS recap
• Modern JavaScript (ES6+): let/const, arrow functions, promises
• Git/GitHub intro

📍 Day 2 – React Basics

• What is React? How it works (DOM, Components)
• Create React App setup
• JSX, Functional Components, Props

📍 Day 3 – React State & Events

• useState hook
• Handling form inputs, buttons
• Conditional rendering

📍 Day 4 – React Lists & Forms

• Rendering lists with .map()
• Controlled components
• Form validations (basic)

📍 Day 5 – React Router

• Setting up react-router-dom
• Route, Link, useParams, useNavigate
• Nested routes

📍 Day 6 – useEffect & API Calls

• useEffect hook
• Fetching data from APIs
• Handling loading and error states

📍 Day 7 – React Mini Project

• Build a Blog UI / Todo App / Weather App
• Use React Router + API calls

Week 2: Backend with Node.js + Express + MongoDB (Days 8–14)

📍 Day 8 – Intro to Node.js & Express

• What is Node.js?
• Creating your first server
• Routes, Middleware, Nodemon

📍 Day 9 – REST API Basics

• REST principles
• CRUD endpoints (GET, POST, PUT, DELETE)
• JSON responses

📍 Day 10 – MongoDB & Mongoose

• MongoDB basics (collections, documents)
• Connect using Mongoose
• Create Models and Schemas

📍 Day 11 – CRUD with MongoDB

• Create, Read, Update, Delete documents
• Postman testing
• Error handling

📍 Day 12 – Authentication with JWT

• Register/Login API
• Hashing with bcrypt
• JWT token creation and verification

📍 Day 13 – Middleware & Validation

• Custom middleware
• Input validation with express-validator or Joi
• Protecting routes

📍 Day 14 – Backend Mini Project

• Build an Auth + CRUD API (e.g., Notes app or Task manager)
• Test with Postman

 Week 3: Full-Stack Integration + Deployment (Days 15–21)

📍 Day 15 – Connect Frontend to Backend

• Proxy setup in React
• Axios for HTTP requests
• Full-stack Login/Register

📍 Day 16 – Protected Routes & Local Storage

• Store JWT in localStorage
• Conditional UI based on login state
• Logout and token expiration handling

📍 Day 17 – Advanced Features

• Pagination, Search, Filtering
• User roles & permissions
• File uploads (e.g., user profile pics)

📍 Day 18 – UI with Tailwind/Bootstrap

• Setup styling framework
• Create clean, responsive layouts
• Reusable components

📍 Day 19 – Final Project Build

Choose one:

• Blog App
• E-commerce Store
• Notes App with login
• Social Media Dashboard

📍 Day 20 – Deployment (Full Stack)

• Deploy frontend on Vercel/Netlify
• Deploy backend on Render/Railway/Heroku
• MongoDB Atlas setup

📍 Day 21 – Wrap-up & Career Prep

• Push project to GitHub
• Build resume + portfolio
• MERN interview questions
• Freelancing tips (Fiverr, Upwork)

🧰 Tech Stack & Tools:

• Frontend: React, React Router, Axios, Tailwind/Bootstrap
• Backend: Node.js, Express.js, JWT, bcrypt, Mongoose
• Database: MongoDB + MongoDB Atlas
• Deployment: Vercel, Render, GitHub

🎓 What You’ll Have by Day 21:

✅ One complete full-stack project ✅ RESTful API built from scratch ✅ GitHub portfolio ✅ Ready for internships or freelance jobs