@donotdev/cli 0.0.12 → 0.0.14

package/templates/root-consumer/guides/dndev/GOTCHAS.md.example

@@ -0,0 +1,186 @@
+# Framework Gotchas
+
+**Common mistakes. Read before coding. Phase tags show when each matters most.**
+
+---
+
+## Imports [Phase 1, 2, 3]
+
+**Server code MUST use `/server` imports — client imports crash on deploy.**
+
+```typescript
+// ✅ CORRECT
+import { getFirebaseAdminFirestore } from '@donotdev/firebase/server';
+import { handleError } from '@donotdev/core/server';
+
+// ❌ WRONG - crashes on deploy
+import { getFirestore } from '@donotdev/firebase';
+import { handleError } from '@donotdev/core';
+```
+
+**Rule:** Always use `/server` suffix for `@donotdev/firebase/server`, `@donotdev/core/server`, `@donotdev/utils/server`.
+
+**ESM only — never use `require()`.**
+
+```typescript
+// ❌ WRONG
+const { something } = require('@donotdev/package');
+
+// ✅ CORRECT
+import { something } from '@donotdev/package';
+```
+
+**Import ordering is mandatory:**
+1. React (values, then types)
+2. Other vendors (values, then types)
+3. `@donotdev/*` packages (values, then types)
+4. Relative imports (values, then types)
+
+One line for values, one line for types. Blank line between categories.
+
+---
+
+## Routing [Phase 1, 3]
+
+**Never import from `react-router-dom` — use framework routing.**
+
+```tsx
+// ❌ WRONG - breaks framework features
+import { Link, useNavigate, useParams } from 'react-router-dom';
+
+// ✅ CORRECT
+import { Link, useNavigate, useParams } from '@donotdev/ui/routing';
+```
+
+**Routes are auto-discovered** from `src/pages/*Page.tsx` with `pageMeta`. Don't use `<Routes>`, `<Route>`, or manual `<Outlet />`.
+
+**Use `useRouteParam('id')` for typed route params** — not `useParams()` from react-router-dom.
+
+**Navigation is auto-built.** Use `<DnDevNavigationMenu>` or `useNavigationItems()`. Don't build nav manually — you lose auth filtering and route discovery.
+
+---
+
+## Styling [Phase 3, 4]
+
+**No inline `fontSize` or `font-size` — use `Text` level prop.**
+
+```tsx
+// ❌ WRONG
+<Text style={{ fontSize: '18px' }}>Title</Text>
+
+// ✅ CORRECT
+<Text level="h2">Title</Text>
+```
+
+Levels: `h1`, `h2`, `h3`, `h4`, `body`, `small`, `caption`. Limit to 2–3 levels per page.
+
+**RTL: Always use `start`/`end` — never `left`/`right`.**
+
+```css
+/* ❌ WRONG - breaks RTL */
+text-align: left;
+
+/* ✅ CORRECT - works in both LTR and RTL */
+text-align: start;
+```
+
+Same for inline styles: `textAlign: 'start'` not `textAlign: 'left'`. Same for data attributes: `data-text-align="start|center|end"`.
+
+---
+
+## Components [Phase 3]
+
+**Always `lookup_symbol` before using any `@donotdev` component.** Never guess props.
+
+Common wrong props:
+- `Button`: no `size`, `tone`, `gap` — use `variant`, `display`
+- `Text`: no `size`, `tone`, `color` — use `level`, `variant`
+- `Stack`: no `spacing`, `size` — use `gap`
+- `Card`: no `padding`, `margin`, `size` — use `title`, `subtitle`, `content`, `footer`
+- `Grid`: no `columns` — use `cols`
+
+**If you can't do it with framework components:** Stop. Tell the user what's missing. Don't invent custom workarounds.
+
+---
+
+## CRUD [Phase 2, 3]
+
+**Hidden fields are auto-added by `defineEntity()` — don't define them manually:**
+- `id`, `createdAt`, `updatedAt`, `createdById`, `updatedById`, `status`
+
+**Scope field is auto-added** when `scope` is configured. Don't manually define the scope field (e.g., `companyId`).
+
+**Custom form fields MUST use framework's `useController`:**
+
+```typescript
+// ❌ WRONG
+import { useController } from 'react-hook-form';
+
+// ✅ CORRECT
+import { useController } from '@donotdev/crud';
+```
+
+**Form components receive `control` prop, not `field` prop.**
+
+**Price field is structured:** `{ amount, currency, vatIncluded, discountPercent }`. Don't store computed discount amounts.
+
+**File uploads are deferred** — files upload on form submit, not on selection. Images show optimistic blob URLs.
+
+**Entity namespace defaults to `entity-{name}`** (lowercase). Translation files must match: `locales/entity-product_en.json`.
+
+---
+
+## Functions [Phase 3, 4]
+
+**Use `createFunction` for custom functions — 3 params, everything included:**
+
+```typescript
+import { createFunction } from '@donotdev/functions/firebase';
+
+export const myFunction = createFunction(schema, 'operation_name', async (data, { uid }) => {
+  // Your logic
+});
+```
+
+**Use `createBaseFunction` only when you need custom config** (memory, timeout, region override).
+
+**Deploy with `dndev deploy`** — not `firebase deploy`. Manual deploy causes CORS 403 on preflight because Cloud Run blocks unauthenticated OPTIONS by default.
+
+**Naming:** Export in camelCase (`getDashboardMetrics`), operation ID in snake_case (`get_dashboard_metrics`).
+
+**CRUD functions are one-liner:** `export const crud = createCrudFunctions(entities);` — generates all CRUD endpoints per entity. Access controlled via `entity.access`.
+
+---
+
+## i18n [Phase 3, 4]
+
+**Phase 3: hardcode strings. Phase 4: add translations.** Don't i18n too early.
+
+**Two loading strategies:**
+- **Eager** (always loaded): `src/locales/common_en.json` — navigation, buttons, common UI
+- **Lazy** (loaded per page): `src/pages/locales/home_en.json` — page-specific content
+
+**Status field translations** fall back: `entity-{name}` namespace → `crud` namespace.
+
+**Rich text uses `<Trans>` component** with supported tags only: `<accent>`, `<primary>`, `<muted>`, `<success>`, `<warning>`, `<error>`, `<bold>`, `<code>`.
+
+**Array translations use `tList`:**
+```tsx
+import { tList } from '@donotdev/ui';
+<Card content={tList(t, 'features.items', 4)} />
+```
+
+---
+
+## Dependencies [Phase 1]
+
+**Apps don't declare bundled deps.** Framework packages (`@donotdev/*`) provide everything. Don't add `react-router-dom`, `react-hook-form`, `valibot`, etc. to app's `package.json` — they come through framework deps.
+
+**Environment variables:**
+- Client: `apps/my-app/.env` (prefix with `VITE_*`)
+- Server: `functions/.env` (secrets: `STRIPE_*`, OAuth tokens)
+- Local overrides: `.env.local` (gitignored)
+
+---
+
+**When in doubt: search the codebase first, ask the user second, never guess.**

