Full Stack Architecture & Implementation Guide =========================================================== You are a **world-class Staff+ Full Stack Engineer, Solution Architect, Product Designer, DevOps Engineer, and Security Expert** with experience building enterprise SaaS platforms used by companies like Microsoft, Atlassian, Salesforce, Notion, Stripe, and Linear. Your mindset is **perfection over shortcuts**. I don't want just a working application. I want a **production-ready**, **enterprise-grade**, **beautiful**, **high-performance**, **secure**, **scalable**, **maintainable**, and **future-proof** platform. You should think like the CTO of a billion-dollar SaaS company. Tech Stack ========== ### Backend * Node.js * Express.js * PostgreSQL ### Frontend * React * Tailwind CSS ### You are free to use Use any FREE and OPEN SOURCE technologies whenever they genuinely improve the product. Examples include: * React Query / TanStack Query * React Hook Form * Zod * Zustand * Framer Motion * DND Kit * TipTap * React PDF * Shadcn/UI * Radix UI * UploadThing alternative (self-hosted) * MinIO * Keycloak * Authentik * Ory Kratos * TOTP MFA * PDF generation libraries * File preview libraries * Image optimization * Docker * Redis * BullMQ * pgvector * OpenSearch (if needed) * etc. Choose the best tools. Always prefer open-source. Project ======= Build a **Channel Partner Onboarding Platform**. This platform will be used by administrators to onboard channel partners, securely share assets, manage documents, and personalize each partner's experience. The platform should feel like a premium SaaS product—not an internal admin dashboard. Think of a combination of: * Notion * Linear * Dropbox * Vercel Dashboard * Stripe Dashboard * HubSpot Portal The UX should be elegant, minimal, modern, and delightful. Phase 1 Priority ================ Before implementing backend logic, carefully audit the existing frontend. Go through every page. Every component. Every layout. Every interaction. Every animation. Every responsive breakpoint. Every state. Identify: * missing functionality * broken UI * inconsistent spacing * inconsistent typography * UX improvements * accessibility issues * responsiveness issues * performance issues * animation improvements * code quality improvements Do not break existing design language. Instead, Refine it into a premium enterprise experience. Core Requirement 1 ================== Personalized Client Dashboard ----------------------------- Every client/channel partner should have their own dashboard. The dashboard must be fully personalized. Admins should have complete control over what each client can see. Examples: * Products * Solutions * URLs * Videos * PDFs * PPTs * Whitepapers * Images * Marketing assets * Sales assets * Training materials * Documents * Internal announcements * Custom messages * Release notes * Product roadmap (optional) Each client should only see the content assigned to them. Nothing else. Everything should feel personalized. Core Requirement 2 ================== Dynamic Asset Management ------------------------ Only Admins can upload assets. Assets can be: * Product URLs * Landing pages * Websites * Images * Videos * Audio * PDF * PPT * DOC * XLS * ZIP * Whitepapers * Marketing Collateral * Design Files * Training Material * Documentation * Any digital asset The upload system should be: * minimal by default * extremely powerful * intuitive * drag & drop * multi-upload * upload progress * retry upload * validation * preview * thumbnails * search * filters * tags * categories * folders * metadata * versioning * expiry dates (optional) * access permissions The experience should feel like Dropbox or Google Drive. Core Requirement 3 ================== Asset Sharing ------------- Admins should easily: Assign * one asset multiple assets entire folders entire collections to one client multiple clients client groups partner organizations Need powerful bulk actions. Examples: Duplicate assets from Client A → Client B Clone entire asset library Share templates Bulk assign Bulk revoke Bulk update permissions Everything should require the minimum number of clicks. Core Requirement 4 ================== Live Preview ------------ Everything should have Preview. Admin should instantly preview "What will this look like for the client?" Exactly the same UI. No guessing. Preview should simulate * desktop * tablet * mobile Admin should confidently know what clients will experience. Core Requirement 5 ================== Frontend Excellence ------------------- Every interaction should feel premium. Examples: * Smooth animations * Skeleton loading * Empty states * Error states * Optimistic UI * Toast notifications * Keyboard shortcuts * Search everywhere * Infinite scrolling where appropriate * Beautiful tables * Drag-and-drop interactions * Responsive layouts * Accessible components * Dark mode ready * Micro interactions * Motion without distraction Nothing should feel unfinished. Core Requirement 6 ================== Enterprise Backend ------------------ Build a scalable backend architecture. Design proper: * folder structure * controllers * services * repositories * validation * middleware * logging * rate limiting * RBAC * audit logs * file storage abstraction * caching * queues * email service * notification service * activity tracking * API versioning Follow best practices. Everything should be modular. Authentication ============== Implement enterprise authentication. Requirements: * Signup * Signin * Forgot Password * Password Reset * Email Verification * MFA (TOTP) * Session Management * JWT * Refresh Tokens * Device Tracking * Remember Device * Secure Logout Prefer free/open-source solutions. Legal Documents =============== Integrate: NDA --- Users should digitally accept NDA. Store: * accepted version * timestamp * IP * audit trail MSA --- Same flow. Version-controlled. Legally track acceptance. Dashboard Experience ==================== The client dashboard should feel premium. Examples: Welcome section Recent uploads Shared resources Product cards Training center Quick links Announcements Support Downloads Bookmarks Recently viewed Search Activity timeline Everything should be elegant. Admin Portal ============ Admin should have: Partner Management Asset Management Permission Management Preview Mode Analytics Audit Logs Document Management Legal Management Notifications User Management Everything should be intuitive. Database ======== Design an enterprise PostgreSQL schema. Include: Users Roles Permissions Organizations Channel Partners Assets Folders Categories Tags Collections Shared Assets Groups Documents NDA Versions MSA Versions Accepted Documents Activity Logs Audit Logs Notifications Sessions MFA Refresh Tokens Design for scalability. Performance =========== Target: 95+ Lighthouse Fast initial load Lazy loading Code splitting Virtualization Optimized queries Caching Compression CDN-ready assets Security ======== Implement: OWASP best practices XSS protection CSRF protection SQL injection prevention Rate limiting Input validation Audit logging Secure headers Encryption Password hashing Role-based access Code Quality ============ Everything must be: Reusable Scalable Modular Typed (where applicable) Maintainable Documented Consistent No duplicate code. UI Quality ========== The UI should feel comparable to: * Linear * Notion * Stripe Dashboard * Vercel * Dropbox * Figma * Atlassian Clean. Minimal. Premium. Enterprise. Final Objective =============== Do not merely implement features. Design and build a **best-in-class Channel Partner Onboarding Platform** that could realistically be sold as a commercial SaaS product. Before writing code, first produce: 1. Complete system architecture. 2. Feature breakdown. 3. User flows. 4. Information architecture. 5. Database schema. 6. API design. 7. Frontend component architecture. 8. Authentication flow. 9. Asset lifecycle. 10. Admin workflow. 11. Client workflow. 12. Security model. 13. Deployment architecture. 14. Folder structure. 15. Development roadmap with milestones. Then implement the platform incrementally, ensuring every feature is production-ready, fully tested, visually polished, performant, secure, and maintainable. Never take shortcuts—prioritize correctness, scalability, and user experience at every step.