JavaScript Tutorials

Browser Storage: localStorage, sessionStorage, and IndexedDB

Learn browser storage with localStorage, sessionStorage, and IndexedDB — when to use each API for saving preferences, caching data, and offline support.

Fetching Data: fetch vs XMLHttpRequest

Learn how to fetch data with fetch() and XMLHttpRequest. Compare both browser HTTP request APIs and decide when to use each one in your projects.

Getting the User's Location with the Geolocation API

Learn how to use the Geolocation API to get a user's location in the browser. Covers getCurrentPosition, watchPosition, permissions, and privacy best practices.

Using the Notifications API to send desktop notifications

Learn how to use the browser Notifications API to display desktop notifications to users, request permission, and handle notification events.

Using the Clipboard API to copy and paste text in JavaScript

Copy and paste text with the Clipboard API in JavaScript. Covers writeText, readText, permissions, browser requirements, and fallback for older browsers.

The Intersection Observer API for Viewport Detection

Learn how to detect when elements enter or leave the viewport using the Intersection Observer API for performant lazy loading and scroll-based features.

How to use the Resize Observer API in JavaScript

Track element size changes with the Resize Observer API to build responsive components, dynamic layouts, and interfaces that adapt to container resizing.

The Mutation Observer API for Detecting DOM Changes

Learn how to detect and respond to DOM changes using the Mutation Observer API for monitoring element additions, attribute changes, and text modifications.

Web Workers: Running Code Off the Main Thread

Learn how to use Web Workers to run JavaScript in background threads, keeping your UI responsive during heavy computations.

Browser Service Workers: Offline Caching and Network Interception

Learn how to use service workers to cache resources, enable offline functionality, and intercept network requests for faster web applications.

Browser WebSockets: Real-Time Bidirectional Communication

Learn browser WebSockets for persistent bidirectional communication. Build real-time features like chat and live updates with the WebSocket API.

IndexedDB Client-Side Databases: A Practical Browser Storage Tutorial

Learn IndexedDB client-side databases in the browser. Store structured data, run transactional writes, use cursors, and build reliable offline-first apps.

File Uploads: Client to Server to Storage

Handle file uploads end-to-end with working code. FormData, fetch, multer, S3 presigned URLs, validation, and security — all with copy-paste examples.

Full-Stack JavaScript Project Setup with Node.js and Vite

Learn to structure and run a full-stack JavaScript app with Express and Vite. Covers project layout, proxy, env variables, and running both servers together.

Client-Server Communication Patterns

Master client-server communication in JavaScript: REST APIs with fetch and axios, persistent WebSocket connections, and Server-Sent Events for real-time data.

Full-Stack Form Handling and Validation

Build secure full-stack forms with HTML5 constraint validation, Express backend validation using Zod, and CSRF protection.

Server Rendering vs. Client Rendering

Server rendering vs. client rendering: when to render on the server for fast first paint and reliable SEO, and when client rendering makes more sense.

Real-Time Features with WebSockets

Build real-time features with WebSockets: chat, live dashboards, collaborative tools. Covers server setup, scaling, rooms, auth, and production deployment.

Integration Testing a Full-Stack App

A practical guide to integration testing for full-stack JavaScript. Covers API testing with Vitest and Supertest, database rollback, and auth flows.

The Decorator Pattern in JavaScript

Learn how to extend objects at runtime using the Decorator Pattern in JavaScript. Covers function decorators, class decorators, and the TC39 proposal.

The Module Pattern in JavaScript

Learn how to use the module pattern to encapsulate code, create private state, and organize your JavaScript applications.

Factory and Abstract Factory Patterns in JavaScript

Learn factory functions and the abstract factory pattern for creating objects flexibly in JavaScript, from simple factories to theme-based object families.

Observer and Pub/Sub Patterns in JavaScript

Master the observer pattern and pub/sub for building decoupled, event-driven JavaScript applications with custom event emitters.

The Singleton Pattern in JavaScript

Learn how to implement the Singleton pattern in JavaScript to ensure a class has only one instance with global access point.

