Registration
Registration
Registration
Fitness Tracker
Lab Insights
Recovery page
Health Records
Login
Registration
Sleep Tracker
Registration
Meal Planner
Nutrition Tracker
Dashboard

VitaLedger: Project Story

🌟 Inspiration

The idea for VitaLedger was born from a simple realization: health data is everywhere, but actionable insights are rare.

In today's world, we track steps, log meals, monitor sleep, and get lab results—but this data lives in silos. Fitness apps don't talk to nutrition trackers. Lab reports sit in folders, unanalyzed. Mental wellness is often an afterthought.

What if there was a single platform that could:

Unify all aspects of health tracking
Use AI to transform raw data into personalized recommendations
Consider your unique body chemistry (via lab results) when suggesting meals or workouts
Provide mental wellness support alongside physical health

This vision drove the creation of VitaLedger—a holistic health companion powered by modern AI.

🎯 What I Learned

Building VitaLedger was a journey through cutting-edge technologies and complex health domains:

Technical Discoveries

1. RAG (Retrieval-Augmented Generation) Architecture

I learned how to implement a production-grade RAG system that:

Scrapes real-time health information from verified sources (using BrightData SERP API)
Embeds content using sentence transformers
Stores vectors in ChromaDB for lightning-fast retrieval
Combines retrieved context with LLM reasoning (Groq's Llama 3.3)

The key insight: $\text{Quality of AI Response} \propto \text{Quality of Retrieved Context}$

2. Subscription System Architecture

Implemented a flexible subscription system with three modes:

MOCK: Local testing with simulated payments
LAVA_SANDBOX: Real API integration with test cards (zero cost)
LAVA: Production-ready payment processing

This taught me the importance of abstraction layers—one interface, multiple implementations.

3. Multi-Modal AI Integration

Different features need different AI approaches:

Meal Planning: Structured JSON generation with cultural awareness
Fitness Plans: Progressive overload calculations: $\text{Volume}{\text{next}} = \text{Volume}{\text{current}} \times (1 + \alpha)$ where $\alpha$ is the progression rate
Mindfulness: Conversational, empathetic responses
Lab Analysis: Medical reasoning with safety guardrails

4. State Management Patterns

React's useState and useEffect patterns for:

Real-time health tracking
Trial countdown timers
Subscription status synchronization
Form validation and error handling

Domain Knowledge

Nutrition Science:

Macro calculations: $\text{Calories} = (4 \times \text{Protein}_g) + (4 \times \text{Carbs}_g) + (9 \times \text{Fats}_g)$
Cultural food preferences impact adherence
Lab results (like high cholesterol) should override user preferences

Fitness Programming:

Progressive overload principles
Recovery tracking importance
Personalization based on experience level

Mental Health:

Importance of empathetic AI responses
Balancing guidance with professional referrals
Mindfulness techniques (breathing, journaling)

🔨 How I Built It

Architecture Overview

┌─────────────┐         ┌──────────────┐         ┌─────────────┐
│   React     │   HTTP  │   FastAPI    │   SQL   │   SQLite    │
│  Frontend   │ ◄─────► │   Backend    │ ◄─────► │  Database   │
└─────────────┘         └──────────────┘         └─────────────┘
                               │
                        ┌──────┴───────┐
                        ▼              ▼
                   ┌─────────┐   ┌──────────┐
                   │  Groq   │   │ChromaDB  │
                   │   AI    │   │   RAG    │
                   └─────────┘   └──────────┘

Tech Stack

Frontend:

React 18 (functional components, hooks)
Framer Motion (animations)
Lucide React (icons)
CSS3 (gradients, glassmorphism)

Backend:

FastAPI (async Python web framework)
SQLAlchemy (ORM)
Pydantic (validation)
Groq API (LLM inference)
ChromaDB (vector store)
BrightData (web scraping)

AI/ML:

Llama 3.1 8B Instant (fast, high rate limits)
Sentence Transformers (embeddings)
RAG pipeline for knowledge retrieval

Key Implementation Decisions

1. Async-First Backend

All AI calls use async/await to prevent blocking:

async def generate_meal_plan(self, user_profile, expectations):
    # Non-blocking AI call
    response = await self.client.chat.completions.create(...)
    return parse_response(response)

2. Trial System Auto-Activation

New users get instant value:

3-day Plus plan trial on registration
Trial expiration checking in guards
Countdown UI showing time remaining

3. Component-Based UI

Reusable components (Button, Card, Input) with consistent styling:

Gradient backgrounds
Smooth animations
Dark theme optimized

4. Environment-Based Configuration

.env files control behavior:

Switch payment modes instantly
Configure AI models per environment
Manage API keys securely

💪 Challenges Faced

Challenge 1: Rate Limiting Hell

Problem: Llama 3.3 70B has only 30 requests/day on free tier. Hit limits during development.

Solution:

Switched to Llama 3.1 8B Instant (14,400 requests/day)
Implemented exponential backoff with @backoff decorator
Added request caching for repeated queries

Challenge 2: JSON Parsing from LLMs

Problem: AI sometimes returned malformed JSON with markdown code blocks:

\`\`\`json
{"plan": ...}
\`\`\`

Solution:

Added explicit instructions: "Return ONLY valid JSON without markdown"
Implemented robust parsing with regex fallbacks
Validated output with Pydantic models

Challenge 3: Cross-Browser Hold-to-Talk

Problem: Voice recording worked in Chrome but failed in Firefox.

Solution:

Added onMouseLeave handler to stop recording when mouse exits button
Added onTouchCancel for mobile devices
Tested across Chrome, Firefox, Safari

Challenge 4: Subscription State Synchronization

Problem: Frontend showed stale subscription data after payment.

Solution:

Implemented webhook endpoint for real-time updates
Added polling fallback for missed webhooks
Used optimistic UI updates with rollback on error

Challenge 5: Empty Meal Plan Section

Problem: New users saw empty space instead of "Generate Meal Plan" button.

Solution:

Fixed conditional rendering logic
Ensured fullMealPlan explicitly set to null on error
Added proper state initialization

🎨 Design Philosophy

1. Progressive Disclosure

Don't overwhelm users—show complexity gradually:

Dashboard: Simple today's stats
Drill down: Detailed history and trends
Advanced: AI-powered insights

2. AI Transparency

Always show when AI is used:

"AI-powered" labels
Source citations for meal plans
Clear distinction between AI and medical advice

3. Accessibility First

High contrast text ($\text{contrast ratio} \geq 4.5:1$)
Large touch targets (min 44×44px)
Keyboard navigation support
Screen reader friendly

4. Mobile-First Responsive

Breakpoint strategy:

Mobile: < 768px (single column)
Tablet: 768-1024px (two columns)
Desktop: > 1024px (three columns)

📈 Metrics & Impact

Performance:

Page load: < 2s
AI response: ~3-5s (with streaming)
Database queries: < 50ms

Code Quality:

10,000+ lines of code
Modular architecture (8 backend modules)
Reusable components (15+ React components)

User Experience:

Auto-trial reduces friction
Sandbox mode enables risk-free testing
Consistent design language

🚀 Future Roadmap

Phase 1: Enhanced AI

Multi-modal AI (image-based meal logging)
Voice-first interaction mode
Predictive health insights

Phase 2: Social Features

Share meal plans with friends
Community challenges
Leaderboards

Phase 3: Wearable Integration

Apple Health sync
Fitbit/Garmin integration
Real-time heart rate analysis

Phase 4: Telehealth

Video consultations with dietitians
Lab result sharing with doctors
Prescription tracking

🙏 Acknowledgments

Technologies:

Groq for lightning-fast LLM inference
Lava for flexible payment infrastructure
BrightData for reliable web scraping
OpenAI for inspiring modern AI UX patterns

Community:

FastAPI docs for excellent async patterns
React community for component best practices
Health tech pioneers for domain inspiration

💡 Key Takeaway

Building VitaLedger taught me that great health tech isn't just about tracking—it's about understanding.

Raw data means nothing without context. A calorie count is just a number until AI considers your goals, your culture, your lab results, and your lifestyle. That's where the magic happens.

The future of health is personalized, intelligent, and empowering—and VitaLedger is a step in that direction.

Built with ❤️ and lots of ☕

"The best project I ever worked on was the one that made me healthier while building it."