Skip to content

Docs/Modern Web Architecture

Modern Web Architecture

Прогрес: 0 / 86 тем

Notes on how modern web platforms are structured.

Модуль 1: Як запит доходить до сервера0 / 8

Що відбувається після введення URL у браузері
DNS простими словами
IP, порти та сокети
TCP, UDP та three-way handshake
TLS та HTTPS
HTTP request та response
HTTP/1.1, HTTP/2, HTTP/3
Compression та CDN

Модуль 2: Як браузер будує сторінку0 / 6

Архітектура браузера
DOM та CSSOM
Critical Rendering Path
Layout, Reflow та Repaint
Compositing та анімації
Скрипти в HTML

Модуль 3: Як виконується JavaScript0 / 8

V8 Engine
Call Stack, Heap та Execution Context
Closures та памʼять
Event Loop
Promises та async/await
Fetch, AbortController та race conditions
Garbage Collection та Memory Leaks
Web Workers та WASM

Модуль 4: Як доставляється контент0 / 18

CSR — Client-Side Rendering
SSR — Server-Side Rendering
SSG та ISR
Hydration
React Server Components та Streaming
Caching у мережі
Browser Cache
Browser Storage
PWA та offline-first
Same-Origin Policy
CORS та Preflight
Authentication vs Authorization
Sessions та Cookies
JWT
OAuth 2.0 та OpenID Connect
XSS
CSRF та Clickjacking
Passkeys та WebAuthn

Модуль 6: API та комунікації0 / 10

REST basics
HTTP methods в REST
API errors та status codes
Pagination, filtering, sorting
API versioning та OpenAPI
GraphQL
gRPC та tRPC
WebSocket та SSE
Polling, Long Polling та Webhooks
Reverse Proxy, Load Balancer та API Gateway

Модуль 7: Performance та Core Web Vitals0 / 10

Як вимірювати performance
LCP — Largest Contentful Paint
INP — Interaction to Next Paint
CLS — Cumulative Layout Shift
Resource hints
Images optimization
Fonts optimization
JavaScript bundle optimization
SEO basics
Edge computing

Модуль 8: Tooling, Testing та Workflow0 / 12

Package managers
TypeScript у проєкті
Bundlers
Source maps та debugging
Linting та formatting
Testing pyramid
Playwright
Docker для фронтенда
CI/CD
Monorepo
Releases
Web Components та Microfrontends

Модуль 9: Accessibility та UX0 / 7

Semantic HTML
Keyboard navigation та focus
ARIA
Forms accessibility
Visual accessibility
UX states
Internationalization

Модуль 10: Production Reality0 / 7

Production mindset
Error tracking
Logs, Metrics, Traces
Network resilience
Incident debugging
Privacy та compliance basics
Final release checklist