90-Day MERN Stack Mastery Plan (Zero to Hero)

Welcome to your 90-day journey to master the MERN stack (MongoDB, Express, React, Node.js)! With your HTML/CSS skills, you’re starting strong. This improved plan is project-based, includes TypeScript, emphasizes debugging, and prepares you for a stellar portfolio. You’ll build three projects (To-Do API, Blog App, E-Commerce App) and a portfolio site, using tools like Postman, Vercel, and MongoDB Atlas. Dedicate 3 hours/day, 6 days/week, and use Sundays for rest or review. Let’s become a full-stack pro!

Phase 1: JavaScript, TypeScript, and Backend Foundations (Days 1–30)

Goal: Master JavaScript, TypeScript, Git, Node.js, Express, and MongoDB. Build a REST API with TypeScript.

Week 1: JavaScript and Git Basics (18 hours)

Concepts:

• JavaScript: Variables, functions, arrays, objects, ES6 (arrow functions, destructuring, promises, async/await).
• Git: Cloning, branching, committing, pushing, pull requests.
• GitHub: Repos, READMEs, .gitignore.

Tasks (3 hours/day):

• Day 1: Learn JavaScript basics (variables, loops, functions). Build a simple webpage with HTML/CSS and add a button to toggle text visibility using JavaScript. (3h)
• Day 2: Learn ES6 (arrow functions, destructuring, template literals). Refactor your webpage’s JavaScript to use ES6. Debug any issues. (3h)
• Day 3: Learn DOM manipulation. Add a form to your webpage for user input (e.g., name) and display it dynamically. Validate inputs (e.g., non-empty). (3h)
• Day 4: Learn async/await and fetch API. Fetch data from JSONPlaceholder API (e.g., posts) and display on your webpage. Handle fetch errors with try/catch. (3h)
• Day 5: Set up Git and GitHub. Create a repo for your webpage, commit changes, and push. Write a .gitignore for node_modules and a README with setup instructions. (3h)
• Day 6: Learn JavaScript modules. Split your webpage code into modules (e.g., dom.js, api.js). Debug module imports and push to GitHub. (3h)

Mentor Notes: Focus on clean code (e.g., consistent naming). Test your webpage in different browsers. Use specific commit messages (e.g., “Add ES6 refactoring for toggle”). Your README should explain how to run the project locally.

Week 2: Node.js, Express, and TypeScript Basics (18 hours)