fitprep

Inspiration

Balancing nutrition and fitness is difficult for busy students and professionals. Most fitness apps either ignore the food you currently have or require tedious manual tracking. FitPrep was inspired by the idea of making nutrition planning easy, practical, and accessible—building weekly meal and workout plans based solely on the foods you already own and your fitness goals.

What it does

FitPrep is a React-based web app that generates personalized 7-day meal and workout plans based on user-supplied foods. Users enter foods via text or voice, choose a fitness goal (Cut, Maintain, Bulk), and instantly receive a week-long plan with macro breakdowns, calorie targets, and interactive nutrition charts. Plans can be saved locally and optionally synced to Firebase for cross-device access.

How we built it

The app was built using React 19 with core components modularized for food input, meal generation, visualization, and data management. Nutrition data is stored in a JSON file. Macro visualizations are powered by Chart.js. We implemented a dual-saving system where localStorage is used for plan persistence by default, with the option to switch to Firebase if environment variables are set. Voice input and text-to-speech are integrated via browser APIs, and AI prompt wiring is architected for future expansion.

Challenges we ran into

Mapping inconsistent user food input (voice/text) to structured database entries required robust fuzzy matching.
Ensuring accurate macro calculations across variable food entries and serving sizes.
Integrating interactive charts in React while maintaining a fluid user experience.
Balancing local and cloud data storage to support both anonymous and registered users.
Building a simple, accessible UI that works across devices.

Accomplishments that we're proud of

A fully functional demo where users can plan meals and workouts in minutes with zero sign-up friction.
Seamless voice and text input for quick list building.
Macro charts that make nutrition easy to visualize and adjust.
Implementation of a fallback local save system for instant usability, with easy Firebase upgrade.

What we learned

The importance of designing for real-world food variability and user intent.
Deepened skills with React hooks, modular components, and third-party libraries (Chart.js).
Handling async data flows and browser limitations around voice/text APIs.
Designing systems to gracefully degrade features when cloud/back-end options aren't available.