It is time to organize the technical specifications that I have been thinking about and planning. The frontend is pretty simple at this stage. The backend will probably be written in Python or Node. Additionally, at least three external services will be required for a fully working product.
1. Application Architecture
Framework & Runtime:
- Frontend: Next.js 16.0.7 (App Router)
- Backend: Express.js (separate backend server on port 3001)
- Language: TypeScript 5.3.3
- Package Manager: Yarn
- React: 19.2.1
Database:
- Primary: unknown
Authentication:
- unknown
2. API Keys & Configuration
Storage:
- Zustand store with localStorage persistence
- Key: api-keys-storage
3. Payment System (Stripe Connect)
Payment Flow:
- Unkown
Payment Statuses:
- pending – Payment initiated
- held – Funds in escrow
- released – Funds released to talent
- refunded – Payment refunded
- disputed – Payment in dispute
4. Frontend Pages & Routes
Authenticated Routes (App):
- /chat/[threadId] – Chat interface
- /projects – Client projects/jobs list
- /projects/[jobId] – Job detail page
- /candidates – Client candidates/applications
- /applications – Talent applications
- /portfolio – Talent portfolio management
- /settings – User settings (API keys, profile)
- /payments – Talent payment settings
- /payments/[proposalId] – Client payment checkout
- /membership – Subscription management
- /msg/[proposalId] – Message/application detail
- /profile – User profile management
5. State Management
Zustand Stores:
- useApiKeysStore – API keys management (persisted)
- useAppStore – Application state
- useChatStore – Chat/thread management (with Dexie)
Dexie Database:
- Database name: ThreadDatabase
- Tables: threads, threadItems
- Indexed by: id, createdAt, threadId, parentId
6. UI Components & Libraries
Component Libraries:
- Radix UI (dialogs, dropdowns, tooltips, etc.)
- Tabler Icons
- Phosphor Icons
- Lucide React
Styling:
- Tailwind CSS 3.4.1
- Tailwind Animate
Form Management:
- Formik
- Zod validation
- Zod-Formik adapter
Other UI Libraries:
- Framer Motion (animations)
- Sonner (toasts)
- TipTap (rich text editor)
- React Markdown
- Recharts (charts)
Specializations:
- Full-stack Web Developer, Frontend Developer, Backend Developer, Mobile Developer, DevOps Engineer, Data Engineer, ML Engineer, Product Designer
7. Analytics & Monitoring
Analytics:
- PostHog (product analytics)
- Hotjar (user behavior)