This roadmap guides you through the complete JavaScript journey from writing your first variable to architecting production-grade applications on the frontend and backend. Work through each stage sequentially to build deep, connected knowledge. Return to earlier stages as you advance; the language reveals new depth the more you know.

JavaScript Beginner to Expert

Contents

How JavaScript Works Variables & Data Types Operators & Expressions Control Flow Functions Scope & Closures Objects Arrays & Iteration Strings & Regular Expressions Error Handling Prototypes & Inheritance ES6 Classes Asynchronous JavaScript Callbacks & Promises Asynchronous JavaScript async/await Modules DOM Manipulation Events Browser APIs Forms & Validation Performance & Rendering Node.js Fundamentals npm & Package Management Building a REST API with Express Working with Databases Authentication & Security TypeScript Testing Build Tools & Bundlers Linting, Formatting & Code Quality Advanced Patterns & Architecture

LegendRequiredRecommendedOptional

0 / 106 complete

1How JavaScript Works 2Variables & Data Types 3Operators & Expressions 4Control Flow 5Functions 6Scope & Closures 7Objects 8Arrays & Iteration 9Strings & Regular Expressions 10Error Handling 11Prototypes & Inheritance 12ES6 Classes 13Asynchronous JavaScript Callbacks & Promises 14Asynchronous JavaScript async/await 15Modules 16DOM Manipulation 17Events 18Browser APIs 19Forms & Validation 20Performance & Rendering 21Node.js Fundamentals 22npm & Package Management 23Building a REST API with Express 24Working with Databases 25Authentication & Security 26TypeScript 27Testing 28Build Tools & Bundlers 29Linting, Formatting & Code Quality 30Advanced Patterns & Architecture

01

1

How JavaScript Works

3 topics·3 required

Understand what JavaScript is, how browsers execute it, and where it runs today.

JavaScript vs HTML vs CSS

Required

The role of JS in the browser: structure, style, and behaviour.

MDN: What is JavaScript?

How Browsers Execute JS

Required

The V8 / SpiderMonkey engine, JIT compilation, and the rendering pipeline.

Script Loading Strategies

Required

Inline scripts, external files, defer vs async attributes.

02

2

Variables & Data Types

3 topics·3 required

Declare variables and understand every primitive type JavaScript provides.

var, let & const

Required

Differences in scope, hoisting, and mutability between the three declaration keywords.

MDN: var, let, const

Primitive Types

Required

String, Number, BigInt, Boolean, undefined, null, and Symbol.

typeof & Type Coercion

Required

Runtime type checking and JavaScript's implicit type conversion rules.

03

3

Operators & Expressions

3 topics·3 required

Perform calculations, comparisons, and logical operations in JavaScript.

Arithmetic & Assignment Operators

Required

+, -, *, /, %, **, and compound assignment (+=, -=, etc.).

Comparison & Equality

Required

== vs === (abstract vs strict equality) and comparison operators.

MDN: Equality comparisons

Logical & Nullish Operators

Required

&&, ||, !, ??, and optional chaining (?.).

04

4

Control Flow

3 topics·2 required·1 recommended

Direct the execution path of your programs using conditionals and loops.

Conditionals

Required

if/else if/else, ternary operator, and switch/case statements.

MDN: Control flow

Loops

Required

for, while, do-while, for...of, and for...in loops.

Break, Continue & Labels

Recommended

Control loop execution flow with break, continue, and labelled statements.

05

5

Functions

4 topics·3 required·1 recommended

Write reusable blocks of logic and understand the many ways to define functions.

Function Declarations & Expressions

Required

Named functions, anonymous functions, and the difference in hoisting behaviour.

MDN: Functions

Arrow Functions

Required

Concise syntax, implicit returns, and how arrow functions handle this.

Default, Rest & Spread Parameters

Required

Set default values, collect extra arguments with rest (...args), and spread arrays.

Higher-Order Functions

Recommended

Functions that accept or return other functions the basis of functional patterns.

06

6

Scope & Closures

4 topics·3 required·1 recommended

Understand variable visibility and how functions capture their surrounding environment.

Scope Chain

Required

Global, function, and block scope how JS resolves variable lookups.

MDN: Closures

Closures

Required

A function bundled with its lexical environment practical uses and common patterns.

Hoisting

Required

How var declarations and function declarations are moved to the top of their scope.

IIFE

Recommended

Immediately Invoked Function Expressions for scope isolation.

07

7

Objects

