// Build a capability end-to-end — backend vertical slice (Contracts→handler→validator→endpoint) AND the React page wired to it. Use when delivering a user-facing feature across API + UI. Composes add-feature + add-react-page.
Add a domain entity/aggregate with EF configuration and a migration to an existing FSH module. Use when adding a new database-backed entity. Pairs with add-feature and create-migration.
Add a vertical-slice feature (command/query + handler + validator + endpoint) to an existing FSH module. Use when adding an API endpoint or business operation to a module that already exists.
Publish a cross-module integration event via the Outbox and handle it idempotently in another module. Use when one module must react to something that happened in another. See .agents/rules/eventing.md.
Create a new module (bounded context) — runtime + Contracts projects, IModule, DbContext, permissions, migrations, and the four registration sites. Use when adding a distinct business domain. For a feature in an existing module, use add-feature.
Add a new permission end-to-end — server constant + endpoint gate, and (admin app) mirror it into the permissions catalog + route guard. Use when a new endpoint needs authorization. See modules/identity.md + frontend/admin.md.
Add a list+create page to a React app (clients/admin or clients/dashboard) — API module, page, lazy route, (admin) permission gate, Playwright test. Use when adding any frontend screen. See .agents/rules/frontend/.
| name | add-full-slice |
| description | Build a capability end-to-end — backend vertical slice (Contracts→handler→validator→endpoint) AND the React page wired to it. Use when delivering a user-facing feature across API + UI. Composes add-feature + add-react-page. |
The kit's accelerator: deliver a feature from database to UI in one pass. This skill composes
add-feature (backend) and add-react-page (frontend) — follow each for the detailed code; this file is
the order of operations and the contract that keeps the two halves in sync.
add-feature (and add-entity first if a new entity is needed):
Modules.{X}.Contracts/v1/{Area}/ (+ Contracts/Dtos/).public sealed, injects {X}DbContext), Validator, Endpoint (internal static Map…Endpoint, .RequirePermission(...)).{X}Module.MapEndpoints. Build + test backend green.add-react-page in the chosen app:
useQuery/useMutation), route (RouteGuard for admin / withSuspense for dashboard).lib/permissions.ts and gate the route (add-permission). Dashboard relies on the server 403.| Backend | Frontend must match |
|---|---|
Endpoint route api/v{n}/{module}/{resources} | apiFetch path |
Request: the Command/Query record fields | request body / query-param keys (admin params PascalCase; body JSON camelCase) |
| Response: the DTO record (camelCase JSON) | the hand-written TS type |
.RequirePermission({X}Permissions...) | (admin) RouteGuard perms + the mirrored constant |
Paginated → PagedResponse<T> | PagedResponse<T> (admin: @/lib/api-types; dashboard: inline) |
dotnet build src/FSH.Starter.slnx && dotnet test src/Tests/{X}.Tests
cd clients/{app} && npm run lint && npm run test:e2e
# optional manual check: dotnet run --project src/Host/FSH.Starter.AppHost (brings up API + both apps)
add-feature)add-react-page); admin permission mirrored + gated (add-permission)