Frontend Engineer Starter Kit
The topics that take you from "I can write some JavaScript" to "I can ship a real product on the web that respects users".
- Reading time
- ~42 min (+8 min optional)
- Level mix
- 12 beginner · 3 intermediate
Frontend engineering is its own discipline, not “backend with a colour scheme”. It blends programming, design, accessibility, performance, and a deep understanding of the browser as a runtime. This path is the minimum set of topics for being effective on a modern frontend team.
The path starts with the language and runtime, moves through the user-facing layer (where most of the craft lives), and finishes with the tooling that gets your work into production.
Roadmap
Loading progress...
Foundations
A formal language for instructing computers — the human side of software.
A dynamically typed, multi-paradigm language created for the browser, now the most-deployed runtime on Earth — browsers, Node.js, Deno, Bun, and edge platforms.
- Type SystemOptional
A set of rules a programming language uses to assign and check the "kinds" of values, catching whole classes of bugs before the program runs.
The platform
A program that fetches web pages over HTTP, parses HTML/CSS/JavaScript, and renders them as the interactive sites you see.
The request/response protocol that powers the web — how browsers and servers talk to each other.
An architectural style for HTTP-based APIs that models the world as named resources accessed via standard verbs — the dominant way services talk to each other on the web.
- DNSOptional
The phone book of the internet — translates human-readable names like example.com into IP addresses.
The user
The surface where a person and a computer meet — what users see, touch, hear, and act on.
The discipline of shaping how a person feels and what they can do when using a product, system, or service.
Designing software that people with diverse abilities — visual, auditory, motor, cognitive — can use effectively.
A user interface built from visual elements you point at and manipulate — windows, icons, menus, pointers — as opposed to typing commands.
Tools
Tracking changes to code (and other files) over time, so teams can collaborate without trampling each other's work.
The dominant distributed version control system. Tracks snapshots of a project's files and supports lightweight branching.
Writing code that runs your code to check it does what it should — the safety net that lets teams change software without breaking it.
An automated pipeline that builds, tests, and ships code on every change — so the path from "git push" to "in production" is short, repeatable, and safe.