4 topics·3 required·1 optional

Work with key-value pairs, object methods, and understand reference semantics.

Object Literals & Property Access

Required

Create objects, access properties with dot and bracket notation, and shorthand syntax.

MDN: Working with objects

Destructuring

Required

Extract values from objects and arrays into variables using destructuring syntax.

Spread & Object.assign

Required

Copy and merge objects with the spread operator and Object.assign.

Property Descriptors

Optional

Configurable, enumerable, writable attributes and Object.defineProperty.

08

8

Arrays & Iteration

4 topics·3 required·1 recommended

Store ordered collections and process them with powerful built-in array methods.

Array Basics

Required

Creating arrays, accessing elements, push/pop/shift/unshift, and length.

MDN: Array

map, filter & reduce

Required

Transform, select, and accumulate array values with the three core functional methods.

find, some, every & flat

Required

Search, test, and flatten arrays with modern built-in methods.

Sorting & Comparators

Recommended

Sort arrays correctly with custom comparator functions.

09

9

Strings & Regular Expressions

3 topics·2 required·1 recommended

Manipulate text data and match patterns with regex.

String Methods

Required

slice, split, trim, replace, includes, startsWith, padStart, and template literals.

MDN: String

Template Literals

Required

Multi-line strings, embedded expressions, and tagged templates.

Regular Expressions

Recommended

Patterns, flags, test/match/replace with regex, and capture groups.

RegexOne: Interactive Tutorial

10

Error Handling

3 topics·2 required·1 recommended

Write resilient code that handles unexpected failures gracefully.

try / catch / finally

Required

Catch runtime errors, execute cleanup code, and re-throw selectively.

MDN: Error handling

Error Types

Required

Built-in error types: TypeError, RangeError, ReferenceError, SyntaxError, and custom errors.

Custom Error Classes

Recommended

Extend Error to create domain-specific error types with extra context.

11

Prototypes & Inheritance

3 topics·2 required·1 recommended

Understand the prototype chain the foundation of object inheritance in JavaScript.

Prototype Chain

Required

How JS looks up properties through proto and Object.prototype.

MDN: Inheritance and the prototype chain

Constructor Functions

Required

Creating objects with new and attaching methods to the prototype.

Object.create & Object.setPrototypeOf

Recommended

Manipulate the prototype chain directly without classes.

12

ES6 Classes

3 topics·2 required·1 recommended

Use class syntax as a clean abstraction over prototype-based inheritance.

Class Syntax

Required

class, constructor, methods, getters/setters, and static members.

MDN: Classes

Inheritance with extends & super

Required

Create subclasses and call parent constructors/methods with super.

Private Fields & Methods

Recommended

Encapsulate implementation details with # private class fields.

13

Asynchronous JavaScript Callbacks & Promises

4 topics·4 required

Handle operations that take time network requests, timers, and file I/O.

The Event Loop

Required

Call stack, Web APIs, callback queue, and the microtask queue explained visually.

Jake Archibald: In the Loop (video)

Callbacks & Callback Hell

Required

Traditional async pattern and why deeply nested callbacks are problematic.

Promises

Required

Creating promises, .then/.catch/.finally chaining, and promise states.

MDN: Promise

Promise Combinators

Required

Promise.all, Promise.allSettled, Promise.race, and Promise.any.

14

Asynchronous JavaScript async/await

3 topics·2 required·1 recommended

Write asynchronous code that reads like synchronous code using async/await.

async Functions & await

Required

Mark functions as async, await promise resolution, and return values.

MDN: async function

Error Handling with async/await

Required

Wrap await calls in try/catch and handle rejected promises properly.

Top-Level await

Recommended

Use await outside async functions in ES modules.

15

Modules

3 topics·2 required·1 recommended

Organise code into reusable, encapsulated files using JavaScript module systems.

ES Modules (ESM)

Required

import, export, named vs default exports, and re-exports.

MDN: JavaScript modules

CommonJS (CJS)

Required

require() and module.exports the Node.js module format.

Dynamic Imports

Recommended

import() for code splitting and lazy loading modules at runtime.

16

DOM Manipulation

4 topics·3 required·1 recommended

Interact with HTML elements and dynamically update the page from JavaScript.

Selecting Elements

Required

querySelector, querySelectorAll, getElementById, and getElementsByClassName.

MDN: DOM introduction

Modifying the DOM

Required

innerHTML, textContent, createElement, appendChild, insertAdjacentHTML, and remove.

