🥗 NutriTrack - AI-Powered Nutrition Tracking Application

A comprehensive full-stack web application that helps users track their daily nutrition, log meals, monitor water intake, and get personalized nutrition insights using AI.

🚀 Getting Started

Dashboard Overview

The Dashboard provides a quick summary of your daily nutrition, hydration tracking, and progress towards your goals. Users can log meals, water intake, exercises, and weight, all from one convenient view.

---

Meal Plan Playground

The Meal Plan Playground allows users to generate personalized meal plans based on dietary preferences and restrictions. You can set your daily calorie target, meal duration, and select from various diet types to create a plan that fits your needs.

---

Nutritional Insights

Nutritional Insights breaks down the nutritional content of your saved meals. Get a clear view of your total calories, protein, carbs, and fat, plus a detailed per-recipe analysis in both chart and table formats.

---

Calorie Scanner

With the Calorie Scanner, you can upload food photos to automatically analyze their calorie and macronutrient content. The feature uses smart detection to suggest food items and provides tips for best results.

🌟 Features

🔐 Authentication & User Management

• Google OAuth 2.0 integration for seamless login
• JWT-based authentication for secure sessions
• User registration and login with email verification
• Protected routes and session management

🍽️ Meal Logging System

• Multi-step meal wizard (Meal Type → Food Selection → Review)
• Comprehensive food database with 17+ vegetarian/vegan options
• Real-time nutrition calculation with accurate macro tracking
• Meal categorization (breakfast, lunch, dinner, snack)
• Quantity-based serving calculations with proper rounding

📊 Nutrition Tracking Dashboard

• Real-time nutrition display (calories, protein, carbs, fat)
• Progress rings with percentage completion
• Daily nutrition goals (2000 calories, 150g protein, 200g carbs, 70g fat)
• Timeline view of logged meals and activities
• Water intake tracking with visual progress

💾 Data Persistence

• MongoDB integration for all user data storage
• Meal storage with complete nutrition breakdown
• Water log storage with timestamps
• User profile management
• Data persistence across sessions

🎨 User Interface & Experience

• Responsive design (mobile-first approach)
• Modern UI components with Tailwind CSS
• Smooth animations using Framer Motion
• Interactive charts and data visualization
• Modal-based workflows for better UX

📈 Insights & Analytics

• Personal nutrition analyst with AI insights
• Time period filtering (day, week, month)
• Nutrition deficiency tracking
• Weekly overview charts
• Consistency heatmaps

🛠️ Tech Stack

Frontend

• React 18 with TypeScript
• Vite (build tool and dev server)
• Tailwind CSS (styling framework)
• Framer Motion (animations)
• Recharts (data visualization)
• React Router (navigation)
• Axios (HTTP client)
• Vitest (testing framework)

Backend

• Node.js with Express.js
• TypeScript (type safety)
• MongoDB with Mongoose ODM
• Passport.js (authentication)
• Google OAuth 2.0 (social login)
• JWT (JSON Web Tokens)
• bcryptjs (password hashing)
• dotenv (environment variables)

Development Tools

• Git (version control)
• ESLint (code linting)
• Prettier (code formatting)
• PostCSS (CSS processing)

Prerequisites

• Node.js (v16 or higher)
• MongoDB (local or cloud)
• Google OAuth credentials

Installation

1. Clone the repository

   git clone https://github.com/16Prithvi/NutriTrack.git
   cd NutriTrack

2. Install dependencies

   # Install frontend dependencies
   cd frontend
   npm install
   
   # Install backend dependencies
   cd ../server
   npm install

3. Environment Setup

   Create a .env file in the server directory:

   MONGODB_URI=mongodb://localhost:27017/nutritrack
   JWT_SECRET=your_jwt_secret_here
   GOOGLE_CLIENT_ID=your_google_client_id
   GOOGLE_CLIENT_SECRET=your_google_client_secret
   GOOGLE_CALLBACK_URL=http://localhost:5000/api/auth/google/callback
   CLIENT_URL=http://localhost:3000

4. Start the application

   # Start the backend server
   cd server
   npm run dev
   
   # Start the frontend (in a new terminal)
   cd frontend
   npm run dev

5. Access the application

   • Frontend: http://localhost:3000
   • Backend API: http://localhost:5000

📁 Project Structure

NutriTrack/
├── frontend/                 # React frontend application
│   ├── src/
│   │   ├── components/      # Reusable UI components
│   │   ├── pages/          # Page components
│   │   ├── services/       # API service functions
│   │   ├── context/        # React context providers
│   │   ├── hooks/          # Custom React hooks
│   │   ├── types/          # TypeScript type definitions
│   │   └── utils/          # Utility functions
│   ├── public/             # Static assets
│   └── package.json
├── server/                  # Node.js backend application
│   ├── src/
│   │   ├── controllers/    # Route controllers
│   │   ├── models/         # MongoDB models
│   │   ├── routes/         # API routes
│   │   ├── middleware/     # Custom middleware
│   │   └── config/         # Configuration files
│   └── package.json
└── README.md

🔧 Key Features Implementation

Real-time Nutrition Calculation

// Accurate nutrition calculation with proper rounding
const mealTotals = meal.foods?.reduce((totals, { food, quantity }) => ({
  calories: totals.calories + (food.calories * quantity),
  protein: Math.round((totals.protein + food.protein * quantity) * 10) / 10,
  carbs: Math.round((totals.carbs + food.carbs * quantity) * 10) / 10,
  fat: Math.round((totals.fat + food.fat * quantity) * 10) / 10
}), { calories: 0, protein: 0, carbs: 0, fat: 0 });

Backend Integration

// Save meal to MongoDB
const handleMealLogged = async (meal: Omit<Meal, 'id' | 'name'>) => {
  try {
    await createMeal(mealData); // Save to backend
    // Update local state
  } catch (error) {
    // Graceful fallback
  }
};

📊 Database Schema

User Collection

• Google OAuth integration
• User profile information
• Authentication tokens

Meal Collection

• User association
• Food items with quantities
• Calculated nutrition totals
• Timestamps and metadata

Water Log Collection

• User association
• Amount and timestamps
• Notes and metadata

🎯 Future Enhancements

• Mobile app development (React Native)
• AI meal recommendations based on user preferences
• Social features (sharing meals, challenges)
• Barcode scanning for food logging
• Integration with fitness trackers
• Advanced analytics and reporting
• Meal prep planning features

🤝 Contributing

1. Fork the repository
2. Create a feature branch (git checkout -b feature/AmazingFeature)
3. Commit your changes (git commit -m 'Add some AmazingFeature')
4. Push to the branch (git push origin feature/AmazingFeature)
5. Open a Pull Request

📝 License

This project is licensed under the MIT License - see the LICENSE file for details.

👨‍💻 Author

Prithvi - GitHub

🙏 Acknowledgments

• Unsplash for food photography
• React and Node.js communities
• MongoDB for database support
• All open-source contributors

---

Live Demo: https://github.com/16Prithvi/NutriTrack

Issues & Support: GitHub Issues