⚑ Learn JavaScript

JavaScript is the programming language of the Web. It brings web pages to life by making them interactive, handling user events, updating content dynamically, managing asynchronous operations, and building full-stack applications.

🟒 Beginner to Advanced: Start with the browser console, master core syntax, dive deep into closures, promises, async/await, DOM manipulation, OOP, and modern ES6+ features.

πŸ“– What You Will Learn

  • How JavaScript runs in browsers and Node.js
  • Variables, data types, scoping rules (var, let, const, TDZ), and hoisting
  • Control flow, operators, loops, and error handling
  • Functions, closures, higher-order functions, and callback patterns
  • Advanced array operations (map, filter, reduce) and object handling
  • Asynchronous programming, Promises, async/await, and Fetch API
  • Object-Oriented JS, Prototypes, this binding, and ES6 Classes
  • DOM selection, event bubbling, event delegation, and Web Storage APIs
  • Modular JS architecture (import/export), DevTools debugging, and building real-world projects

πŸ“š Lessons

# Topic Level Link
01 Set Up JavaScript Environment 🟒 Beginner Open lesson
02 Introduction to JavaScript 🟒 Beginner Open lesson
03 Variables (let, const, var) 🟒 Beginner Open lesson
04 Data Types & String Methods 🟒 Beginner Open lesson
05 Operators in JavaScript 🟒 Beginner Open lesson
06 Conditionals (if, switch, Ternary) 🟒 Beginner Open lesson
07 Loops (for, while, for...of, for...in) 🟒 Beginner Open lesson
08 Functions in JavaScript 🟒 Beginner Open lesson
09 Arrays & Essential Methods 🟑 Intermediate Open lesson
10 Objects, Map, Set, Date & RegExp 🟑 Intermediate Open lesson
11 Scope, Hoisting & Temporal Dead Zone (TDZ) 🟑 Intermediate Open lesson
12 Modern ES6+ Features 🟑 Intermediate Open lesson
13 Advanced Array Methods (map, filter, reduce) 🟑 Intermediate Open lesson
14 Higher-Order Functions & Closures πŸ”΄ Advanced Open lesson
15 Asynchronous JS, Promises & Async/Await πŸ”΄ Advanced Open lesson
16 Fetch API & Working with JSON πŸ”΄ Advanced Open lesson
17 Prototypes, this Keyword & Binding πŸ”΄ Advanced Open lesson
18 ES6 Classes & Object-Oriented JS πŸ”΄ Advanced Open lesson
19 DOM Selection & Manipulation 🟑 Intermediate Open lesson
20 Event Bubbling, Delegation & Web APIs πŸ”΄ Advanced Open lesson
21 Web Storage (localStorage & sessionStorage) 🟑 Intermediate Open lesson
22 Error Handling (try...catch...finally) 🟑 Intermediate Open lesson
23 JS Modules (import / export) 🟑 Intermediate Open lesson
24 Comprehensive JS Mini Projects πŸ”΄ Advanced Open lesson
25 Practical JavaScript Debugging in DevTools 🟑 Intermediate Open lesson

🎯 Suggested Learning Flow

01–08 Core Fundamentals β†’ 09–13 ES6 & Data Manipulation β†’ 14–16 Async JS & APIs β†’ 17–18 Prototypes & OOP β†’ 19–21 DOM & Storage β†’ 22–23 Errors & Modules β†’ 24–25 Mini Projects & DevTools Debugging

πŸ§ͺ Practice Routine

For each lesson:

  1. Read the explanation and study the code example.
  2. Open your browser Developer Console (F12) or VS Code Node runtime.
  3. Type out all examples manually to build muscle memory.
  4. Tweak parameters, test edge cases, and inspect output.
  5. Solve the β€œTry It Yourself” and β€œMini Challenge” tasks.

βœ… Progress Checklist

  • I can write and execute JavaScript in browsers and Node.js.
  • I understand scope, closures, lexical environment, and hoisting.
  • I can use ES6 destructuring, spread/rest, and arrow functions effortlessly.
  • I can transform arrays using map, filter, and reduce.
  • I can handle asynchronous network requests using Promises and async/await.
  • I understand this binding, prototypes, and ES6 classes.
  • I can manipulate the DOM, delegate events, and store persistent user data.
  • I built interactive mini projects using modular code architecture.
  • I can debug runtime errors using browser DevTools and breakpoints.

🧭 Navigation

← Repository Home Start with Lesson 01 β†’