feature-sliced-design

feature sliced design

feature-sliced 70 ↓ 12k updated 2mo ago
Claude Code
View source ↗

What it does

  • Used in only one page → keep it in that pages/ slice.
  • Used in 2+ pages but duplication is manageable → keeping separate copies
  • An entity or feature used in only one page → keep it in that page
  • UI components → shared/ui/
  • Utility functions → shared/lib/
  • API client, route constants → shared/api/ or shared/config/
  • Auth tokens, session management → shared/auth/

Requirements & configuration

  • not automatically require extraction to a lower layer. Extract only when the
  • | Auth token/session | shared/auth/ (always) | shared/auth/ (always) |
  • If two slices on the same layer need to share logic, follow the resolution
  • Thin-client apps rarely need entities.
  • 3. Business logic does not automatically require an entity. Keeping types

Derived from the skill's own SKILL.md documentation · extracted 2026-07-23

feature sliced design

Source

Repository: https://github.com/feature-sliced/skills

feature-sliced-design FAQ

What does the feature-sliced-design skill do?

> Official Feature-Sliced Design (FSD) v2.1 skill for applying the methodology to frontend projects. Use when the task involves organizing project structure with FSD layers, deciding where code belongs, placing static assets (images, icons, fonts, PDFs), grouping closely related slices, defining public APIs and import boundaries, resolving cross-imports or evaluating the @x pattern, deciding whether to create or remove an entity, evaluating whether the entities layer is needed at all, deciding whether logic should remain local or be extracted, migrating from FSD v2.0 or a non-FSD codebase, integrating FSD with frameworks (Next.js App Router and Pages Router, Nuxt, Vite, Astro), or implementing common patterns such as authentication, API handling, Redux, and TanStack Query (React Query) within FSD. Used in only one page → keep it in that pages/ slice. Used in 2+ pages but duplication is manageable → keeping separate copies

What does feature-sliced-design require?

not automatically require extraction to a lower layer. Extract only when the | Auth token/session | shared/auth/ (always) | shared/auth/ (always) | If two slices on the same layer need to share logic, follow the resolution Thin-client apps rarely need entities. 3. Business logic does not automatically require an entity. Keeping types

How do I install feature-sliced-design?

Run: npx -y skills add https://github.com/feature-sliced/skills --skill feature-sliced-design --agent claude-code — the source lives at github.com/feature-sliced/skills.

Maintain feature-sliced-design?

Let people know it's listed here — add the badge (live metrics, light/dark aware) or a plain link to your README or docs.

feature-sliced-design on getagentictools
[![feature-sliced-design on getagentictools](https://getagentictools.com/badge/skills/feature-sliced-skills-feature-sliced-design.svg)](https://getagentictools.com/skills/feature-sliced-skills-feature-sliced-design?ref=badge)
npx agentictools info skills/feature-sliced-skills-feature-sliced-design

The second line is the CLI lookup for this page — handy in READMEs and docs.