Learning Roadmaps

How does the Internet work?

IP addresses, packets, routing, DNS, TCP/IP

HTTP Protocol

Request/response, methods, status codes, headers

Browsers and How They Work

Rendering engine, JavaScript engine, DOM construction

DNS and Domain Names

Domain name system, how DNS resolution works

Hosting Basics

Web servers, hosting types, deployment concepts

Semantic HTML5

Semantic tags, accessibility, forms, SEO basics

CSS Fundamentals

Selectors, box model, specificity, inheritance

CSS Layouts: Flexbox

Flex containers, alignment, ordering, responsive layouts

CSS Layouts: Grid

Grid containers, templates, areas, responsive grids

Responsive Design

Media queries, mobile-first, viewport, fluid layouts

JavaScript Basics

Variables, data types, operators, control flow

JavaScript Functions & Scope

Functions, closures, scope, this keyword

DOM Manipulation

Selecting elements, events, modifying DOM

Asynchronous JavaScript

Callbacks, Promises, async/await, Fetch API

Modern JavaScript (ES6+)

Arrow functions, destructuring, spread/rest, modules

Version Control with Git

Git basics, branching, merging, pull requests, collaboration

Package Managers

npm, package.json, dependencies, scripts

React Fundamentals

Components, JSX, props, state, lifecycle

React Hooks

useState, useEffect, useContext, useRef, custom hooks

TypeScript

Types, interfaces, generics, type safety in React

CSS Framework: Tailwind

Utility classes, responsive design, component styling

State Management

Context API, Zustand, or Redux Toolkit

React Router

Client-side routing, navigation, protected routes

API Integration

REST APIs, fetch, axios, error handling

Testing Basics

Jest, React Testing Library, unit tests

Build Tools

Vite, build optimization, environment variables

Deployment

Vercel, Netlify, GitHub Pages, CI/CD basics