VegaHed
📋 Project Overview
VegaHed is a full-stack web application inspired by the One Piece character Vegapunk, who consumed a fruit that allows him to remember everything he has ever read. However, the more knowledge he acquires, the larger his head becomes. With his intelligence, he invented Punk Record, a system that can store his knowledge as a server and link with his brain, allowing him to keep learning without worrying about the physical limits of his head.
VegaHed acts as a personal “Punk Record,” where users can paste links such as YouTube videos, TikTok posts, or Facebook posts. The system automatically categorizes them, making it easy to review information without searching across multiple platforms.
🎯 Project Goals & Objectives
- Primary Goal: Store all videos and post URLs that users consider important and want to review in the future.
- Secondary Goals: Automatically categorize saved information and improve the efficiency of revision.
📅 Project Timeline
| Phase | Start Date | End Date | Status | Details |
|---|---|---|---|---|
| Planning | 19/7 | 20/7 | Done | Defined scope, goals, and requirements. |
| Design | 21/7 | 28/7 | Done | Created wireframes, mockups, and finalized design assets. |
| Development (Core) | 30/7 | 30/9 | Ongoing | Implementing core features: authentication, dashboard, API integration. |
| Deployment (Initial) | 1/10 | 5/10 | Planned | Launch MVP version with core functions. |
| Updates & Enhancements | 10/10 | ongoing | Planned | Add new features: dark mode, profile customization, advanced LLM classifiers, optional integrations. |
🛠️ Technical Specifications
| Layer | Technologies | Notes |
|---|---|---|
| Frontend | ReactJS, Tailwind CSS | Built with ReactJS for UI logic; TailwindCSS used for fast, responsive styling. |
| Backend | NextJS, Auth.js | NextJS handles fullstack routing and API endpoints; Auth.js manages authentication and authorization. |
| Database | MongoDB Atlas | Cloud-hosted MongoDB Atlas used for scalable, secure database management. |
| Deployment | TBD | Likely Vercel for seamless NextJS deployment; alternatives under consideration. |
🎨 Design Resources
- Brand Guidelines: Logo (self-designed)
- Color Palette:
| #FFFFFF | #FFF6EA | #7C0A02 | #ED2939 | #FF5757 |
|---|
- Typography: Rowdies, Maven Pro
- Mockups: Canva
🔍 Main Functions
- Login / Sign Up / Sign Out
- Google & Facebook Authentication
- Homepage
- Dashboard
- LLM-based classifiers
- API integration
- Cookies / Session handling
- Profile page
- Passkey login (planned)
📝 Task Breakdown
Planning Phase
✅ Define project scope and objectives
✅ Create project timeline
✅ Draw data architecture
Design Phase
✅ Create wireframes
✅ Design mockups
✅ Finalize design assets
Development Phase
✅ Set up development environment
✅ Implement database structure
⬜ Implement frontend components
⬜ Develop backend functionality
⬜ Integrate APIs
Testing Phase
⬜ Conduct unit testing
⬜ Fix identified bugs
⬜ Performance optimization
Deployment Phase
⬜ Prepare deployment strategy
⬜ Set up production environment
⬜ Deploy website
⬜ Monitor for issues