What this is
The Web Path on StackNova has grown to cover a complete modern frontend - the language you write in, the tools that build it, the frameworks that shape your code, the layer that connects your frontend to a backend, and the browser platform the result ships into. This page is the map across that library: every Web Path article outside the search series (plus the API doc and orchestration pieces from Engineering), sorted by what they cover, with a short note on each. The search series - how engines crawl, index, and rank, and the files that steer them - has its own route in the Internet search map.
It is not a tutorial and not an opinionated comparison. It is the page you bookmark, send to a teammate who is catching up, or come back to when you are not sure which article to read next.
Pick a layer, read its article, follow the cross-links. The map is the index, the articles are the depth.- how to read this page
Languages
The thing you actually type. In 2026 the default for new projects is TypeScript on top of JavaScript - a typed source language that strips down to the same JavaScript browsers have always run.
TypeScript is the source language; JavaScript is what runs. Read the two language pieces, the compilation story between them, the historical context for why we ended up here, and (if you're going deep) the runtime model that everything sits on.
- → What is TypeScript? LEVEL 101
- → What is JavaScript? LEVEL 101
- → TypeScript to JavaScript LEVEL 201 - the compile step
- → The history of JavaScript LEVEL 101 - context
- → The event loop in JavaScript LEVEL 401 - runtime deep dive
Build tools
What turns the code you wrote into something a browser can run, fast in development and lean in production. This is the layer the ecosystem has done the most work on in the last few years.
esbuild is the speed primitive - a Go-powered bundler and transformer that does the heavy lifting underneath nearly every modern tool. Vite is the dev server and production build pipeline most frameworks now standardize on. Both are worth understanding at a high level; one of them you actually invoke daily, the other shows up in error messages and config files.
- → What is esbuild? LEVEL 201
- → What is Vite? LEVEL 101
- → How Vite works LEVEL 401 - the deep dive
- → esbuild vs Vite LEVEL 201 - the side-by-side
Frameworks
The layer that gives your application a shape - components, state, routing, the conventions you write inside. Four names dominate, and they have more in common than the framework wars of the 2010s would suggest.
Angular, React, Vue, and Svelte all build on the same toolchain now. The differences are in the component model, the reactivity primitives, and the ecosystem around each one. Read the overview first, then the deep dive on whichever you are about to use.
- → Modern web app frameworks LEVEL 101 - the no-comparison overview
- → What is Angular? LEVEL 101
- → What is React? LEVEL 101
- → What is Vue? LEVEL 101
- → What is Svelte? LEVEL 101
API and integration
A frontend rarely stands alone. The moment it talks to a backend, two things matter: how you document the contract between them, and how you run everything together during development. These pieces live in the Engineering Path but belong on this map.
OpenAPI is the contract; Swagger UI and Scalar are the two renderers most projects ship. Scalar is the modern challenger and the new default in ASP.NET Core 9. Swagger UI is the established choice with a decade of ecosystem behind it.
- → What is Scalar? LEVEL 101
- → Swagger UI and Scalar LEVEL 101 - side-by-side
Aspire is the layer that starts your frontend, backend, database, and supporting services together and wires them up. The TypeScript AppHost added in recent releases puts the JavaScript and .NET worlds on the same orchestration engine.
- → What is Aspire? LEVEL 201
- → What is observability? LEVEL 101 - the dashboard story
In the browser
Everything above ends up here. Once the build is served, the browser takes over: it resolves the address, decodes the images, and is judged on how quickly the page becomes usable. Four articles on the platform itself, no framework in sight.
The URL is the small machine-readable sentence every request starts with. Images are usually the heaviest thing a page ships, and the format decision is where most of the savings are. Core Web Vitals are the three numbers a live page is measured by - and a ranking signal besides.
- → What is a URL? LEVEL 101 - the anatomy of an address
- → Web image formats LEVEL 101 - which format for what
- → What is WebP? LEVEL 101 - the usual right default
- → Core Web Vitals LEVEL 201 - LCP, INP, CLS
Three reading orders
The map is sorted by topic, but most readers want a route. Three orders, depending on who you are.
Coming back after a few years away
- What web developers need to know in 2026
- What is Vite?
- What is TypeScript?
- Modern web app frameworks
- One deep dive on the framework you will use
Wiring up a frontend for the first time
You want to understand the whole stack
- What is TypeScript?
- What is esbuild?
- What is Vite?
- How Vite works (the 401)
- Modern web app frameworks + every framework article
- Swagger UI and Scalar
- Core Web Vitals - once it is live
The map at a glance
If you read only this section, here is the stack from the bottom up:
- Language: TypeScript on top of JavaScript; the compile step between them; the event loop underneath.
- Build tools: esbuild inside Vite.
- Framework: Angular, React, Vue, or Svelte.
- API docs: Scalar or Swagger UI on top of an OpenAPI spec.
- Local orchestration: Aspire when your frontend stops being just a frontend.
- In the browser: the URL it requests, the image formats it decodes (WebP by default), and the Core Web Vitals it is measured by.
For the narrative version of the same picture - why each layer looks the way it does in 2026 - the entry point is What web developers need to know in 2026. This page is the table of contents; that article is the chapter one.
Every article in the map
Every article referenced above, by category, with a one-line reason to read.
| Category | Article | Why read it |
|---|---|---|
| Landscape | What web developers need to know in 2026 101 | The narrative companion to this map - the four-tool toolchain story, in prose. |
| Language | What is TypeScript? 101 | The default language for new frontend projects, and why type-stripping is separate from type-checking. |
| Language | What is JavaScript? 101 | The language the web runs on - shape, where it runs, what it isn't, and why it stuck. |
| Language | TypeScript to JavaScript 201 | The compile step - what gets stripped, what stays, downleveling, and why type-checking and type-stripping are two jobs. |
| Language | The history of JavaScript 101 | Ten days in 1995 to running everything - browser wars, the Node revolution, the framework era. |
| Language | The event loop in JavaScript 401 | Call stack, web APIs, task queue, microtask queue - how single-threaded JavaScript stays unblocked. |
| Build tools | What is esbuild? 201 | The Go-powered speed primitive that sits underneath nearly every modern toolchain. |
| Build tools | What is Vite? 101 | The dev server and production build pipeline most modern frameworks now build on. |
| Build tools | How Vite works 401 | The internals - dependency pre-bundling, native ESM, HMR, and the Rolldown + Oxc toolchain. |
| Build tools | esbuild vs Vite 201 | The side-by-side when you are choosing between the engine and the workshop built around it. |
| Frameworks | Modern web app frameworks 101 | The no-comparison overview of the four frameworks most production frontends are built on. |
| Framework | What is Angular? 101 | The opinionated, batteries-included framework with signals, DI, and a CLI that now runs on Vite. |
| Framework | What is React? 101 | The library most large frontends are written in - hooks, JSX, and Server Components. |
| Framework | What is Vue? 101 | The progressive framework - single-file components, the Composition API, and Nuxt as the meta-framework. |
| Framework | What is Svelte? 101 | The compile-time framework - no virtual DOM, runes-based reactivity, and SvelteKit on top. |
| API docs | What is Scalar? 101 | The modern API reference UI - and the new default in ASP.NET Core 9. |
| API docs | Swagger UI and Scalar 101 | The side-by-side for picking between the established default and the modern challenger. |
| Orchestration | What is Aspire? 201 | The orchestrator that runs your frontend, backend, database, and supporting services together. |
| Observability | What is observability? 101 | Logs, metrics, and traces - what your API is actually doing beyond what the docs page promises. |
| Browser | What is a URL? 101 | Scheme, host, path, query, fragment - the five-part anatomy behind every browser bar, crawler rule, and analytics report. |
| Browser | Web image formats 101 | JPEG, PNG, GIF, SVG, AVIF, and the favicon - what each is genuinely good at, and the table that answers "which one do I use for this?" |
| Browser | What is WebP? 101 | One format for the jobs of JPEG, PNG, and GIF in fewer bytes - what it really saves, and the cases where it is still the wrong choice. |
| Browser | Core Web Vitals 201 | LCP, INP, and CLS - the three user-centric metrics a live page is judged by, what moves them, and how much they weigh. |