# 📋 ThrillWiki Nuxt Frontend - Context Summary for LLMs ## 🎯 Project Overview Building a modern Nuxt 3 frontend for ThrillWiki (theme park database) that integrates seamlessly with the existing Django REST API backend. The frontend will be implemented in the `frontend/` directory using an existing component library and Context7 for documentation. ## 🏗️ Current System Architecture ``` thrillwiki_django_no_react/ ├── backend/ # Django REST API (existing, robust) │ ├── apps/api/v1/ # Comprehensive REST API │ ├── templates/ # HTMX + Alpine.js templates (separate system) │ └── static/ # Backend static files ├── frontend/ # NEW - Nuxt 3 frontend (to be created) │ ├── components/ # Using existing component library │ ├── composables/ # API integration & auth │ ├── pages/ # Route pages │ └── plugins/ # Context7 integration ├── docs/nuxt/ # This documentation (Context7-powered) └── context_portal/ # Context7 integration ``` ## 🔧 Key Technical Decisions Made ### Framework & Architecture - **Frontend Framework:** Nuxt 3 with Vue 3 Composition API - **Language:** TypeScript for type safety - **Location:** `frontend/` directory (separate from Django backend) - **State Management:** Pinia for global state - **Component Library:** TBD - existing reusable library (user choice needed) ### Authentication & API - **Authentication:** JWT with refresh tokens (requires Django backend enhancement) - **API Integration:** Django REST API at `/api/v1/` - **Current Django Auth:** Token-based (needs JWT upgrade) - **API Client:** Custom composables with $fetch ### Documentation & Knowledge Management - **Documentation System:** Context7 integration - **Knowledge Preservation:** LLM-optimized documentation structure - **Status Tracking:** Comprehensive progress tracking system ### Deployment & Infrastructure - **Deployment:** Self-hosted with Docker - **Development:** Separate frontend/backend with proxy - **Environment:** Development proxy to Django backend ## 📊 Current Django Backend Capabilities ### Existing API Endpoints (Comprehensive) ``` /api/v1/auth/ # Authentication (token-based, needs JWT) /api/v1/parks/ # Parks CRUD, search, photos /api/v1/rides/ # Rides CRUD, search, photos /api/v1/accounts/ # User profiles, top lists /api/v1/rankings/ # Ride rankings system /api/v1/maps/ # Geographic data and mapping /api/v1/history/ # Change tracking and history /api/v1/trending/ # Trending content /api/v1/health/ # System health checks ``` ### Database Models (Rich Data Structure) - **Parks:** Name, location, operator, status, photos - **Rides:** Name, park, category, manufacturer, specs, photos - **Users:** Profiles, preferences, top lists, reviews - **Photos:** Park/ride photos with moderation - **Rankings:** Sophisticated ride ranking system - **History:** Complete change tracking - **Companies:** Manufacturers, operators, designers ## 🎯 User Requirements (Final) ### Core Requirements 1. **Context7 Integration:** Use for documentation and knowledge management 2. **Frontend Location:** Implement in `frontend/` directory 3. **Component Library:** Use existing reusable component library (choice needed) 4. **Authentication:** JWT with refresh tokens 5. **Deployment:** Self-hosted infrastructure 6. **Features:** Submission system with moderation capabilities 7. **Design:** Completely responsive, modern interface ### Feature Requirements - **Content Submission:** Users can submit parks, rides, photos, reviews - **Moderation System:** Admin interface for content approval/rejection - **User Management:** Profiles, authentication, preferences - **Search & Discovery:** Advanced search, filtering, trending content - **Photo Management:** Upload, gallery, moderation workflow - **Rankings:** Display and interact with ride ranking system - **Maps Integration:** Geographic visualization of parks/rides ## 🚨 Critical Dependencies & Blockers ### Immediate Blockers 1. **Component Library Choice:** Must choose before frontend setup - Options: Nuxt UI, Vuetify, Quasar, PrimeVue, Element Plus - Impact: Affects entire UI architecture and development approach ### Technical Dependencies 1. **Django JWT Enhancement:** Backend needs JWT endpoints added 2. **Context7 Integration:** Approach for documentation integration 3. **Development Environment:** Frontend/backend proxy configuration ## 🔄 Integration Points ### Django Backend Integration - **API Consumption:** All data via REST API endpoints - **Authentication:** JWT tokens for secure API access - **File Uploads:** Photos and media through Django endpoints - **Real-time Features:** WebSocket integration for live updates (future) ### Context7 Integration - **Documentation:** Auto-generated API docs and component docs - **Knowledge Management:** Preserve implementation context - **LLM Handoffs:** Structured information for continuation ## 📈 Success Metrics 1. **Functionality Parity:** All Django backend features accessible 2. **Performance:** Fast loading, responsive interactions 3. **User Experience:** Intuitive, modern interface 4. **Maintainability:** Clean, documented, testable code 5. **Scalability:** Ready for future feature additions ## 🎨 Design Philosophy - **Mobile-First:** Responsive design starting with mobile - **Modern Aesthetics:** Clean, contemporary interface - **User-Centric:** Intuitive navigation and interactions - **Performance-Focused:** Fast loading and smooth animations - **Accessible:** WCAG compliance and keyboard navigation --- **Next Steps:** Read `00-CONTINUATION-GUIDE.md` for specific implementation instructions.