# Dev Tool Overview

> The local Dev Tool app: a developer dashboard for inspecting environment variables, emails, translations, the database, RBAC, and more.

*Canonical: https://makerkit.dev/docs/tanstack-drizzle/dev-tools/overview*

---

The kit ships a standalone **Dev Tool** app at `apps/dev-tool` — a local-only developer dashboard for inspecting and editing the parts of the project that are otherwise spread across `.env` files, message JSON, the database, and config packages.

It is a separate TanStack Start app that reads from (and, for some tools, writes back to) the `apps/web` project on disk. It is meant for local development only — never deploy it.

## Running the Dev Tool

Start just the Dev Tool:

```bash
pnpm --filter dev-tool dev
```

It serves on [http://localhost:3010](http://localhost:3010) (it picks the next free port if 3010 is taken). `pnpm dev` at the repo root also starts it alongside the other apps.

## What's Inside

The left sidebar groups every tool:

- **Dashboard** — at-a-glance project health: kit variant, runtime (Node/package manager), dependency install state, git branch/cleanliness, dev-server and database port checks, merge-conflict detection, and prerequisite tooling.
- **Environment Variables** — browse, validate, and edit every `.env` variable across the monorepo, per mode (development/production), with override chains and secret masking. See [Environment Variables](environment-variables) and [Production Environment Variables](production-environment-variables).
- **Emails** — preview every transactional email template rendered to HTML, and send a test email through your SMTP settings.
- **Translations** — a side-by-side matrix of every translation key across locales and namespaces, with inline editing. See [Translations](translations).
- **Database** — browse project tables (columns, keys, foreign keys) and Postgres functions, categorized, with a click-through detail view.
- **PRD Manager** — browse Product Requirements Documents stored under `.prds/`.
- **RBAC** — an **Inspector** that visualizes the live `@kit/rbac` configuration (resources, actions, role hierarchy, permissions matrix) and a **Builder** that generates RBAC config code.

## How It Works

The Dev Tool is a thin UI over the `@kit/mcp-server` package (`tooling/mcp-server`). The same service factories power both this app and the [MCP Server](../installation/mcp-server) that AI agents use — so the data you see here is exactly what an AI assistant sees. Read and write operations run inside server functions, so Node-only work (reading `.env` files, connecting to Postgres, sending mail) never ships to the browser.

Because it reads the real files on disk, the Dev Tool always reflects your current working tree.