A comprehensive bio-analytics platform for fitness tracking, nutrition management, and AI-powered health insights. Built with Next.js 15, featuring a 3D holographic body visualization system that displays real-time muscle fatigue analysis.
Vitalis AI is a full-stack health and fitness application designed to help users track workouts, manage nutrition, and receive personalized AI recommendations. The platform features a unique 3D Digital Twin that visualizes muscle fatigue states based on workout history, providing an intuitive understanding of recovery needs.
- Workout Tracking: Create and log workouts with detailed set, rep, and weight tracking
- Nutrition Management: Track daily meals with comprehensive macro and calorie monitoring
- Exercise Database: Pre-loaded database of 50+ exercises with muscle group categorization
- Workout History: Unified timeline showing all training and nutrition activities
- User Profiles: Personalized profiles with bio-metrics and fitness goals
- 3D Digital Twin: Real-time holographic body visualization showing muscle fatigue status
- AI Insights Engine: Rule-based recommendation system for training and nutrition
- Progressive Overload Tracking: Automatic volume comparison and progress monitoring
- Muscle Fatigue Analysis: Database-driven muscle group mapping for accurate recovery tracking
- Admin Dashboard: Full CRUD interface for exercise management
- NextAuth v5 integration with OAuth providers (GitHub, Google)
- Role-based access control (RBAC) with admin-only routes
- Session management with JWT tokens
- Protected API endpoints with authentication middleware
- Framework: Next.js 15 (App Router)
- Language: TypeScript (Strict mode)
- Styling: Tailwind CSS with custom Cyberpunk/Void theme
- UI Components: Shadcn UI, Radix UI
- Icons: Lucide React
- 3D Graphics: Three.js with React Three Fiber and Drei
- State Management: Zustand with persist middleware
- Data Fetching: TanStack Query (React Query)
- Forms: React Hook Form with Zod validation
- API: Next.js API Routes (RESTful)
- Database: PostgreSQL (Supabase)
- ORM: Prisma 7 with PrismaPg adapter
- Authentication: NextAuth.js v5
- Password Hashing: bcryptjs
- Linting: ESLint with Next.js config
- Type Checking: TypeScript 5
- Package Manager: npm
Before installation, ensure you have:
- Node.js 18.x or higher
- npm or yarn package manager
- PostgreSQL database (Supabase recommended)
- GitHub and/or Google OAuth credentials (optional)
- Clone the repository:
git clone <repository-url>
cd vitalis-next- Install dependencies:
npm install- Set up environment variables:
Create a .env file in the root directory with the following variables:
# Database
DATABASE_URL="postgresql://user:password@host:port/database?schema=public"
# NextAuth
NEXTAUTH_URL="http://localhost:3000"
NEXTAUTH_SECRET="your-secret-key-here"
# OAuth Providers (Optional)
GITHUB_CLIENT_ID="your-github-client-id"
GITHUB_CLIENT_SECRET="your-github-client-secret"
GOOGLE_CLIENT_ID="your-google-client-id"
GOOGLE_CLIENT_SECRET="your-google-client-secret"- Generate Prisma client:
npx prisma generate- Run database migrations:
npx prisma db push- Seed the database:
npm run seedThis will populate the database with:
- 50+ pre-configured exercises
- 100+ food items with nutritional data
- Default admin user (admin@vitalis.ai / admin123)
npm run devOpen http://localhost:3000 in your browser.
npm run build
npm startnpm run lintAfter seeding the database, you can log in with:
Admin Account
- Email:
admin@vitalis.ai - Password:
admin123
Note: Change the admin password immediately in production environments.
vitalis-next/
|-- app/ # Next.js App Router
| |-- (app)/ # Protected routes (requires auth)
| | |-- admin/ # Admin dashboard
| | |-- gym/ # Workout tracking
| | |-- nutrition/ # Nutrition tracking
| | |-- history/ # Activity history
| | +-- profile/ # User profile
| |-- api/ # RESTful API endpoints
| | |-- auth/ # Authentication
| | |-- exercises/ # Exercise CRUD
| | |-- workouts/ # Workout logging
| | |-- nutrition/ # Nutrition logging
| | |-- user/ # User management
| | +-- admin/ # Admin operations
| |-- login/ # Login/Register page
| |-- layout.tsx # Root layout
| +-- globals.css # Global styles
|-- components/ # React components
| |-- auth/ # Authentication components
| |-- dashboard/ # Dashboard widgets
| |-- gym/ # Workout components
| |-- nutrition/ # Nutrition components
| |-- history/ # History components
| |-- layout/ # Layout components
| +-- ui/ # Reusable UI components
|-- lib/ # Core business logic
| |-- services/ # Service layer
| | |-- ai.service.ts # AI recommendation engine
| | |-- workout.service.ts # Workout operations
| | |-- nutrition.service.ts # Nutrition operations
| | |-- user.service.ts # User operations
| | +-- storage.service.ts # LocalStorage abstraction
| |-- stores/ # Zustand state stores
| | |-- body.store.ts # Muscle fatigue state
| | |-- workout.store.ts # Active workout state
| | +-- nutrition.store.ts # Nutrition state
| |-- types/ # TypeScript type definitions
| |-- mock-data/ # Seed data generators
| |-- prisma.ts # Prisma client singleton
| +-- utils.ts # Utility functions
|-- prisma/ # Database schema & migrations
| |-- schema.prisma # Prisma schema definition
| +-- seed.ts # Database seeding script
|-- public/ # Static assets
| +-- models/ # 3D models (GLB files)
|-- auth.ts # NextAuth configuration
|-- auth.config.ts # NextAuth edge config
|-- middleware.ts # Route protection middleware
+-- tailwind.config.ts # Tailwind CSS configuration
POST /api/register
- Register a new user account
- Body:
{ email, password, name }
GET/POST /api/auth/*
- NextAuth authentication endpoints
- Handles OAuth and credentials login
GET /api/exercises
- Retrieve all exercises
- Response:
{ data: Exercise[] }
POST /api/exercises
- Create a new exercise (requires admin role)
- Body:
{ name, muscleGroup, equipment } - Response:
{ data: Exercise }
GET /api/exercises/[id]
- Get single exercise by ID
- Response:
{ data: Exercise }
PUT /api/exercises/[id]
- Update exercise (requires admin role)
- Body:
{ name, muscleGroup, equipment }
PATCH /api/exercises/[id]
- Partial update exercise (requires admin role)
- Body: Partial
{ name, muscleGroup, equipment }
DELETE /api/exercises/[id]
- Delete exercise (requires admin role)
GET /api/workouts
- Get user's workout history
- Requires authentication
POST /api/workouts
- Log a completed workout
- Body:
{ name, duration, totalVolume, exercises[], notes } - Requires authentication
GET /api/nutrition?date=YYYY-MM-DD
- Get nutrition logs for a specific date
- Requires authentication
POST /api/nutrition
- Log a meal entry
- Body:
{ date, mealType, foodName, calories, protein, carbs, fats, servings } - Requires authentication
DELETE /api/nutrition/[id]
- Delete a nutrition log entry
- Requires authentication
GET /api/user/profile
- Get current user profile
- Requires authentication
PATCH /api/user/profile
- Update user profile with automatic macro recalculation
- Body:
{ age, weight, height, gender, goal, activityLevel } - Requires authentication
DELETE /api/user/delete
- Delete user account and all associated data
- Requires authentication
GET /api/dashboard/stats
- Get comprehensive dashboard statistics
- Returns: user profile, recent workouts, nutrition data, AI insights
- Requires authentication
- User: User accounts with bio-metrics and fitness goals
- Exercise: Exercise database with muscle group categorization
- Workout: Completed workout sessions with exercise logs
- NutritionLog: Daily meal tracking with macro breakdown
- Food: Food database with nutritional information
- User has many Workouts
- User has many NutritionLogs
- Workouts store exercises as JSON (denormalized for performance)
- Foods and Exercises are shared across all users
The holographic body system uses Three.js to render a 3D human model with dynamic material properties based on muscle fatigue status:
- Fresh (Green): Muscle group is well-rested and ready for training
- Fatigued (Red): Muscle group was trained within the last 24 hours
- Recovering (Blue): Muscle group is in recovery phase (24-48 hours post-training)
- Target (Violet): Muscle group is recommended for training today
The system uses database-driven muscle group mapping for language-agnostic and reliable fatigue tracking.
The rule-based AI system analyzes:
- Consecutive training days and recovery needs
- Protein intake relative to targets
- Calorie balance and deficit/surplus patterns
- Progressive overload achievement
- Volume trends and training frequency
Recommendations are generated in real-time and displayed on the dashboard.
- Set up a PostgreSQL database (Supabase recommended)
- Configure environment variables for production
- Set up OAuth providers (GitHub, Google) with production URLs
- Generate a secure
NEXTAUTH_SECRET
- Push code to GitHub repository
- Import project in Vercel dashboard
- Configure environment variables
- Deploy
The application is optimized for Vercel's platform with automatic API routes and serverless functions.
A Docker configuration can be added for containerized deployment. The application requires:
- Node.js runtime
- PostgreSQL connection
- Environment variable configuration
- Use TypeScript strict mode
- Follow functional programming patterns
- Prefer server components over client components
- Use Zustand for client-side state, TanStack Query for server state
- Keep business logic in service layers
- Use Zod for schema validation
- Use kebab-case for files:
active-session-view.tsx - Use PascalCase for components:
ActiveSessionView - Use camelCase for functions and variables
- Create feature branches from main
- Write descriptive commit messages
- Keep commits focused and atomic
- Test before pushing
If you encounter connection errors:
- Verify
DATABASE_URLis correctly formatted - Check database credentials and network access
- Ensure PostgreSQL is running and accessible
- Verify OAuth credentials are correctly set in
.env - Check callback URLs in GitHub/Google OAuth settings
- Ensure
NEXTAUTH_URLmatches your deployment URL
- Verify
human_parts.glbexists inpublic/models/ - Check browser console for WebGL support
- Ensure Three.js dependencies are properly installed
This project is developed for educational purposes as part of a university coursework submission.
For questions or issues related to this project, please refer to the project documentation or contact the development team through the university portal.
Version: 1.0.0
Last Updated: February 2026
Built with: Next.js 15, TypeScript, Prisma, Three.js