60-Day JavaScript Mastery Planner
Phase 1: JavaScript Fundamentals (Days 1-15)
Day 1: Setup - Install VS Code + write first script in browser
Day 2: Variables & Data Types - Practice let, const, strings, numbers
Day 3: Operators & Expressions - Try +, -, ===, %, typeof
Day 4: String & Number Methods - Use .length, .toUpperCase(), .toFixed()
Day 5: Calculator Project - Build simple calculator in browser console
Day 6: if, else - Test grading system logic
Day 7: switch & logic - Rewrite if using switch, test &&, ||
Day 8: Loops - Print patterns, even/odd, etc.
Day 9: Nested Loops - FizzBuzz challenge
Day 10: Quiz Game - Build 3-question quiz using prompt()
Day 11: Functions - Create greeting, sum, and square functions
Day 12: Arrow Functions - Convert all to arrow syntax
Day 13: Scope - Experiment with global vs local
Day 14: Closures - Create simple closure with counter
Day 15: Tip Calculator - Build tip calculator with user input
Phase 2: Intermediate Concepts (Days 16-35)
Day 16: Arrays - Add/remove items from list
Day 17: Array Methods - Practice .map(), .filter()
Day 18: Objects - Create a student object with nested address
Day 19: Object Loops - Use for...in, Object.entries()
Day 20: Todo CLI App - Console-based app with object + array
Day 21: DOM Selectors - Use querySelector, innerText
Day 22: DOM Events - Use click, keyup, submit
Day 23: DOM Elements - createElement(), .remove()
Day 24: Color Changer - Button that changes background color
Day 25: Interactive Form - Validate input before submission
Day 26: Callbacks - Pass functions to other functions
Day 27: Timers - Timer and stopwatch
Day 28: Recursion - Factorial and countdown recursively
Day 29: Higher-Order Functions - Practice .forEach(), .reduce()
Day 30: Countdown Timer - User sets time, then countdown
Day 31: Destructuring - Split arrays & objects
Day 32: Spread/Rest - Clone arrays, combine parameters
Day 33: Template Literals - Interpolate text in template
Day 34: Default Params - Write safe functions
Day 35: Refactor - Rewrite old code with ES6 syntax
Phase 3: Advanced Concepts & Projects (Days 36-60)
Day 36: Promises - Simulate async with setTimeout()
Day 37: fetch API - Get data from JSONPlaceholder
Day 38: Async/Await - Convert promise to async/await
Day 39: JSON - Work with JSON.parse() and JSON.stringify()
Day 40: Weather App - Get and display live weather
Day 41: Constructor Functions - Use this to make objects
Day 42: Prototypes - Create prototype method on object
Day 43: ES6 Classes - Use class and extends
Day 44: Inheritance - Create subclass (e.g., Animal -> Dog)
Day 45: Mini Game - Rock Paper Scissors logic + UI
Day 46: Error Handling - Use try, catch, throw
Day 47: Debugging - Use debugger and DevTools
Day 48: Clean Code - Rename variables, avoid repetition
Day 49: ES Modules - Split and import files
Day 50: Linting - Setup ESLint in VS Code
Day 51: Webpack - Install + bundle simple code
Day 52: GitHub - Push a project to GitHub
Day 53: Hosting - Deploy your weather app
Day 54: Memory Game - Create memory card game
Day 55: Portfolio - Create personal project page
Day 56: Final Plan - Outline large final project
Day 57: Final Build Pt.1 - Start building final project
Day 58: Final Build Pt.2 - Complete final project
Day 59: Polish - Host on GitHub Pages or Netlify
Day 60: Review - Write README, plan next stack