JavaScript Curriculum: Beginner to Mastery
Phase 1: JavaScript Fundamentals (2-4 weeks)
Goals: Understand syntax, data types, functions, and control flow.
Topics:
- Variables (let, const)
- Data Types (strings, numbers, booleans, arrays, objects)
- Operators and Expressions
- Conditionals (if, else, switch)
- Loops (for, while, forEach)
- Functions (declaration, expression, arrow functions)
- Scope and Hoisting
- Arrays and Objects (methods, manipulation)
Projects:
- Tip Calculator
- Quiz App
- Rock Paper Scissors Game
Phase 2: DOM Manipulation & Events (2-3 weeks)
Goals: Interact with the webpage using JS.
Topics:
- DOM (selecting elements, traversing, modifying)
- Event Listeners (click, keyup, etc.)
- Event Bubbling & Delegation
- Form handling
- setTimeout, setInterval
Projects:
- To-Do List
- Modal Popup
- Countdown Timer
Phase 3: Intermediate JavaScript & ES6+ (3-4 weeks)
Goals: Write cleaner, modern, reusable JavaScript.
Topics:
- Template literals
- Destructuring
- Spread & Rest Operators
- Array Methods (map, filter, reduce)
- Callbacks and Promises
- Fetch API (basic HTTP requests)
- Local Storage
- Error Handling
Projects:
- Weather App using API
- Currency Converter
- Notes App with local storage
Phase 4: Advanced JavaScript (4-6 weeks)
Goals: Understand inner workings of JavaScript.
Topics:
- Closures
- Prototypes and Inheritance
- 'this' keyword and binding
- Execution Context & Call Stack
- Event Loop & Async JS
- Classes and OOP in JS
- Modules (ES6 imports/exports)
Projects:
- Custom Slider
- Stopwatch
- Book Library (OOP style)
Phase 5: Asynchronous JavaScript & APIs (2-3 weeks)
Goals: Communicate with external services.
Topics:
- Fetch API & Promises
- Async/Await
- Error handling
- Working with real APIs (e.g., OpenWeather, TMDB)
Projects:
- Movie Search App
- GitHub Profile Finder
- Chat App (dummy version)
Phase 6: JavaScript in the Browser (4-6 weeks)
Goals: Deepen interaction with the web.
Topics:
- Web Storage: localStorage, sessionStorage
- Web APIs: Geolocation, Notifications
- Browser Events
- Performance Optimization
Projects:
- Budget Tracker
- Drag & Drop Kanban Board
- Shopping Cart
Phase 7: Mastery & Advanced Concepts (4-8 weeks)
Goals: Master the language + prep for frameworks.
Topics:
- Functional Programming (pure functions, currying, composition)
- Custom Data Structures
- Algorithmic Thinking
- Design Patterns in JS (Factory, Observer, Module, Singleton)
- Testing (Jest or Vitest)
- TypeScript Basics (optional)
Projects:
- Build a custom framework (mini jQuery or React clone)
- Create a JS game (e.g., Snake, Chess, Platformer)
Daily/Weekly Routine Example
Daily: 1 hour learning + 1 hour coding
Weekly:
- 3 mini projects
- 1 code review or reflection session
- 1 deep-dive topic or concept