Full-Stack Vertical Slices: The Only Way to Ship With AI

Last week I shipped 13 commits, 176 files changed, 20,000+ lines of code. In one day.

Not by writing faster. By structuring work so AI agents could deliver complete features end-to-end.

The secret: vertical slices.

Horizontal vs. Vertical

The traditional approach: build in layers.

Week 1: Build all the database models
Week 2: Build all the API handlers
Week 3: Build all the frontend components
Week 4: Wire everything together
Week 5: Debug why nothing works together

This is how most teams work. It's also the worst way to work with AI agents.

Why horizontal fails with agents:

Each layer needs context from other layers. The frontend agent needs to know the API shape. The API agent needs to know the data model. But when you build layers separately, that context doesn't exist yet.

So you either guess (and get it wrong) or you wait (and waste time).

The vertical alternative:

Feature 1: Database → API → Types → UI (complete)
Feature 2: Database → API → Types → UI (complete)
Feature 3: Database → API → Types → UI (complete)

Each slice is a complete feature. Database migration, backend handler, data access layer, API types, frontend components, documentation. One commit.

Why Vertical Slices Work With Agents

1. Self-Contained Context

A vertical slice has everything an agent needs in one scope:

• The database schema defines the shape
• The handler defines the behavior
• The types define the contract
• The UI defines the interaction

An agent can build this end-to-end because the context is complete and coherent. No waiting for another agent to finish a different layer.

2. Immediate Validation

When you ship a vertical slice, you can test it immediately. The endpoint works. The UI renders. The data flows.

With horizontal layers, you can't validate until all layers exist. That means bugs hide for days.

3. Parallel Independence

Vertical slices are independent. The "cost dashboard" slice doesn't depend on the "workflow builder" slice. Two agents can build them simultaneously.

With horizontal layers, the frontend depends on the API, which depends on the database. Sequential by nature.

4. Smaller Blast Radius

A broken vertical slice affects one feature. A broken horizontal layer affects everything.

When an agent makes a mistake in the cost dashboard slice, the workflow builder still works. When an agent makes a mistake in the shared data layer, everything breaks.

How I Structure a Vertical Slice

Here's a real example from my recent work: the conversation system.

One slice, one commit:

Database:
  └── migrations/20260202_add_conversations.surql

Backend:
  ├── core/crates/common/src/types/conversation.rs
  ├── core/crates/dal/src/repository/conversation.rs
  └── core/crates/api/src/handlers/conversation.rs

API Client:
  ├── packages/api/src/hooks/conversations.ts
  └── packages/api/src/types/streaming.ts

Frontend:
  ├── apps/web/src/components/chat/chat-layout.tsx
  ├── apps/web/src/components/chat/chat-panel.tsx
  ├── apps/web/src/components/chat/chat-input.tsx
  └── apps/web/src/components/chat/chat-message.tsx

Everything the conversation feature needs. Nothing it doesn't.

The Agent Workflow

For each vertical slice:

Step 1: Define the contract I write (or an agent writes) the data types first. This is the contract between layers.

pub struct Conversation {
    pub id: ConversationId,
    pub agent_id: AgentId,
    pub messages: Vec<Message>,
    pub status: ConversationStatus,
}

Step 2: Build bottom-up Database migration → DAL repository → API handler. One agent can do this sequentially because each layer's output feeds the next.

Step 3: Generate the bridge OpenAPI spec updates. TypeScript types generated. The contract is now available to frontend agents.

Step 4: Build the UI A separate agent (or the same one) builds the React components against the generated types.

Step 5: Wire and test I review, connect the route, verify the data flow.

A Day of Vertical Slices

Here's what my recent productive day actually looked like:

Time	Slice	What Shipped
Morning	Workspace & Navigation	Sidebar, workspace switching, settings routes
Morning	Dashboard & Costs	Cost analytics, charts, alerts, rate limits
Afternoon	Workflow Builder	11 node config panels, properties panel
Afternoon	Chat & Streaming	Full chat UI, execution streaming, HITL
Evening	Cleanup	Lint fixes, clippy, refactoring

Each slice was independently deployable. Each was complete.

The Cleanup Pass

Notice the evening slot: cleanup.

Vertical slices prioritize completeness over perfection. The first pass gets the feature working. The cleanup pass handles:

• Lint warnings and unused imports
• Performance optimizations (extracting shared helpers)
• Code consistency across slices
• Documentation updates

This is intentional. Ship working features first. Polish second. A separate agent can handle the cleanup pass because it's mechanical — fix warnings, extract patterns, update docs.

What Doesn't Work as Vertical Slices

Not everything fits this pattern:

Cross-cutting concerns — Authentication middleware, error handling, logging. These affect multiple features and should be built as infrastructure first.

Shared components — A design system or component library. Build this as a foundation, then use it across slices.

Database schema changes — When multiple features need the same schema change, coordinate that first.

The rule: if it serves one feature, build it as a vertical slice. If it serves many features, build it as infrastructure.

Common Objections

"But what about code reuse?"

Build the first slice. See what repeats. Extract common patterns in the cleanup pass. Premature abstraction is worse than a little duplication.

"What about consistency across features?"

That's what your component library and design tokens are for. Each slice uses the same building blocks. Consistency comes from shared foundations, not from building everything at once.

"What about API design?"

Design your API types first, before building any slices. The types are the contract. Then each slice implements its part of the contract.

"What about testing?"

Each slice includes its own tests. Unit tests for the handler. Integration tests for the API. Component tests for the UI. Vertical slices make testing easier because the scope is clear.

---

Stop building in layers. Start building in slices. Each slice is a complete feature, from database to UI. Each slice can be built by an agent with full context. Each slice can be validated immediately.

The teams shipping fastest with AI agents aren't the ones with the best models. They're the ones who've structured their work so agents can deliver complete, testable features in one shot.