Tech Stack
Frontend
The frontend is a TypeScript React application built with Vite. It deploys to Vercel.
| Technology | Version | Purpose |
|---|---|---|
| React | 19.1.1 | UI framework |
| TypeScript | ~5.9.3 | Type safety |
| Vite | 7.1.7 | Build tool and dev server |
| React Router | 7.9.4 | Client-side routing |
| Tailwind CSS | 4.1.14 | Utility-first styling |
| Recharts | 3.2.1 | Data visualization (analysis charts) |
| Lucide React | 0.545.0 | Icon library |
| Supabase JS | 2.75.0 | Auth client (login/signup only) |
Dev server port: 5173
Frontend Pages (8)
| Page | Purpose |
|---|---|
LoginPage | Email/password authentication |
SignupPage | New account creation |
DashboardPage | Campaign list and overview |
MissionWizardPage | AI-guided question creation |
ConfigureCampaignPage | Campaign settings and participant upload |
CampaignDetailPage | Campaign monitoring and conversation list |
ParticipantResponsePage | Chat interface for participants |
AnalysisPage | AI-generated analysis dashboard |
Backend
The backend is a plain JavaScript Express application. It deploys to Render.
| Technology | Version | Purpose |
|---|---|---|
| Node.js | 18+ | Runtime |
| Express | 5.1.0 | Web framework |
| Anthropic SDK | 0.66.0 | Claude AI API client |
| Supabase JS | 2.75.0 | Database and auth client |
| Resend | 6.1.3 | Transactional email delivery |
| node-cron | 4.2.1 | Scheduled reminder jobs |
| csv-parse | 6.1.0 | CSV participant upload parsing |
| multer | 2.0.2 | File upload handling |
| cors | 2.8.5 | Cross-origin request handling |
| uuid | 13.0.0 | Unique ID generation |
Server port: 3001
Backend Structure
backend/src/
├── server.js # Entry point
├── config/
│ ├── supabase.js # Supabase client setup
│ └── resend.js # Resend client setup
├── middleware/
│ └── auth.js # JWT authentication
├── routes/
│ ├── campaigns.js # Campaign endpoints
│ ├── conversations.js # Conversation endpoints
│ ├── mission.js # Mission wizard endpoints
│ └── analysis.js # Analysis endpoints
├── controllers/
│ ├── campaignController.js
│ ├── conversationController.js
│ ├── missionController.js
│ └── analysisController.js
├── services/
│ ├── aiService.js # All Claude AI functions (1000+ lines)
│ ├── emailService.js # Email templates and sending
│ └── reminderScheduler.js # Cron-based reminders
└── utils/
└── jsonExtractor.js # Safe JSON parsing from AI responses
Database
| Technology | Purpose |
|---|---|
| Supabase | Hosted PostgreSQL with built-in auth and row-level security |
| PostgreSQL | Relational database (7 tables) |
| Row-Level Security | Multi-tenant data isolation |
| JWT | Authentication tokens managed by Supabase Auth |
See Data Model for the full schema.
Infrastructure
| Service | Purpose | Environment |
|---|---|---|
| Vercel | Frontend hosting and CDN | Production |
| Render | Backend API hosting | Production |
| Supabase Cloud | Database and auth | Production |
| Resend | Email delivery (hello@tap.yelin.io) | Production |
| Anthropic API | Claude AI access | Production |
Environment Variables
Backend
| Variable | Purpose |
|---|---|
PORT | Server port (3001) |
NODE_ENV | Environment (development/production) |
SUPABASE_URL | Supabase project URL |
SUPABASE_ANON_KEY | Public Supabase key |
SUPABASE_SERVICE_ROLE_KEY | Admin Supabase key (bypasses RLS) |
ANTHROPIC_API_KEY | Claude AI API key |
RESEND_API_KEY | Resend email API key |
FROM_EMAIL | Sender address for emails |
APP_URL | Frontend URL for email links |
Frontend
| Variable | Purpose |
|---|---|
VITE_SUPABASE_URL | Supabase project URL |
VITE_SUPABASE_ANON_KEY | Public Supabase key |
VITE_API_URL | Backend API base URL |