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

Folders and files

NameName
Last commit message
Last commit date
Oct 7, 2024
Dec 17, 2024
Jun 23, 2024
Jun 5, 2024
Dec 25, 2024
Nov 24, 2024
Jun 23, 2024
Aug 24, 2024
Jun 23, 2024
Dec 17, 2024
Dec 20, 2024
Nov 24, 2024
Jul 27, 2024
Nov 24, 2024
Dec 20, 2024
Jun 23, 2024
Jun 23, 2024
Jun 23, 2024
Dec 16, 2024
Dec 16, 2024
Jul 27, 2024
Nov 24, 2024

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