Attributes, Classes & Styles

Required

getAttribute/setAttribute, classList (add/remove/toggle), and inline style.

DOM Traversal

Recommended

parentElement, children, nextElementSibling, and closest.

17

Events

4 topics·3 required·1 recommended

Respond to user interactions and browser events with event listeners.

addEventListener & removeEventListener

Required

Attach and detach handlers, event types, and the event object.

MDN: Events

Event Bubbling & Capturing

Required

How events propagate up the DOM tree and how to control propagation.

Event Delegation

Required

Attach a single listener to a parent to handle dynamic child elements efficiently.

Custom Events

Recommended

Create and dispatch custom events with CustomEvent and dispatchEvent.

18

Browser APIs

4 topics·2 required·2 recommended

Use the rich set of APIs built into modern browsers.

Fetch API

Required

Make HTTP requests, handle JSON responses, and manage headers and methods.

MDN: Fetch API

localStorage & sessionStorage

Required

Persist key/value data in the browser across sessions or tabs.

History & URL APIs

Recommended

pushState, replaceState, and the URLSearchParams interface.

Intersection Observer & ResizeObserver

Recommended

Efficiently detect element visibility and size changes without scroll events.

19

Forms & Validation

3 topics·1 required·2 recommended

Handle user input, validate data, and submit forms programmatically.

Form Events

Required

input, change, submit events reading values and preventing default.

MDN: HTML forms guide

Constraint Validation API

Recommended

checkValidity, setCustomValidity, and the ValidityState interface.

FormData API

Recommended

Collect and serialize form data for XHR or Fetch submissions.

20

Performance & Rendering

4 topics·2 required·1 recommended·1 optional

Write efficient JavaScript that keeps the browser responsive and animations smooth.

Reflow & Repaint

Required

What triggers layout recalculation and how to batch DOM reads/writes.

web.dev: Rendering performance

requestAnimationFrame

Recommended

Schedule visual updates in sync with the browser's paint cycle.

Debounce & Throttle

Required

Limit the rate of expensive event handlers like scroll and resize.

Web Workers

Optional

Move heavy computation off the main thread to keep the UI unblocked.

21

Node.js Fundamentals

3 topics·3 required

Run JavaScript on the server with Node.js the runtime that powers the backend.

Node.js Architecture

Required

The event loop in Node, libuv, non-blocking I/O, and the global object.

Node.js Docs

Core Modules

Required

fs, path, os, http, events, stream, and util built-in modules.

process & environment

Required

process.argv, process.env, process.exit, and stdin/stdout streams.

22

npm & Package Management

4 topics·2 required·1 recommended·1 optional

Manage third-party dependencies and publish your own packages.

npm CLI Basics

Required

init, install, uninstall, run scripts, and understanding package.json.

npm Docs

Semantic Versioning

Required

MAJOR.MINOR.PATCH versioning, caret (^), tilde (~), and lock files.

pnpm & Yarn

Recommended

Alternative package managers workspaces, performance, and hoisting differences.

Publishing Packages

Optional

Create, version, and publish a package to the npm registry.

23

Building a REST API with Express

4 topics·4 required

Create HTTP servers, define routes, and build RESTful APIs with Express.js.

Express Basics

Required

app.get/post/put/delete, route params, query strings, and request/response objects.

Express.js Docs

Middleware

Required

Built-in, third-party, and custom middleware the middleware stack execution model.

Router & Controller Pattern

Required

Organise routes with express.Router and separate business logic into controllers.

Error Handling Middleware

Required

Centralise error responses with four-argument error-handling middleware.

24

Working with Databases

3 topics·3 recommended

Persist and query data from SQL and NoSQL databases in a Node.js application.

MongoDB & Mongoose

Recommended

Documents, collections, schemas, models, and CRUD with Mongoose ODM.

Mongoose Docs

PostgreSQL with pg or Prisma

Recommended

Relational data modelling, SQL queries, and using Prisma ORM for type-safe access.

Prisma Docs

Database Patterns

Recommended

Repository pattern, connection pooling, transactions, and migrations.

25

Authentication & Security

4 topics·4 required

Protect your APIs with authentication strategies and secure coding practices.

JWT Authentication

Required

Sign, verify, and decode JSON Web Tokens for stateless authentication.

JWT.io

Password Hashing

Required

Hash passwords securely with bcrypt never store plain text.

CORS & Helmet

Required

Configure CORS policies and set secure HTTP headers with Helmet.js.

