Day 1: Introduction to Full Stack Development
What is Full Stack Development?
Frontend vs Backend
Tech stacks: MERN, MEAN, LAMP
Day 2: Setting Up the Development Environment
Installing VS Code
Installing Node.js, npm
Setting up Git and GitHub
Day 3: HTML Basics
Structure of HTML5 document
Tags: headings, paragraphs, links, images
Lists and tables
Day 4: CSS Basics
Selectors and properties
Styling text, box model, colors, backgrounds
Layouts with display and position
Day 5: Responsive Design with CSS
Media queries
Flexbox and Grid
Mobile-first approach
Day 6: JavaScript Basics
Variables, data types, operators
Loops and conditionals
Functions and scope
Day 7: DOM Manipulation
Selecting and modifying elements
Event handling
Creating interactive UI
Day 8: Advanced JavaScript
Objects and arrays
ES6 features: let/const, arrow functions, spread/rest
Day 9: JavaScript Projects
Build a To-Do List or Calculator app
Day 10: Introduction to Git and GitHub
Version control basics
Pushing code to GitHub
Branches and pull requests
Day 11: Introduction to Bootstrap or Tailwind CSS
Responsive design using utility classes
Buttons, navbars, forms, modals
Day 12: Introduction to React.js
What is React?
JSX and components
Creating your first React app
Day 13: React State and Props
Managing state in components
Passing data with props
Day 14: React Event Handling and Forms
Handling user inputs
Controlled vs uncontrolled components
Day 15: React Routing with React Router
Creating multiple pages
Navigating with Link and Routes
Day 16: React Project - Task Tracker
Build a small React app
Day 17: Introduction to Backend (Node.js)
What is Node.js?
Node.js modules and basics
Day 18: Building a Simple Server with Express.js
Creating endpoints
Handling requests and responses
Day 19: REST API Basics
HTTP methods: GET, POST, PUT, DELETE
Creating a CRUD API
Day 20: MongoDB and Mongoose
Introduction to NoSQL
Creating schemas and models
Day 21: Connecting MongoDB with Node.js
Saving and retrieving data
Basic queries and updates
Day 22: User Authentication (JWT)
Creating login/signup system
Using JSON Web Tokens for authentication
Day 23: Middleware and Error Handling
Creating and using middleware
Global error handlers
Day 24: Deployment Basics
Hosting frontend with Netlify or Vercel
Hosting backend with Render or Railway
Day 25: Full Stack Integration
Connecting React frontend to Express backend
Fetching and sending data using Axios or Fetch
Day 26: CORS and Environment Variables
Handling cross-origin requests
Using .env for secrets
Day 27: Full Stack Project Planning
Choose a mini project: Blog, Task Manager, Notes App
Create wireframes and plan architecture
Day 28: Full Stack Project Development
Implement frontend, backend, database connection
Day 29: Full Stack Project Completion
Finalize features
Test and debug
Day 30: Deployment and Presentation
Deploy full stack app
Write README, record demo or present