Strategy Pattern in JavaScript: Swap Algorithms at Runtime

Learn the Strategy Pattern in JavaScript: swap interchangeable algorithms at runtime with examples for payments, form validation, and shipping.

Command Pattern in JavaScript: Encapsulation, Undo, and Queuing

Learn the Command pattern in JavaScript — turns requests into objects for undo/redo, queuing, and decoupling invokers from receivers in your design.

State Machines in JavaScript Using XState

Learn how to implement state machines in JavaScript using XState: manage complex application logic with predictable, visualizable state transitions.

Iterator and Generator Patterns in JavaScript

Learn iterator and generator patterns in JavaScript: custom iterables, lazy sequences, tree walkers, async data streams, and composable pipelines.

The Proxy Design Pattern in JavaScript

Learn how to use the Proxy Design Pattern in JavaScript with ES6 Proxy for property validation, lazy loading, logging, and access control.

Pure Functions and Side Effects

Learn what pure functions are, how side effects impact your JavaScript code, and why they matter for writing predictable, testable programs.

Higher-Order Functions in JavaScript: map, filter, compose

Learn how JavaScript higher-order functions let you pass and return functions to build reusable, declarative code.

Understanding Immutability in Modern JavaScript

Learn JavaScript immutability: use spread operators and array methods for immutable updates, structuredClone for deep copies, and keep React state predictable.

Function Composition and Pipelines

Learn function composition in JavaScript with compose and pipe. Build readable data pipelines from small, reusable functions for clean, maintainable code.

Currying and Partial Application

Learn how currying and partial application let you transform JavaScript functions into reusable, composable pieces.

Functors and Monads in JavaScript: From Array.map to Promise Chains

Learn how functors and monads work in JavaScript through Array.map, Promise.then, custom Maybe types, and Either for error handling with composable chains.

Algebraic Data Types in JavaScript: Product and Sum Types

Learn how algebraic data types work in JavaScript, including product types, sum types, and discriminated unions with TypeScript type narrowing.

JavaScript Fundamentals: Variables and Types

Master JavaScript fundamentals: learn the difference between var, let, and const, and all seven primitive types including string, number, and boolean.

Functions and Scope in JavaScript

Master functions and scope in JavaScript: learn declarations, expressions, arrow functions, understand variable scope, and harness the power of closures.

JavaScript Fundamentals: Objects and Arrays

Master objects and arrays in this JavaScript fundamentals tutorial—learn to create, manipulate, and use these essential data structures in real applications.

JavaScript Fundamentals: Control Flow

Master JavaScript fundamentals of control flow with if/else, switch, loops, and practical patterns like FizzBuzz for directing program execution paths.

JavaScript Fundamentals: Classes in JavaScript

JavaScript fundamentals of classes: constructors, methods, getters/setters, static members, inheritance, and private fields for clean encapsulation.

Error handling in JavaScript: try/catch and beyond

Master error handling in JavaScript with try/catch blocks, custom error classes, async error patterns, and debugging tactics that keep production apps healthy.

Working DOM in JavaScript: Select, Create, and Modify

A hands-on tutorial for working DOM manipulation in JavaScript: select elements, handle events, build interactive pages, and master core DOM skills.

JavaScript Callbacks, Promises, and async/await: A Practical Guide

Master JavaScript callbacks, promises, and async/await. Learn to handle async operations, chain requests, manage errors, and pick the right pattern.

JavaScript Fundamentals: ES Modules: import and export

Learn how ES Modules organize JavaScript code — a core part of JavaScript fundamentals for building maintainable applications with modern tooling.

JavaScript Symbols, Iterators, and Custom Iterables

Master JavaScript symbols iterators and the iterator protocol. Learn well-known symbols, create custom iterables, and use for...of loops effectively.

Designing a REST API with Node.js

Learn to design a REST API with Node.js and Express — from routing and middleware patterns to error handling and stable response shapes that scale

Deploying Node.js Applications with Docker

Learn deploying Node.js applications with Docker using multi-stage builds, non-root users, healthchecks, and env variable management for production.

