# Development Workflow

> A repo-aligned day-to-day workflow for building features.

*Canonical: https://makerkit.dev/docs/tanstack-drizzle/development-guide/development-workflow*

---

## Start the app

```bash
pnpm compose:dev:up
pnpm dev
```

## Organize feature code

Typical feature layout (file-based routing):

```text
apps/web/src/routes/_authenticated/feature/
├── index.tsx          # route: loader + component
└── $id.tsx            # dynamic route segment

apps/web/src/components/feature/   # UI components (kebab-case)
apps/web/src/lib/feature/          # server functions, loaders, schemas
```

Common naming:

- server functions/actions: `*.functions.ts`
- schemas: `*.schema.ts`
- loaders: route `loader`, optionally backed by a `*.loader.ts` helper

When a feature grows beyond the app, extract it into a workspace package under
`packages/` (e.g. `packages/organization/`) following the existing split of
`core` (server/services), `ui` (components), and shared schemas.

## When to create a package

Create a shared workspace package only if the code needs a stable boundary or will be reused across apps/packages. Put it under `packages/` or an existing grouped family like `packages/account/` or `packages/organization/`.

## Suggested flow

1. create or update validation schema
2. update database code if needed
3. add loader or server function
4. build UI
5. verify with repo checks

## Checks

```bash
pnpm typecheck
pnpm lint:fix
pnpm format:fix
pnpm test:unit
```

`pnpm healthcheck` is useful too, but it does not replace `pnpm test:unit`.

---

**Next:** [Adding Features →](./adding-features)