Case Study / Full-Stack Web Application

Mission Deck
one system, everything.

A personal command center for freelance design and development work. CRM, project management, invoicing, AI assistant, music studio, analytics, global search, content pipeline, and more. All sharing one database, one auth layer, one URL. Built entirely solo.

Role
Solo Build
Timeline
Ongoing
Stack
Next.js · Neon · Claude
Year
2026
missiondeck.app
The Problem

Every tool knows one thing. None of them know what the others know.

The typical freelance setup: a project manager here, a CRM somewhere else, invoices in a third app, analytics spread across three dashboards, notes in Notion. Each tool is fine on its own. Together they require constant manual translation. The cost isn't just the subscriptions, it's the context-switching. Starting a work session means opening eight tabs, doing mental math to connect information that should just be connected. Mission Deck started as an experiment. What if one system knew everything? It's now the tool the entire practice runs out of. The most thorough proof of what one person can build.

15+
Modules sharing one database. CRM, projects, proposals, invoices, content pipeline, analytics, music studio. Open one tab, see everything connected.
1
URL the entire practice runs out of. No tab-switching, no syncing services, no Zapier hops. Every record is a foreign key away from every other record.
0
Subscriptions paid to a SaaS for any of the above. The cost of building it once is the cost of running the entire practice. Forever.
What it produces

The practice runs out of one URL.

Mission Deck isn't a portfolio piece. It's the platform every other portfolio piece ships from. Every proposal, invoice, project, article, and newsletter on this site originated inside it.

Ruck Authority editorial pipeline
The 74 articles on ruckauthority.com are scheduled, drafted, and tracked inside Mission Deck's Editorial module. Title, status, cover image, social copy, and IG card all live in one record. The cron that publishes to FB and IG reads from this database.
Lettercarry newsletter sends
Both the joel.design newsletter and the Ruck Authority weekly email run on Lettercarry, which itself is composed inside Mission Deck's Studio module. Two voices, two lists, one composer.
Studio Notes content engine
Tutorials, news, and field notes that ship to joel.design/studio-notes start as Editorial records here. Production briefs, image plans, and IndexNow pings all hang off the same row.
Client work, end to end
Proposals get drafted, accepted, converted into projects, billed via invoice, and analyzed inside one record graph. The CRM, the project plan, and the financials are foreign keys away from each other.
Design System

Built for dense information, not decoration.

Command centers don't get to be beautiful at the cost of being readable. The palette is dark-first with high-contrast functional accents. Command purple for navigation and primary AI actions. Execute teal for success states, revenue, and live data. Alert coral for recording, warnings, and high-urgency items. Signal amber for proposals in-flight and status flags.

Color Palette
Command
#6C5CE7
Execute
#00D9A3
Alert
#FF6B8A
Signal
#F9A825
Void
#09090F
Surface
#111118
Headlines / Poppins 900
Dashboard. Studio. Command.
Body & Prose / Source Serif 4
Project and client data, rendered in a readable format that doesn't fight the dense surrounding UI for attention.
UI Labels & Navigation / Inter
Projects · CRM · Studio · Analytics · JARVIS
Data & Code / Monospace
INV-108 · $11,400 · 106 routes
Design Philosophy

The decisions that made it useful instead of impressive.

Two principles drove every architectural and design decision. Both came from real frustration with how most tools work.

One data layer, not 15 integrations
Building one system instead of integrating existing tools was the obvious call. Integrations break, fall out of sync, and require maintenance. A shared Postgres database doesn't. When a proposal becomes a project, the link is a foreign key. Not a Zapier automation that might fail silently on a Tuesday.
"The relational model is why opening a company record shows every proposal, invoice, project, and contact associated with it. That's not a feature. It's just what a properly normalized database looks like."
JARVIS is a chief of staff, not a chatbot
The AI surface across Mission Deck doesn't answer questions. It surfaces overdue proposals, flags slipping roadmap items, and recommends what to work on today based on what's actually in the database. JARVIS, Studio's co-writer, and Roadmap import each use Claude with a different prompting strategy because they each do a different job. The chat box is a narrow part of the surface, not the whole product.
"The difference between an AI feature that feels useful and one that feels like a demo is context. Structured prompting and real data injection are what make the difference."
Click any screen to bring it forward
Detailed breakdown

Why it works as one system

Single Auth Layer
One login gets you everywhere. No separate passwords for different modules, no re-verifying identity. NextAuth.js with Postgres sessions.
Shared Postgres Schema
All modules read from the same 30+ related tables. A contact in CRM is the same entity everywhere. No syncing, no data drift.
Single Global Search
One search box finds invoices, projects, clients, proposals, notes, and more. All 13 searchable resource types in one index.
Unified AI Layer
Claude API is injected into the platform at the infrastructure level. Every module that needs AI context gets it automatically.
One Content Pipeline
Files, notes, client work, code snippets all flow through one upload system with real-time transcription for audio.
The Ecosystem

What it connects to

Vercel
Edge Functions power the global search. Middleware handles auth. Deploy previews let clients see work in progress.
Neon Postgres
Hosted Postgres with branching for previews. Full relational integrity. Real foreign keys, not just IDs.
Cloudflare R2
Object storage for files and images. Signed URLs for secure downloads. No bundled uploads to the database.
Anthropic Claude
Context-aware AI across modules. Structured outputs for schema generation. Streaming for real-time UI updates.
OpenAI Whisper
Real-time transcription for the Studio module. Voice notes become searchable text in the content pipeline.
GA4 / Meta / Instagram
Analytics APIs feed into one dashboard. No context switching between platforms. Real cross-channel insights.
15+
Modules, One System
1
Database, One Truth
1
Auth Layer, One Identity
1
URL the Practice Runs On
$0
SaaS Subscriptions Replaced
1
Developer
System Overview

How the pieces connect.

Client Layer
App
Next.js 15 App Router
Styling
Tailwind CSS v4
Auth
NextAuth.js
API Layer: 106 Route Files
Projects
/api/projects
CRM
/api/crm
Studio
/api/studio
Analytics
/api/analytics
AI
/api/ai
Search
/api/search
Data + Services Layer
Database
Neon Postgres
Storage
Cloudflare R2
AI
Anthropic Claude
Transcription
OpenAI Whisper
Analytics APIs
GA4 / Meta / Instagram
Next Project
Ruck Authority →