Getting Started with Node.js: Install, npm, and First Server

Getting started with Node.js: learn what Node.js is, how to install it with nvm, run your first script, use npm, and build a basic HTTP server.

Node.js Essentials: Modules and npm

Learn Node.js essentials for creating, importing, and sharing modules, plus how to use npm to manage dependencies in your projects.

Working with the File System in Node.js

A practical guide to working with the file system in Node.js. Covers reading, writing, and manipulating files with fs, fs/promises, streams, common patterns.

Database Integration (SQL and NoSQL)

Connect Node.js to PostgreSQL and MongoDB: use the pg driver and Mongoose for database integration, connection pooling, and security best practices.

Building HTTP servers with Node.js from scratch

Learn building HTTP servers using the Node.js http module. Handle routes, process requests, read request bodies, and set response headers without a framework.

Node.js Essentials: Building a Web App with Express

Build a complete web app from scratch in this Node.js Essentials tutorial. Covers Express.js routing, middleware, form handling, and static file serving.

Node.js Streams: Efficient Data Processing Guide

Node.js streams let you process large data chunk by chunk, keeping memory usage low. Learn readable, writable, and transform streams with examples.

Node.js logging and monitoring: structured logs in production

Master Node.js logging and monitoring in production with structured logging, Pino, Winston, process events, and production best practices for observability.

Node.js Worker Threads: Parallel Processing with worker_threads

Learn how to use Node.js worker threads for CPU-intensive tasks. Offload heavy computations from the event loop and improve application performance.

Middleware Patterns in Node.js

Master middleware patterns in Express.js — learn how to create, chain, and compose middleware functions for scalable Node.js applications.

Performance Profiling and Optimization

A step-by-step guide to performance profiling in Node.js: measure function latency, profile CPU with --cpu-prof, and capture heap snapshots.

Rate Limiting and Security Headers in Node.js

Protect Node.js APIs with rate limiting and security headers. Use express-rate-limit for per-endpoint throttling and helmet to harden HTTP response headers.

Input Validation and Sanitization in Node.js

Master input validation in Node.js with Zod, Joi, Yup, and express-validator. Learn to sanitize data, stop XSS and SQL injection, and keep your app secure.

Node.js Error Handling in Production: Patterns and Best Practices

A practical guide to Node.js error handling in production: custom error classes, Express middleware, structured logging, and graceful shutdown.

Building Custom Hooks in React: Patterns and Gotchas

Learn patterns for building custom React hooks. Covers useToggle, useLocalStorage, useFetch, useDebounce with rules, testing, and common gotchas.

Setting Up a React Project: Introduction and First Steps

Learn React project setup with Vite, JSX fundamentals, components, props, and state, and build your first React app from scratch with this step-by-step guide.

Building Components and JSX in React

Learn how building components with JSX in React works. Covers expressions, props, conditional rendering, list keys, and component composition.

React Context API and useReducer for State Management

Learn how React Context eliminates prop drilling and how useReducer manages complex state logic, with patterns for combining both into a lightweight store.

Understanding React Props and State Management

Understanding React props and state for interactive components. Covers useState patterns, unidirectional data flow, lifting state, and props vs. state.

Event handling in React: synthetic events and controlled components

Master React event handling , synthetic events, onClick, onChange, form control, stopPropagation, and custom events for building interactive UIs.

React Hooks Basics: useState and useEffect for State Management

Learn useState and useEffect hooks in React to manage component state, side effects, lifecycle behavior, dependency arrays, and cleanup in function components.

Performance Patterns and Memoization

Optimize React renders with React.memo, useMemo, and useCallback. These performance patterns skip wasted recalculations and re-renders.

JavaScript Testing: Getting Started

JavaScript testing fundamentals: from why tests matter to writing your first assertions with Jest and Vitest. Covers unit, integration, and E2E strategies.

Unit testing with Jest: a hands-on guide to JavaScript test automation

A practical guide to unit testing with Jest — the most popular JavaScript testing framework. Covers matchers, setup, async testing, mocking, and best practices.

