Skip to content
STACK IT FIRST
Install the skills
Method skill · 02 While you build

Vertical slice feature

Adds a new feature as one vertical slice - its route or screen, logic, data access and tests in a single feature folder - instead of spreading it across controller, service and repository layers.
v0.5.0 Updated

Put everything one feature needs in one folder, so the agent can read the whole feature in one pass and change it without hunting through layers. The folder is the unit of change, review and deletion.

When to use

  • Adding a feature, endpoint, page or screen.
  • A change that would otherwise touch five or more folders.
  • Splitting a large feature into smaller ones.

Steps

  1. Read the conventions. Check AGENTS.md and two existing features for the folder name (features/, modules/, app/(group)/), file naming and test placement. Match them exactly; consistency beats preference.

  2. Name the slice after the user’s verb or noun: invite-member, billing, export-csv. Not after a technical layer.

  3. Create the folder with only the files this feature needs:

    src/features/invite-member/
  invite-member.route.ts      # or page / screen / handler: the entry point
  invite-member.schema.ts     # input and output validation
  invite-member.ts            # the logic and data access, plain functions
  invite-member.test.ts       # tests for the behaviour, next to the code
  InviteMemberForm.tsx        # UI, if the feature has any

    Framework routing that must live elsewhere (app/, pages/) stays a thin file that imports from the slice.

  4. Write the test first for the behaviour the user asked for (see tests-as-spec), then implement until it passes.

  5. Keep the boundary narrow. Other features may import only the slice’s public entry (an index.ts or the route). Shared code moves to lib/ only when a second slice needs it, not before.

  6. Register the slice in the one place the framework requires (router, module list, navigation) and nowhere else.

  7. Run the verify command and fix everything it reports.

Rules

  • No new layer folders (services/, repositories/, dto/) for a single feature. A slice may have more files, never more folders than it needs.
  • Duplication between two slices is fine; a premature shared abstraction is not. Extract on the third use.
  • Database schema changes still go through the project’s migration tool, with the migration in the same change.
  • Deleting a feature should mean deleting its folder plus one registration line. If it does not, the slice leaks.

Output

The new folder and files, the one registration change, the test that describes the feature, and the verify result.