Full-Stack CRM from Zero
React 18 · Vite · Supabase · PostgreSQL · Tailwind CSS · n8n · 2025
Overview
A complete CRM and transportation management system built from scratch for a logistics company. Sales account management, pipeline visualization (Kanban), document template library, and automated workflows. Supabase provides authentication and row-level security for multi-tenant data isolation.
The Problem
The company was managing sales accounts in spreadsheets, tracking pipeline stages via email threads, and generating documents manually from templates. No single source of truth, no automation, no audit trail. The owner needed a system that matched their specific workflow — not a generic CRM with features they'd never use.
Architecture
| Layer | Technology | Purpose |
|---|---|---|
| Frontend | React 18 + Vite | SPA with responsive UI |
| Styling | Tailwind CSS | Utility-first responsive design |
| Database | Supabase (PostgreSQL) | Data storage, auth, RLS |
| Auth | Supabase Auth | Email/password, role-based access |
| Automation | n8n webhooks | Workflow triggers on CRM events |
| Hosting | Ubuntu VPS | Production deployment |
Core Features
Account Management
- Account detail slide-out panel with full history
- Contact information, notes, activity log
- Custom fields per account type
- Search and filter across all accounts
Sales Pipeline (Kanban)
- Drag-and-drop pipeline stages
- Custom stage definitions (Prospect → Qualified → Proposal → Negotiation → Closed)
- Pipeline analytics with stage duration metrics
- Deal value tracking and forecasting
Document Templates
- Template library for common documents (quotes, contracts, BOLs)
- Variable substitution from account data
- Version history per template
Workflow Automation
- n8n webhook triggers on CRM events (new account, stage change, deal close)
- Automated notifications to stakeholders
- Follow-up reminders based on pipeline stage duration
Multi-Tenant Security
Supabase Row Level Security (RLS) ensures data isolation:
- Each user sees only their assigned accounts
- Admin role has full visibility
- RLS policies enforce at the database level — even direct API access respects boundaries
- JWT-based authentication with role claims
Key Design Decisions
- Supabase over custom backend — Auth, database, and RLS in one platform. No need to build authentication from scratch for an internal tool.
- Kanban over table view — Sales teams think in pipeline stages, not spreadsheet rows. The visual metaphor matches how they already talk about deals.
- n8n for automation — Decouples workflow logic from the CRM codebase. Business rules change frequently; n8n lets the team modify workflows without code deploys.
Outcome
- Single source of truth for all sales data
- Pipeline visibility across the team
- Automated follow-up reminders (reduced missed follow-ups)
- Document generation in seconds instead of manual template filling