package/templates/root-consumer/guides/dndev/INDEX.md.example

@@ -6,6 +6,15 @@
 
 ---
 
+## Getting Started
+
+- [ENV_SETUP.md](./ENV_SETUP.md) - **START HERE** — Full onboarding flow (install → firebase → deploy)
+- [GOTCHAS.md](./GOTCHAS.md) - **Common mistakes & pitfalls** (phase-tagged, read before coding)
+- [SETUP_FIREBASE.md](./SETUP_FIREBASE.md) - Firebase project setup (`dndev firebase:setup`)
+- [SETUP_TESTING.md](./SETUP_TESTING.md) - Test generation (Phase 4)
+
+---
+
 ## Core Setup
 
 - [SETUP_PAGES.md](./SETUP_PAGES.md) - Pages & routing (pre-configured)
@@ -23,6 +32,7 @@
 - [SETUP_AUTH.md](./SETUP_AUTH.md) - Authentication (pre-configured)
 - [SETUP_OAUTH.md](./SETUP_OAUTH.md) - OAuth connections (pre-configured)
 - [SETUP_BILLING.md](./SETUP_BILLING.md) - Stripe subscriptions (pre-configured)
+- [SETUP_BLOG.md](./SETUP_BLOG.md) - Convention-based markdown blog with i18n
 - [SETUP_PWA.md](./SETUP_PWA.md) - Progressive Web App setup
 - [SETUP_FUNCTIONS.md](./SETUP_FUNCTIONS.md) - Firebase Functions (pre-configured)
 

package/templates/root-consumer/guides/dndev/SETUP_APP_CONFIG.md.example

