CommunityBildgithub.com

feature-sliced/feature-sliced-design

Offizielles Feature-Sliced Design (FSD) v2.1 Skill zur Anwendung der Methodik in Frontend-Projekten. Nutzen bei Aufgaben, die die Organisation der Projektstruktur mit FSD-Layern betreffen.

Was ist feature-sliced-design?

Dieses Skill ist die offizielle Umsetzung von Feature-Sliced Design (FSD) v2.1, einer Methodik zur Strukturierung von Frontend-Projekten. Es hilft Entwicklern dabei, Code gemäß den FSD-Layern (app, pages, widgets, features, entities, shared) zu organisieren, statische Ressourcen wie Bilder und Fonts zu platzieren, eng verwandte Slices zu gruppieren und öffentliche APIs sowie Importschranken zu definieren. Das Skill unterstützt bei der Entscheidungsfindung, ob ein Entity erstellt oder entfernt werden soll, ob die Entities-Ebene notwendig ist, oder ob Logik lokal bleiben oder extrahiert werden sollte. Zudem behandelt es die Migration von FSD v2.0 oder Nicht-FSD-Codebasen, die Integration mit Frameworks wie Next.js, Nuxt, Vite und Astro sowie die Implementierung gängiger Patterns wie Authentifizierung, API-Handling, Redux und TanStack Query (React Query) innerhalb von FSD. Es ist primär für Nutzer von Claude Code, Cursor, Codex oder ähnlichen KI-Agenten konzipiert, die Strukturierungsentscheidungen in Frontend-Projekten treffen müssen.

Funktioniert mit~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/feature-sliced/skills/tree/main/skills/feature-sliced-design

Installed? Explore more Bild skills: steipete/songsee, affaan-m/frontend-design, mattpocock/improve-codebase-architecture · View all 6 →

In Ihrer bevorzugten KI fragen

Öffnet einen neuen Chat, in dem dieser Agent-Skill bereits geladen ist.

Dokumentation

Was macht feature-sliced-design?

Offizielles Feature-Sliced Design (FSD) v2.1 Skill zur Anwendung der Methodik in Frontend-Projekten. Nutzen, wenn die Aufgabe die Organisation der Projektstruktur mit FSD-Layern betrifft, entscheiden, wo Code hingehört, Platzierung statischer Assets (Bilder, Icons, Schriftarten, PDFs), Gruppierung eng verwandter Slices, Definition öffentlicher APIs und Importschranken, Auflösung von Cross-Imports oder Bewertung des @x-Patterns, Entscheidung, ob ein Entity erstellt oder entfernt werden soll, Bewertung, ob die Entities-Ebene überhaupt benötigt wird, Entscheidung, ob Logik lokal bleiben oder extrahiert werden soll, Migration von FSD v2.0 oder einer Nicht-FSD-Codebasis, Integration von FSD mit Frameworks (Next.js App Router und Pages Router, Nuxt, Vite, Astro) oder Implementierung gängiger Patterns wie Authentifizierung, API-Handling, Redux und TanStack Query (React Query) innerhalb von FSD.

Verwandte Skills