Zum Hauptinhalt springen
Ihab Khaled
Menü
Alle Projekte

Open-Source-Projekt

NextRanger

Eine strikte Next.js-Engineering-Basis, in der architektonische Entscheidungen durch Tooling erzwungen werden, statt dokumentiert und vergessen zu werden.

Überblick

NextRanger ist der Ausgangspunkt, den ich für ernsthafte Frontend-Arbeit verwende. Die Grundannahme lautet, dass Konventionen, denen ein Team zustimmt, die es aber nicht durchsetzen kann, mit der Zeit erodieren — deshalb wird jede wichtige Regel als Lint-Regel, als Typ oder als fehlschlagender Test ausgedrückt, nicht als Absatz in einer README.

Architektur

Next.js App Router mit Server Components als Standard, striktem TypeScript und einer modul-first-Struktur mit einseitigen Abhängigkeiten: Routen hängen von Modulen ab, Module vom gemeinsamen Code, der gemeinsame Code von Vendor-Wrappern, niemals umgekehrt. Jedes Drittanbieter-Paket hat genau einen zuständigen Wrapper, sodass Upgrades und Fehlerbehandlung in einer einzigen überprüften Datei leben.

Engineering

Ein benutzerdefiniertes ESLint-Plugin erzwingt die Schichtenrichtlinie, die Paket-Zuständigkeit, auf TSX beschränkte Komponenten und die Übersetzungsabdeckung. Vitest und Playwright decken Unit-, Integrations-, End-to-End-, Accessibility- und Visual-Tests ab, dazu Internationalisierung mit RTL-Unterstützung, eine Nonce-basierte CSP, sowie CI-Gates, die das gesamte Set vor jedem Merge ausführen.

Rolle
Autor. Entwurf des Architekturmodells, des benutzerdefinierten ESLint-Regelwerks und der Qualitäts-Gates.
Kategorie
Full-Stack
Stack
Next.jsReactTypeScriptESLintVitestPlaywrightTailwind CSS
Sprache
TypeScript