Code → Web

Firemap gives you two ways to define your schema: code-first with TypeScript decorators, or visual-first with the Schema Designer. The firemap export command bridges them — you can visualize your code-defined models in the web Schema Designer.

This matters more in Firestore than it would in a relational database. Postgres will hand you a schema diagram because the schema lives in the database; Firestore has no schema to inspect. The console shows you documents one at a time, with no view of which collection references which, where data is denormalized, or which fields are optional. The only complete description of your data model is the model files themselves — which is exactly what the export reads.

Step 1: Export from CLI

bash
# Run in your project root
firemap export

# Output is JSON — pipe to clipboard (macOS)
firemap export | pbcopy

# Or on Windows (PowerShell)
firemap export | Set-Clipboard

The export loads every file matched by the models glob in your config so the decorators register themselves, then serialises the resulting metadata. A model file that no glob reaches simply will not appear on the canvas, with no warning — if a collection is missing after an import, check the glob before anything else.

Step 2: Import in Schema Designer

1. Open your project in the web platform
2. Go to the Schema Designer
3. Click the Import from Code button in the toolbar (code icon)
4. Paste the JSON output
5. Preview your collections, then click Import

Parsing and conversion happen entirely in the browser — the JSON is validated against the expected shape, converted, and shown as a preview listing the collections it found before anything touches the canvas. If the paste is truncated or is the wrong kind of JSON you get an explicit error rather than a half-populated diagram, so a failed import costs you nothing but a second attempt.

What Gets Imported

The import preserves your full schema definition:

  • ✓Collections with all fields, types, and required flags
  • ✓Security rules (@Rules, @AuthOwner, @PublicRead)
  • ✓Denormalization relationships (@DenormalizedFrom, @SyncTo)
  • ✓Soft delete, ID strategy, subcollections
  • ✓Composite indexes (@Index)

Field-level detail survives the round trip too: defaults, descriptions, array element types, and nested map fields all come across as structured data rather than a flattened blob. Models declared with a parent collection are attached to their parent as subcollections and drawn beneath it, and the canvas lays everything out on a grid automatically, so a schema with twenty collections arrives readable instead of stacked at the origin.

Two limits are worth knowing. Denormalized fields are matched back onto the field they belong to by name, so an unusual naming scheme can attach the annotation to the wrong field on the canvas. And relationship edges are drawn from denormalization links — a plain reference field with no accompanying denormalization does not produce an edge on its own, because Firestore document references carry a path and not a declared target collection. There is nothing in the stored reference that says which collection it points at.

Example

typescript
// src/models/user.ts
@Rules({ read: 'auth != null', write: 'auth != null' })
@SoftDelete
@Collection('users')
class User extends BaseModel {
  @Required
  @Field({ type: 'string' })
  name!: string;

  @Required
  @Field({ type: 'string' })
  email!: string;
}

// Terminal:
// $ firemap export
// [{ "collectionName": "users", "fields": [...], "rules": {...} }]
//
// Paste into Schema Designer → "Import from Code"
// → Your models appear on the canvas with full metadata

The exported JSON is an array of collection objects, one per @Collection, each carrying its fields, rules, indexes and denormalization links — so it is also a reasonable artifact to diff in code review or attach to a design document when you want to talk about a schema change without opening the codebase.

The bridge runs in both directions. Once a schema is on the canvas, the toolbar's Export Firemap Models action downloads a TypeScript file of decorated model classes, which is the faster way to start when you would rather sketch collections visually and generate the decorators afterwards.

All documentation

PreviousLicense Key