Unit Testing with Vitest: A Fast, Modern Test Runner

Learn unit testing with Vitest, the Vite-powered test runner for JavaScript. Covers setup, matchers, mocking, async testing, snapshots, and coverage.

Testing asynchronous code with Jest and Vitest

Learn testing asynchronous JavaScript code with Jest and Vitest. Covers promises, async/await, timers, callbacks, and concurrent operations with real examples.

Mocking Modules and Dependencies

Learn mocking modules in Jest and Vitest — replaces dependencies with controlled test doubles so your unit tests stay fast, reliable, and isolated.

Testing DOM code with jsdom in Node.js: a tutorial

Learn testing DOM code in Node.js with jsdom. Covers setup with Jest, querying and mutating elements, testing events, form validation, fixtures, and pitfalls.

End-to-end testing with Playwright in JavaScript

Learn end-to-end testing with Playwright for JavaScript, from basic assertions to advanced browser automation for modern web applications.

Code Coverage and CI Integration

Learn how to measure code coverage, interpret coverage reports, and integrate testing into your CI pipeline for reliable JavaScript projects.

Snapshot Testing in Jest and Vitest: Patterns and Best Practices

Master snapshot testing in JavaScript with Jest and Vitest. Learn when to use snapshots, how to manage them, and best practices for effective test maintenance.

Getting Started with TypeScript: Setup and First Project

A getting started guide to TypeScript covering installation, basic types, compiler configuration, and your first project with practical examples.

TypeScript types and interfaces: a complete tutorial

TypeScript types and interfaces explained: aliases, unions, extension, generics, index signatures, and when to choose a type over an interface.

TypeScript Generics: Type-Safe Reusable Code

Learn TypeScript generics from basic parameters to constraints. Build reusable, type-safe functions, interfaces, and classes with practical examples.

Type Narrowing and Guards in TypeScript

Master TypeScript type narrowing with typeof, custom type guards, the in operator, and discriminated unions to refine union types and catch compile-time bugs.

TypeScript Utility Types: A Complete Tutorial

Master TypeScript utility types including Partial, Required, Pick, Omit, Record, Extract, Exclude, ReturnType, and Parameters to transform types efficiently.

TypeScript Mapped Types: Transform Object Shapes

Transform TypeScript mapped types into real type-safety gains. Covers key remapping, conditional filtering, and patterns for form types and API responders.

Conditional Types in TypeScript

Master TypeScript conditional types to create flexible, reusable type transformations that adapt based on type relationships.

TypeScript Decorators for Metaprogramming

Learn how TypeScript decorators modify classes, methods, accessors, and properties. Covers factory functions, parameter validation, and composition order.

Authentication Sessions: Secure Login with Cookies and Express-Session

Implement secure authentication sessions with HTTP cookies and Express-Session. Covers Redis storage, CSRF protection, JWT comparison, and remember-me tokens.

Authentication Tokens and JWT: Secure Web App Authentication

Learn how authentication tokens and JSON Web Tokens (JWT) work in JavaScript apps. From token structure and signing to secure storage and common attacks.

CSRF Protection: How to Stop Cross-Site Request Forgery

How CSRF protection stops cross-site request forgery in JavaScript apps with SameSite cookies, synchronizer tokens, double-submit cookies, and custom headers.

Input Sanitization and Validation in JavaScript

Learn input sanitization and validation in JavaScript to prevent XSS, SQL injection, and command injection attacks in web applications.

Content Security Policy (CSP) in JavaScript Applications

How to configure Content Security Policy headers to control which resources load on your page. Use directives, nonces, and hashes to stop XSS attacks.

Subresource Integrity and Supply Chain

Learn how to protect your web applications from supply chain attacks using Subresource Integrity (SRI) hashes on external resources.

Cross-Site Scripting (XSS) Prevention in JavaScript

Learn how XSS attacks work and how to prevent them in JavaScript. Covers stored, reflected, and DOM-based XSS with CSP, escaping, and safe DOM APIs.