~//guides

Guides

Long-form, practical guides for every technology on the roadmap. Pick a topic and go deep, or follow the roadmap in order.

120 guides

01

Internet & How it Works

02

HTML

03

CSS

beginner

CSS

CSS ist die Sprache, die steuert, wie Ihr HTML auf dem Bildschirm aussieht und angeordnet wird. Hier erfahren Sie, was es ist, wie es funktioniert und wie Sie heute damit starten.

14 min read
beginner

CSS Box Model

Das Box-Modell ist das Fundament des CSS-Layouts. Jedes Element ist eine Box mit Content, Padding, Border und Margin – lerne, wie es funktioniert und wie du es steuerst.

14 min read
beginner

Flexbox

Flexbox ist ein CSS-Layout-Modell, mit dem Elemente in einem Container einfach ausgerichtet und der verfügbare Platz verteilt werden kann. Hier erfahren Sie, wie es funktioniert und wie man es einsetzt.

14 min read
beginner

CSS Grid

CSS Grid ist ein zweidimensionales Layout-System, mit dem Sie Elemente in Zeilen und Spalten anordnen können. Erfahren Sie, wie es funktioniert, wann Sie es einsetzen sollten und wie Sie moderne Layouts ohne Hacks erstellen.

14 min read
beginner

Responsive Design

Responsive Design sorgt dafür, dass ein Layout auf jedem Bildschirm funktioniert. Ein Viewport-Tag, fluide Einheiten und Mobile-First Media Queries decken die große Mehrheit aller Anwendungsfälle ab.

15 min read
intermediate

Animations & Transitions

CSS Transitions und Keyframes erwecken Interfaces ohne JavaScript zum Leben. Wenn die richtigen Properties animiert werden, bleibt die Bewegung flüssig und barrierefrei.

14 min read
intermediate

CSS Variables

Custom Properties sind Werte, die man einmal definiert und überall wiederverwendet. Im Gegensatz zu Preprocessor-Variablen existieren sie im Browser und können zur Laufzeit geändert werden.

13 min read
04

CSS Frameworks & Styling

05

JavaScript

06

Git & Version Control

07

TypeScript

08

JavaScript Frameworks

09

State Management

10

Meta-frameworks

11

Testing

12

Build Tools & Tooling

intermediate

Vite

Vite ist das moderne Build-Tool, das deinen Quellcode in der Entwicklung über native ES-Module bereitstellt und ihn für die Produktion mit Rollup bündelt. Schneller Start, schnellere Iterationen.

14 min read
beginner

npm

npm ist der Standard-Package-Manager und die größte Software-Registry der Welt. Erfahren Sie, wie Abhängigkeiten installiert, Versionen aufgelöst und Projekt-Scripts ausgeführt werden.

13 min read
intermediate

pnpm

pnpm ist ein schneller, speichereffizienter Package Manager, der einen content-addressable Store und strikte symlinked node_modules verwendet. Er ist die erste Wahl für Monorepos.

13 min read
intermediate

ESLint

ESLint ist der pluggable Linter, der Bugs findet und Konventionen erzwingt, bevor sie das Review erreichen. Mit Flat Config und TypeScript-Support passt er in jeden modernen Stack.

13 min read
beginner

Prettier

Prettier ist der meinungsstarke Code-Formatter, der Stil-Debatten beendet. Er parst Ihren Code und schreibt ihn konsistent neu, sodass niemand mehr über Abstände, Anführungszeichen oder Semikolons streitet.

12 min read
advanced

Webpack

Webpack ist der praxiserprobte Module Bundler. Er verwandelt einen Graphen aus Modulen, Assets und Abhängigkeiten in optimierte Bundles – und wer Webpack versteht, für den werden alle anderen Build-Tools klarer.

14 min read
advanced

Turborepo

Turborepo ist ein hochperformantes Build-System für JavaScript Monorepos. Es führt Tasks über verschiedene Packages hinweg aus, cached die Ergebnisse und überspringt alles, was sich nicht geändert hat.

13 min read
13

Next Steps

intermediate

Web Performance

Performance ist ein Feature. Core Web Vitals, Lazy Loading, kleinere Bundles und intelligentes Caching entscheiden darüber, ob Nutzer bleiben oder gehen, noch bevor Ihre Seite überhaupt gerendert wird.

15 min read
intermediate

Web Security

Sicherheit ist kein Feature, das man am Ende hinzufügt. XSS, CSRF, CORS und eine sichere Authentifizierung bilden die Basis, die jeder Webentwickler verstehen muss.

15 min read
advanced

PWA & Service Workers

Eine Progressive Web App lässt sich wie eine native App installieren, funktioniert offline und lädt bei wiederholten Besuchen sofort. Service Worker und ein Web Manifest machen dies möglich.

14 min read
intermediate

GraphQL

GraphQL ermöglicht es Clients, exakt die Daten abzufragen, die sie benötigen – und das in einer einzigen Anfrage. Ein typisiertes Schema beschreibt die API, während Resolver die dahinterliegenden Daten abrufen.

14 min read
advanced

GSAP

GSAP ist die Animationsbibliothek hinter polierten, scroll-gesteuerten Web-Erlebnissen. Timelines, Easing und ScrollTrigger bieten Ihnen eine frame-genaue Kontrolle, ohne gegen CSS ankämpfen zu müssen.

13 min read
advanced

Three.js

Three.js macht WebGL zugänglich: Ein Scene Graph, Kameras, Materialien und Lichter ermöglichen es Ihnen, 3D-Erlebnisse für den Browser in einfachem JavaScript zu erstellen.

14 min read
intermediate

Docker & Deployment

Docker verpackt deine App und ihre Umgebung in ein Image, das überall gleich läuft. Multi-stage builds, Caching und CI/CD machen das Deployment zu einem wiederholbaren Prozess.

