Architects Trove

A static, Git-friendly viewer for team architecture diagrams: Mermaid files, optional built-in AWS/GCP-style maps, and workspace-based navigation. Diagrams and metadata live under public/workspaces/ so changes flow through normal commits and reviews.

Repository: github.com/taryntny/architects-trove

Why “Architects Trove”?

• Trove — one place to keep the diagrams and views your team treats as reference material.
• The UI uses an ocean / gem motif and the line “Look at this trove, treasures untold” as a nod to Part of Your World from The Little Mermaid (a playful reference, not affiliated with Disney).
• architects-trove (kebab-case) is the repo and package name; workspace folder names under public/workspaces/ should stay lowercase with hyphens.

Quick start

git clone https://github.com/taryntny/architects-trove.git
cd architects-trove
pnpm install   # or npm install
pnpm dev       # or npm run dev

Open the dev server URL (Vite defaults to port 5173).

Adding diagrams and workspaces

The in-app How it works guide (the ? button in the header) walks through:

• What a workspace is and how URLs like /#workspace=demo map to folders
• Adding .mmd files and manifest.json entries
• Creating a new workspace and registering it in public/workspaces/index.json
• Built-in diagram types (mermaid, svg-aws-overview, etc.)
• Saving edits made in the browser back to the repo

Contributing ideas and PRs

• Request a new diagram type: open issue
• Request a feature: open issue
• Have a fix ready? Open a pull request

Small, focused PRs are easiest to review. If your idea is larger, opening an issue first helps align on scope.

Build and deploy

pnpm build     # or npm run build

For GitHub Pages, set VITE_BASE_URL to your repo path (e.g. /architects-trove/) when building; the app uses hash-based routing so assets resolve correctly under a subpath. The deploy script runs vite build and publishes dist via gh-pages (see package.json).

Tech stack

React, TypeScript, Vite, Tailwind CSS, Mermaid.