Description: |
Core Requirements (TED-like website) Design, very much like Ted.com, but in our blue.
I cant find a template on next, but i what a Clean, fast UI similar to ted.com
1. Frontend (React/Next.js + Tailwind)
Home page: featured videos, categories
Video page: - Vimeo embed - Transcript viewer (currently this follows a AI DS Call that reads the vimeo transcript) ** we want to improve this. - sidebar of related videos
Searchable tags / categories
Async page loading
Fully responsive
2. Content Management / Video Hosting Videos hosted on Vimeo (use their API to fetch thumbnails, metadata, transcripts)
Static/dynamic generation of video pages from a JSON/DB/API - we have cloudflare CDN
3. User Access System IP-based Access (e.g., for university/library users) Use reverse proxy or edge logic (e.g. Cloudflare Workers) to match IPs SSO Integration SAML 2.0 or OAuth2 (Azure AD, Google, Shibboleth, etc.) Non Inst: Login w/ email + password (optional)
Subscription System Stripe or Paddle for paywall access Role-based access to free vs paid videos Guest view system, 4 free views pm then referred to sign up page
4. Backend (if needed) API for: Checking IP range access User authentication (JWT or SSO) Serving transcript + AI summary Tech: FastAPI, Flask, or even Node.js (if JS-only)
5. Admin Dashboard (Phase 2) Upload new video metadata (or pull from Vimeo) Tag, edit, assign access levels |