Skip to content

built with react native expo to help users manage and monitor their dietary habits. it allows users to log daily food intake, monitor calorie consumption, analyze macronutrients such as proteins, fats, and carbohydrates, track daily water consumption, and keep an eye on weight changes over time.

Notifications You must be signed in to change notification settings

denizyesilirmak/nutrition-mobile

Repository files navigation

🥗 Nutrition Mobile

A smart nutrition tracking application powered by Expo React Native

📱 Features

🔍 Smart Food Detection

  • Instant nutritional information calculation
  • Camera integration for food scanning
  • Food image analysis and processing

🍽️ Meal Management

  • Track daily meals and portions
  • Detailed nutritional breakdown
    • Calories
    • Protein
    • Carbohydrates
    • Fat
    • Vitamins & Minerals
  • Meal history and patterns
  • Custom meal additions

📊 Analytics & Insights

  • Daily nutrition summary
  • Weekly progress tracking
  • Monthly nutrition analysis
  • Historical data visualization
  • Personalized nutrition goals

👤 Profile Management

  • User authentication
  • Personal goals setting
  • Dietary preferences
  • Progress tracking

🌍 Multi-language Support

  • English
  • German
  • Spanish
  • French
  • Italian
  • Turkish

🧩 Components

Core Components

  • BackgroundImage - Customizable background wrapper
  • Button - Reusable button component
  • Checkbox - Interactive checkbox element with animations
  • DailyChart - Daily macronutrient distribution chart
  • DatePicker - Date selection component
  • FoodDetector - ML-powered food recognition
  • FoodListItem - Food item display component
  • Heatmap - Calendar-style nutrition heatmap
  • HomeMealInput - Quick meal input interface
  • Image - Enhanced image component
  • LargeSwitch - Segmented control component
  • MeasurementsSheet - Bottom sheet for measurements
  • Meals - Meal tracking interface
  • NumberSelector - Weight selection component
  • Overview - Nutritional overview dashboard
  • ProgressBar - Animated progress indicator
  • ScreenView - Screen container component
  • SearchBar - Food search functionality
  • Separator - Visual divider component
  • Stepper - Horizontal step indicator
  • Table - Nutritional information table
  • TabView - Swipeable tab navigation
  • TextInput - Customizable text input
  • ValueChip - Nutrient value display chip
  • WaterOverview - Water consumption tracker
  • WeeklyChart - Weekly nutrition distribution chart

Documentation for Components

Screens

  • Profile Screen (/screens/profile)
  • Camera Screen (/screens/camera)
  • Meal Tracking Screen
  • Analytics Dashboard
  • Settings Screen

🛠️ Technology Stack

Core

  • React Native (Expo v52) - Mobile framework
  • TypeScript - Type safety and enhanced development experience
  • Expo Router v4 - File-based routing solution
  • Zustand v4 - Lightweight state management
  • React Query v5 - Powerful data synchronization

UI & Styling

  • NativeWind v4 - Tailwind CSS for React Native
  • Tailwind CSS v3 - Utility-first CSS framework
  • @expo/vector-icons v14 - Comprehensive icon library
  • Lottie React Native v7 - High-quality animations
  • React Native Reanimated v3 - Advanced animations
  • React Native Gesture Handler - Native-driven gesture management

Data Visualization

  • @shopify/react-native-skia - High-performance 2D graphics
  • @shopify/flash-list - High-performance list component

Internationalization

  • i18next - Robust internationalization framework
  • expo-localization - Native device locale detection
  • react-i18next - React bindings for i18next

Storage & Performance

  • react-native-mmkv - High-performance key-value storage
  • date-fns - Modern date utility library
  • lodash - Utility library for data manipulation

Camera & Vision

  • react-native-vision-camera v4 - Camera functionality
  • expo-image - High-performance image component

Development Tools

  • Jest - Testing framework
  • ESLint - Code linting
  • Prettier - Code formatting
  • expo-dev-client - Development build capabilities

Native Features

  • expo-haptics - Haptic feedback
  • expo-file-system - File system access
  • expo-splash-screen - Splash screen management
  • expo-status-bar - Status bar control
  • expo-system-ui - System UI integration

📦 Installation

  1. Clone the Repository
git clone git@github.com:denizyesilirmak/nutrition-mobile.git
  1. Install Dependencies
cd nutrition-mobile
npm install
  1. Start Development
# Start the development server
npm start

# Run on iOS
npx run:ios --device

# Run on Android
npx run:android --device

📚 Documentation

Detailed documentation available for:

🤝 Contributing

We welcome contributions! Please see our contributing guidelines for details.

📄 License

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

🔗 Links


Made with ❤️ for better nutrition tracking

About

built with react native expo to help users manage and monitor their dietary habits. it allows users to log daily food intake, monitor calorie consumption, analyze macronutrients such as proteins, fats, and carbohydrates, track daily water consumption, and keep an eye on weight changes over time.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages