Healthy Check is an application that let users scan a barcode of any food/drink product. When the user scans the barcode, the barcode will be used to receive data from the Open Food Facts API. This will receive data such as nutriments in the product.
As foodie I want to be able to scan products while doing groceries, so I can read more information about the product and make a good choice that fits with my diet. Design and build a single page app based on a chosen user story.
open your CLI (windows) or Terminal (Mac)
copy and paste this code
$ git clone https://github.com/jody29/HealthyCheck.git
open the folder
$ cd HealthyCheck
open the folder in VScode
$ code .
For this project I used the Open Food Facts API. The documentation for this API can be found here: Documenation
Design and build a single page app based on a chosen user story.
Deficiency | Criterion | Improvement |
---|---|---|
User Interface - you design, build and test the user interface by applying interface design principles | ||
Code structure - you write modular, consistent and efficient HTML, CSS and JavaScript code by applying structure and best practices. You manage state for the application and the UI | ||
Data management - you understand how you can work with an external API using asynchronous code. You can retrieve data, manipulate and dynamically convert it to structured html | ||
Project - your app is working and published on GitHub Pages. Your project is thoroughly documented in the README.md file in your repository. |
To do | Done? |
---|---|
Barcode scanner | ✅ |
API connection | ✅ |
get data from API | ✅ |
Ideal state | ✅ |
Loading state | ✅ |
Error state | ✅ |
Manually fill in barcode | ✅ |
Manually fill in product | |
Show suggestions when fill in |
MIT