feature-sliced-design

Organize frontend architecture by applying Feature-Sliced Design v2.1 to structure code across six layers (app, pages, widgets, features, entities, shared) and enforce layer rules, public API exports, and cross-import conventions to ensure cohesive, scalable codebases.

The Pages First strategy scaffolds frontend projects by initially placing code within pages and widgets, then only extracting logic to lower layers like features, entities, or shared when real reuse emerges, preventing premature abstraction.

Manage cross-imports in feature-sliced-design by using the @x public API convention to allow controlled imports between slices on the same layer, ensuring dependency boundaries remain clear and preventing tangled module coupling.

Migrate from FSD v2.0 to v2.1 by following the built-in migration guidance to update layer responsibilities, align public API discipline, and apply the Pages First strategy to refactor existing architectures for better scalability.

Move code from a page or widget to a lower layer in feature-sliced-design only when real reuse emerges across multiple pages or features, keeping logic localized to its usage point initially to maintain a cohesive and scalable codebase.

Feature-sliced-design works for aligning large teams by enforcing strict public API rules and layer responsibilities, providing a clear scalable blueprint that dictates exactly where code should live across various apps to maintain architectural consistency.