14 min read
01

Internet & Networking

02

Node.js Fundamentals

03

API Design

04

Web Frameworks

beginner

Express

Express ist das minimale, unvoreingenommene Node.js Web-Framework. Eine Route, eine Funktion und eine middleware Kette – das ist das gesamte mentale Modell, und dennoch treibt es einen riesigen Teil des Webs an.

16 min read
intermediate

Fastify

Fastify ist ein schnelles, schema-first Node.js Web-Framework. JSON Schema kompiliert Ihre Validierung und Serialisierung, und kapselnde Plugins sorgen für eine saubere Struktur in großen Services.

15 min read
advanced

NestJS

NestJS ist ein meinungsstarkes, von Angular inspiriertes Node.js Framework. Module, Controller und Provider bieten großen Teams eine gemeinsame Architektur und Dependency Injection direkt out-of-the-box.

16 min read
intermediate

Hono

Hono ist ein ultraschnelles Web-Framework, das auf den Standard-Request- und Response-Objekten basiert. Einmal schreiben, ausführen auf Cloudflare Workers, Deno, Bun oder Node, mit End-to-End-Typisierung durch RPC.

14 min read
intermediate

Koa

Koa ist eine winzige async/await-Neuschreibung von Express durch dessen ursprüngliche Autoren. Ein Context-Objekt und eine Zwiebel aus middleware — alles andere ist ein Paket Ihrer Wahl.

14 min read
intermediate

Laravel

Laravel ist das PHP-Framework, das für die Zufriedenheit der Entwickler gebaut wurde: expressives Routing, das Eloquent ORM, Blade-Templates und ein Ökosystem, das alles von der Authentifizierung bis zum Deployment abdeckt.

16 min read
advanced

Symfony

Symfony ist sowohl eine Sammlung wiederverwendbarer PHP-Komponenten als auch ein vollständiges Framework, das daraus aufgebaut wurde. Es setzt auf Struktur, Stabilität und langfristige Wartbarkeit bei großen Projekten anstelle von bloßer Bequemlichkeit.

15 min read
intermediate

Django

Django ist das "Batteries-included" Web-Framework für Python. Models, Migrations, ein ORM, Templates, Auth und ein produktionsreifes Admin-Panel sind integriert, sodass Sie Ihre Daten definieren und Django den Rest erledigt.

16 min read
beginner

Flask

Flask ist das minimale Python-Micro-Framework. Routing, ein Request-Objekt und Jinja-Templates erhältst du in einer einzigen Datei; weitere Erweiterungen fügst du genau dann hinzu, wenn die App wächst.

14 min read
intermediate

FastAPI

FastAPI ist das async Python-Framework, das auf Type Hints aufbaut. Pydantic validiert Ihre Daten, Starlette übernimmt das HTTP und die OpenAPI-Dokumentation schreibt sich von selbst.

15 min read
intermediate

Ruby on Rails

Rails ist das Full-Stack Ruby-Framework, das auf dem Prinzip „Convention over Configuration“ basiert. Es übernimmt die langweiligen Teile – Dateinamen, Tabellennamen, Routen –, damit Sie Ihre Zeit in das Produkt investieren können.

15 min read
advanced

Spring Boot

Spring Boot ist die meinungsstarke Schicht über dem Spring Framework, die einen Haufen von Konfigurationen in eine laufende Anwendung verwandelt: Starters, Auto-Konfiguration und ein eingebetteter Server.

16 min read
05

Databases

06

ORMs & Query Builders

07

Authentication & Authorization

intermediate

Password Hashing

Passwörter sind das eine Geheimnis, das man niemals im Klartext speichern sollte. Ein langsamer, gesalzener Hash verwandelt eine gestohlene Datenbank in einen Haufen von Vermutungen, die niemals enden.

14 min read
intermediate

JWT

Ein JSON Web Token ist ein signierter, URL-sicherer String, der Claims über einen Benutzer transportiert. Kompakt und eigenständig, lässt er sich hervorragend skalieren, ist aber gleichzeitig anfällig für Implementierungsfehler.

15 min read
intermediate

OAuth 2.0

OAuth 2.0 ist ein Framework für delegierte Autorisierung, nicht für Authentifizierung. Es ermöglicht einem Benutzer, einer App begrenzten Zugriff auf seine Daten zu gewähren, ohne ein Passwort teilen zu müssen.

16 min read
intermediate

OpenID Connect

OAuth 2.0 autorisiert den Zugriff; OpenID Connect fügt die Identitätsebene hinzu, mit der Sie Benutzer anmelden können. Es ist das Protokoll hinter dem „Anmelden mit...“-Button.

15 min read
beginner

Session-Authentifizierung

Die Session-Authentifizierung hält die Wahrheit auf dem Server. Eine zufällige Session-ID wird in einem HttpOnly-Cookie übertragen, während die Identität und Berechtigungen des Benutzers in einem Store liegen, den Sie kontrollieren und jederzeit widerrufen können.

14 min read
intermediate

RBAC

RBAC beantwortet pro Request eine einzige Frage: Darf dieser Principal diese Aktion an dieser Ressource ausführen? Rollen bündeln Berechtigungen, und eine einzige can()-Prüfung sorgt dafür, dass die Antwort überall konsistent bleibt.

15 min read
intermediate

API Keys

Ein API Key ist ein langlebiges Credential für Maschinen. Erstellen Sie ihn einmal, speichern Sie nur einen Hash, begrenzen Sie den Scope strikt und implementieren Sie eine Möglichkeit zur Rotation und zum Widerruf, bevor Sie diese jemals benötigen.

14 min read
08

Testing

09

Caching & Performance

10

Message Queues & Real-time

11

DevOps & Deployment

12

Architecture & Patterns