Input Validation & Sanitisation

Required

Validate request bodies with Zod or Joi; prevent injection attacks.

26

TypeScript

4 topics·3 required·1 recommended

Add static types to JavaScript for better tooling, safer refactors, and clearer intent.

Type System Basics

Required

Primitive types, arrays, tuples, enums, union/intersection types, and any vs unknown.

TypeScript Handbook

Interfaces & Type Aliases

Required

Model data shapes, extend interfaces, and choose between interface and type.

Generics

Required

Write reusable, type-safe functions and data structures with generic parameters.

tsconfig & Build Integration

Recommended

Configure the TypeScript compiler, strict mode, and integrate with Vite or tsx.

27

Testing

4 topics·1 required·2 recommended·1 optional

Ensure correctness and prevent regressions with automated tests.

Unit Testing with Vitest / Jest

Required

Write and run unit tests, use matchers, and mock dependencies.

Vitest Docs

Integration & API Testing

Recommended

Test Express routes end-to-end with Supertest.

E2E Testing with Playwright

Recommended

Automate browser interactions and assert UI behaviour with Playwright.

Playwright Docs

Test Coverage

Optional

Measure and improve code coverage; avoid chasing 100% blindly.

28

Build Tools & Bundlers

4 topics·2 required·1 recommended·1 optional

Transform, optimise, and bundle your source code for production delivery.

Vite

Required

Lightning-fast dev server with ESM, HMR, and optimised production builds.

Vite Docs

Webpack

Recommended

Entry points, loaders, plugins, code splitting, and tree-shaking with Webpack.

esbuild & Rollup

Optional

Ultra-fast builds with esbuild; library bundling with Rollup and ES output formats.

Environment Variables

Required

Manage .env files, secrets, and environment-specific config across builds.

29

Linting, Formatting & Code Quality

3 topics·2 required·1 recommended

Enforce consistent code style and catch bugs before runtime.

ESLint

Required

Configure ESLint rules, shareable configs (Airbnb, Standard), and custom plugins.

ESLint Docs

Prettier

Required

Opinionated code formatter integrate with ESLint and your editor.

Husky & lint-staged

Recommended

Run linters on staged files as a pre-commit Git hook.

30

Advanced Patterns & Architecture

4 topics·2 recommended·2 optional

Write maintainable, scalable JavaScript with proven architectural patterns.

Design Patterns

Recommended

Observer, Factory, Singleton, Strategy, and Decorator patterns in JS.

Patterns.dev

Functional Programming

Recommended

Immutability, pure functions, function composition, currying, and monads.

Event-Driven Architecture

Optional

Build decoupled systems with EventEmitter, pub/sub, and message queues.

Monorepos

Optional

Manage multiple packages in a single repo with Turborepo or Nx.

Reset Progress?

This will clear all your checked topics in this roadmap. This action cannot be undone.

Comments

You might also enjoy

Check out some of our other posts on similar topics

Frontend Developer Beginner to Expert

Mohammad Abu Mattar
Web development

Frontend Developer Beginner to Expert This roadmap walks you from absolute beginner to a strong, hireable frontend engineer. Work through the stages in order: the early ones build the mental model

#Frontend #Html #Css+5 tags

DevOps Engineer Beginner to Expert

Mohammad Abu Mattar
Devops
Cloud

This roadmap guides you from Linux fundamentals through to advanced platform engineering and MLOps. Each stage builds on the last work through them sequentially to develop a deep, well-rounded DevOps

#Devops #Linux #Docker+4 tags

Solutions Architect Beginner to Expert

Mohammad Abu Mattar
Cloud
Architecture

This roadmap guides you from cloud fundamentals through to professional-level AWS solutions architecture. Each stage builds on the last master the foundations before tackling advanced networking, secu

#Aws #Solutions architect #Cloud+3 tags

Site Reliability Engineer Beginner to Expert

Mohammad Abu Mattar
Sre
Cloud
Devops

This roadmap takes you from the fundamentals of Linux and systems thinking through to advanced observability, chaos engineering, and SRE organisational culture. Each stage builds on the last master re

#Sre #Aws #Observability+3 tags

Release Engineer Beginner to Expert

Mohammad Abu Mattar
Devops
Cloud
Release engineering

This roadmap takes you from release engineering principles and version control mastery through to advanced GitOps patterns and multi-account AWS delivery at scale. Each stage builds on the last treat

#Aws #Ci cd #Terraform+4 tags