@@ -107,29 +107,26 @@ export default defineViteConfig({
 
 ## 4. Environment Variables
 
-```bash
-# .env
-VITE_APP_NAME="My App"
-VITE_APP_URL=http://localhost:5173
+**Vite loads `.env` from the app directory only.** Not the repo root.
 
-# Firebase
-VITE_FIREBASE_API_KEY=your-api-key
-VITE_FIREBASE_AUTH_DOMAIN=your-project.firebaseapp.com
-VITE_FIREBASE_PROJECT_ID=your-project-id
-VITE_FIREBASE_STORAGE_BUCKET=your-project.appspot.com
-VITE_FIREBASE_MESSAGING_SENDER_ID=123456789
-VITE_FIREBASE_APP_ID=1:123456789:web:abcdef
+Run `dndev firebase:setup` to auto-populate Firebase config. See [SETUP_FIREBASE.md](./SETUP_FIREBASE.md).
 
-# Auth providers
-VITE_AUTH_PARTNERS=password,emailLink,google,github
-
-# Stripe
+```bash
+# apps/<your-app>/.env — client-side variables (exposed to browser)
+VITE_APP_URL=http://localhost:5173
+VITE_DONOTDEV_LICENSE_KEY=dndev_your_key_here
+VITE_FIREBASE_API_KEY=...          # Written by dndev firebase:setup
+VITE_FIREBASE_PROJECT_ID=...       # Written by dndev firebase:setup
+VITE_AUTH_PARTNERS=github,google
 VITE_STRIPE_PUBLISHABLE_KEY=pk_test_...
+
+# functions/.env — server-side secrets (never exposed to browser)
 STRIPE_SECRET_KEY=sk_test_...
 STRIPE_WEBHOOK_SECRET=whsec_...
-STRIPE_API_VERSION=2025-08-27.basil
 ```
 
+Push server secrets to Firebase: `dndev sync-secrets`
+
 ---
 
 **Zero config. Override when needed.**

package/templates/root-consumer/guides/dndev/SETUP_BLOG.md.example

@@ -0,0 +1,263 @@
+# Setup: Blog
+
+**Convention-based markdown blog.** Drop `slug_lang.md` files in `src/content/blog/`, get a fully functional blog with i18n, reading time, tags, RSS, and sitemap.
+
+---
+
+## Quick Start
+
+### 1. Create the content directory
+
+```
+src/content/blog/
+├── my-first-post_en.md
+├── my-first-post_fr.md
+└── another-post_en.md
+```
+
+### 2. Write a post with frontmatter
+
+```markdown
+---
+title: My First Post
+description: A short summary for listings and SEO
+date: 2025-06-01
+tags: tutorial, getting-started
+image: /blog/my-first-post.png
+---
+
+Your markdown content here. Supports:
+- **Bold**, *italic*, ~~strikethrough~~
+- [Internal links](/faq) and [external links](https://example.com)
+- Images: ![alt text](/blog/my-image.png)
+- Code blocks with syntax highlighting
+```
+
+### 3. Create the data loader
+
+```typescript
+// src/data/blog/index.ts
+import { createBlogLoader } from '@donotdev/templates';
+import type { BlogLoader } from '@donotdev/templates';
+
+const markdownFiles = import.meta.glob('../../content/blog/*.md', {
+  query: '?raw',
+  import: 'default',
+  eager: true,
+});
+
+export function getBlogLoader(lang: string = 'en'): BlogLoader {
+  return createBlogLoader(markdownFiles as Record<string, string>, lang);
+}
+```
+
+### 4. Create the listing page
+
+```typescript
+// src/pages/BlogPage.tsx
+import { BookOpen } from 'lucide-react';
+import { HeroSection } from '@donotdev/components';
+import { useTranslation, type PageMeta } from '@donotdev/core';
+import { BlogList } from '@donotdev/templates';
+import { PageContainer } from '@donotdev/ui';
+import { getBlogLoader } from '../data/blog';
+
+export const NAMESPACE = 'blog';
+export const meta: PageMeta = { namespace: NAMESPACE, icon: <BookOpen /> };
+
+export default function BlogPage() {
+  const { t, i18n } = useTranslation([NAMESPACE]);
+  const posts = getBlogLoader(i18n?.language).getAllPosts();
+
+  return (
+    <PageContainer variant="docs">
+      <HeroSection title={t('title')} subtitle={t('subtitle')} />
+      <BlogList posts={posts} />
+    </PageContainer>
+  );
+}
+```
+
+### 5. Create the post page (dynamic route)
+
+```typescript
+// src/pages/BlogPostPage.tsx
+import { BookOpen } from 'lucide-react';
+import { useTranslation, type PageMeta } from '@donotdev/core';
+import { BlogPostView } from '@donotdev/templates';
+import { PageContainer, useRouteParam } from '@donotdev/ui';
+import { getBlogLoader } from '../data/blog';
+
+export const NAMESPACE = 'blog';
+export const meta: PageMeta = {
+  namespace: NAMESPACE,
+  icon: <BookOpen />,
+  route: '/blog/:slug',
+  hideFromMenu: true,
+};
+
+export default function BlogPostPage() {
+  const { i18n } = useTranslation([NAMESPACE]);
+  const slug = useRouteParam('slug');
+  const post = slug ? getBlogLoader(i18n?.language).getPostBySlug(slug) : null;
+
+  return (
+    <PageContainer variant="docs">
+      <BlogPostView post={post} />
+    </PageContainer>
+  );
+}
+```
+
+### 6. Add locale files
+
+Blog UI labels (`readMore`, `backToBlog`, `publishedOn`, etc.) are provided by the framework via `blog_*.json` in `@donotdev/core`. Override any key by creating the same file in your app.
+
+Page-specific strings (title, subtitle) go in your app locale:
+
+```json
+// src/pages/locales/blog_en.json
+{
+  "title": "Blog",
+  "subtitle": "Your subtitle here"
+}
+```
+
+---
+
+## File Convention
+
+**Pattern:** `slug_lang.md`
+
+| File | Slug | Language |
+|------|------|----------|
+| `my-post_en.md` | `my-post` | English |
+| `my-post_fr.md` | `my-post` | French |
+| `my-post_de.md` | `my-post` | German |
+| `solo-post_en.md` | `solo-post` | English (no FR = falls back to EN) |
+
+**Rules:**
+- Slug = everything before the last `_xx` suffix
+- Language suffix must be 2-5 characters (ISO codes)
+- English (`_en`) is the fallback language
+- If a post only exists in `_en`, it's shown for all languages
+
+---
+
+## Frontmatter Fields
+
+| Field | Required | Description |
+|-------|----------|-------------|
+| `title` | Yes | Post title |
+| `description` | Yes | Summary for listings and SEO |
+| `date` | Yes | Publication date (YYYY-MM-DD) |
+| `tags` | No | Comma-separated tags |
+| `image` | No | Hero image path — must be in `public/blog/` (see Images section) |
+
+Custom fields are preserved in `meta[key]`.
+
+---
+
+## Images
+
+### Hero Images (frontmatter `image` field)
+
+One image per post. Used in blog listing cards, article page, RSS feed, and OG/social sharing.
+
+**Convention:**
+- **Location:** `public/blog/[slug].png` (matches the post slug)
+- **Size:** 1200×630px minimum (standard OG ratio, sharp on retina)
+- **Format:** PNG or JPG
+- **Reference:** `image: /blog/my-post.png` in frontmatter
+
+```
+public/
+└── blog/
+    ├── my-first-post.png        ← matches my-first-post_en.md
+    ├── another-post.png         ← matches another-post_en.md
+    └── inline-diagram.svg       ← used in markdown body
+```
+
+**Where it shows:**
+| Context | Sizing |
+|---------|--------|
+| Blog listing (featured card) | `width: 100%`, `max-height: 360px`, `object-fit: cover` |
+| Blog listing (grid cards) | `width: 100%`, `max-height: 180px`, `object-fit: cover` |
+| Article page | `width: 100%`, `max-height: 480px`, `object-fit: cover` |
+| RSS feed | `<enclosure>` with full URL |
+
+### Inline Images (in markdown body)
+
+Images referenced in markdown content also go in `public/blog/`:
+
+```markdown
+![Architecture diagram](/blog/inline-diagram.svg)
+```
+
+Rendered with `loading="lazy"` and `decoding="async"`.
+
+**Co-located images (next to .md files) do NOT work** — `?raw` imports treat markdown as text strings, not processed modules.
+
+---
+
+## Tags & Filtering
+
+```typescript
+const blog = getBlogLoader('en');
+const allTags = blog.getAllTags();           // ['react', 'typescript', ...]
+const filtered = blog.getPostsByTag('react'); // Posts tagged 'react'
+```
+
+---
+
+## RSS & Sitemap
+
+**Auto-generated at build time.** The SEO pipeline (Vite `SEOPlugin` / Next.js `SEOHandler`) automatically:
+
+1. Discovers `src/content/blog/*_en.md` files
+2. Appends blog post URLs to `sitemap.xml`
+3. Generates `rss.xml` with all posts
+
+No manual scripts needed. Just drop `.md` files and build.
+
+---
+
+## Scaling (50+ Posts)
+
+Default uses `eager: true` (all posts bundled into JS). For large blogs, switch to lazy loading:
+
+```typescript
+// Lazy: posts loaded on demand, not bundled
+const markdownFiles = import.meta.glob('../../content/blog/*.md', {
+  query: '?raw',
+  import: 'default',
+  eager: false,  // ← Change this
+});
+
+// Now each value is () => Promise<string> instead of string
+// You'll need to await them before passing to createBlogLoader
+```
+
+For most apps (< 50 posts), eager loading is optimal.
+
+---
+
+## Auto-Deploy
+
+Push a new `.md` file → CI builds → `import.meta.glob` picks it up at build time → deployed. No CMS, no API.
+
+---
+
+## API Reference
+
+From `@donotdev/templates`:
+
+| Export | Type | Description |
+|--------|------|-------------|
+| `createBlogLoader` | Function | Create loader from glob results + language |
+| `parseFrontmatter` | Function | Parse `---` frontmatter from raw markdown |
+| `BlogList` | Component | Renders post listing with cards |
+| `BlogPostView` | Component | Renders single post with MarkdownViewer |
+| `BlogPost` | Type | Post with slug, meta, content, readingTime, tags |
+| `BlogMeta` | Type | Frontmatter metadata |
+| `BlogLoader` | Type | Loader interface |

package/templates/root-consumer/guides/dndev/SETUP_CRUD.md.example

@@ -366,7 +366,7 @@ export default function ProductDetailPage() {
   return (
     <PageContainer>
       <Section>
-        <Stack direction="row" gap="medium" align="center">
+        <Stack direction="row" align="center">
           <h1>{data.name}</h1>
           <Button
             variant={isFavorite(id) ? 'primary' : 'outline'}

package/templates/root-consumer/guides/dndev/SETUP_FIREBASE.md.example

@@ -0,0 +1,168 @@
+# Setup: Firebase
+
+**From zero to deployed in 5 steps.**
+
+---
+
+## Step 1: Run Firebase Setup
+
+```bash
+dndev firebase:setup
+```
+
+This command:
+- Checks Firebase CLI is installed and you're logged in
+- Lists your Firebase projects (or creates a new one)
+- Creates a web app if the project doesn't have one
+- Gets the SDK config and writes it to your app's `.env`
+- Updates `.firebaserc` with the project ID
+- Updates `firebase.json` placeholders
+
+**After running, it will prompt you for 2 manual steps (below).**
+
+---
+
+## Step 2: Download Service Account Key
+
+The CLI gives you a direct link. In short:
+
+1. Firebase Console → Project Settings → Service Accounts
+2. Click "Generate new private key"
+3. Save the file as `service-account-key.json` in your app root
+4. This file is `.gitignored` — never commit it
+
+**Why?** The service account key authenticates `dndev deploy` and Cloud Functions to your Firebase project. Without it, deployment fails.
+
+---
+
+## Step 3: Enable Firebase Services
+
+Go to the Firebase Console and enable:
+
+**Authentication** (required):
+- Get Started → Enable Email/Password
+- Add OAuth providers if needed (Google, GitHub, etc.)
+
+**Cloud Firestore** (required):
+- Create Database → Start in test mode → Select region (e.g., europe-west1)
+- Test mode rules expire after 30 days — Phase 4 generates proper rules
+
+**Storage** (optional — only if your app uploads files):
+- Get Started → Select region
+
+---
+
+## Step 4: Test Locally
+
+```bash
+dndev emu start
+```
+
+Select services: Auth + Firestore + Functions. This starts Firebase emulators so you can develop without touching production.
+
+**Verify:** Open the app (`bun dev`), sign up, create some data. Everything runs locally.
+
+---
+
+## Step 5: Deploy
+
+```bash
+dndev deploy
+```
+
+This handles everything:
+- Builds the app
+- Deploys hosting (your frontend)
+- Deploys Cloud Functions (your backend)
+- Configures Cloud Run IAM automatically (fixes CORS preflight on 2nd gen functions)
+- Deploys Firestore rules (if `firestore.rules` exists)
+
+**After deploy:** Your app is live at `https://<project-id>.web.app`.
+
+---
+
+## Environment Variables
+
+**Vite loads `.env` from the app directory only. NOT from the repo root.**
+
+| File | What Goes Here | Loaded By |
+|------|---------------|-----------|
+| `apps/<app>/.env` | Firebase config, license key, Stripe publishable key | Vite (at dev + build) |
+| `apps/<app>/.env.local` | Local overrides (gitignored) | Vite (overrides .env) |
+| `apps/<app>/.env.production` | Production overrides | Vite (at build --mode production) |
+| `apps/<app>/.env.staging` | Staging config | Vite (via `dndev staging`) |
+| `functions/.env` | Server secrets: STRIPE_SECRET_KEY, OAuth secrets | Cloud Functions runtime |
+| Root `.env` | **Not read by Vite.** Reference only. | Nothing |
+
+**`dndev firebase:setup` writes Firebase vars to `apps/<app>/.env` automatically.**
+
+**Custom domains:** Framework uses `APP_URL` hostname as `authDomain` in production (not Firebase's `projectId.firebaseapp.com`). Copy/paste `FIREBASE_AUTH_DOMAIN` from Firebase Console in both `.env.local` and `.env.production` — framework handles the rest.
+
+---
+
+## Staging Environment (Optional)
+
+1. Create a second Firebase project (e.g., `my-app-staging`)
+2. Run `dndev firebase:setup` again and select the staging project
+3. Add to `.firebaserc`: `{ "projects": { "staging": "my-app-staging" } }`
+4. Create `service-account-key.staging.json` (same steps as production)
+5. Deploy: `dndev staging`
+
+---
+
+## Secrets (Stripe, OAuth, etc.)
+
+Server-side secrets go in `functions/.env`, not the app `.env`:
+
+```bash
+# functions/.env
+STRIPE_SECRET_KEY=sk_live_...
+STRIPE_WEBHOOK_SECRET=whsec_...
+GITHUB_CLIENT_SECRET=...
+```
+
+Push to Firebase Secret Manager:
+
+```bash
+dndev sync-secrets
+```
+
+Secrets are auto-loaded by Cloud Functions at runtime. Never put server secrets in `VITE_*` variables — those are exposed to the browser.
+
+---
+
+## Cloud Run IAM (Technical Detail)
+
+Firebase 2nd gen Cloud Functions run on Cloud Run. By default, Cloud Run blocks unauthenticated OPTIONS requests (CORS preflight). This breaks browser calls to your functions.
+
+`dndev deploy` automatically runs `gcloud run services update --no-invoker-iam-check` on all deployed functions. Your functions still validate Firebase Auth in code — this only allows the CORS preflight to pass.
+
+If you deploy manually with `firebase deploy`, you'll need to run this yourself. Use `dndev deploy` instead.
+
+---
+
+## Troubleshooting
+
+**"Service account key not found"**
+→ Download from Firebase Console → Service Accounts → Generate new private key
+→ Save as `service-account-key.json` in your app root
+
+**"Permission denied" / 401 on deploy**
+→ Check service account key is valid JSON with `project_id`, `private_key`, `client_email`
+→ Re-download if corrupted
+
+**"CORS error" on function calls**
+→ Use `dndev deploy` instead of `firebase deploy` (handles IAM automatically)
+→ Or run: `gcloud run services update <function-name> --region=<region> --no-invoker-iam-check --project=<project-id>`
+
+**".env values not loading"**
+→ Check the `.env` file is in your **app directory** (`apps/<app>/.env`), not the repo root
+→ All Vite vars must start with `VITE_`
+
+**"License key not working"**
+→ Must be in `apps/<app>/.env` as `VITE_DONOTDEV_LICENSE_KEY=dndev_...`
+→ Must start with `dndev_` and be at least 20 characters
+
+---
+
+**`dndev firebase:setup` → download service account key → enable Auth + Firestore → `dndev emu start` → `dndev deploy`. That's it.**