About The Project

As someone who forgets to ask if a dish has any allergens in it (peanuts and tree nuts in my case), I thought building this helpful tool might be cool. Take a picture of your food, upload it, execute the API calls, and voila ... food, ingredients, and potential allergens are detected for you. No need for social interaction! P.S. This is for educational and experimental purposes only. Do not use this as official. Consult your food provider or official nutritional information

What I learned

It's always a challenge to make a project with a new tool. In this case, I used two new tools, LogMeal AI API and Radix-ui. Now, although I've developed projects with APIs before, ensuring that my frontend, computation, and requirements matched the needs of the API was a challenge. Radix-ui made the DOM more understandable with its simplicity. After using it and looking at how the computer interpreted the CSS via inspect, I feel like I've re-learned everything.

Challenges

  • Conversion of images
  • Compression of images
  • Parsing LogMeal API output for preferred data

Built With

Front End

  • ReactJS
  • Javascript
  • Radix-ui

Back End

  • Firebase DB
  • GitHub Pages
  • LogMeal API

Roadmap

  • [X] Add Error Alerts
  • [ ] Host on Vercel
  • [ ] Multi-language Support
    • [ ] Spanish

See the open issues for a full list of proposed features (and known issues).

Built With

  • api
  • artificial-intelligence
  • firebase-database
  • logmeal
  • radix-ui
  • react
Share this project:

Updates