With this app you can save a daily list of wht you eat from a list, and check your recomended calories based on height, age and weight.
IMPORTANT NOTE: This app uses 3rd-party cookies, so it might not work on more private browsers, as they tend to block 3rd-party cookies by default, so you might need to disable your adblocker while testing this one, sorry D:
At least in Brave Browser, I had to allow 3rd party cookies
You want to try it out without any installation? YOU CAN! Just check out the live version.
Steps:
- Clone this repo:
$ git clone git@github.com:YoseptF/my-eat-list-frontend.git
- Move to the lastest branch:
$ git checkout [branch name]
- Install the dependencies:
$ npm install
- Run the developer server:
$ npm start
You are gonna need some api keys to populate your .env, you can get them here:
There are 2 way you can run this program locally:
-
You can run the backend on your machine at the same time, for that you're gonna need to:
- Follow the steps over: here
- set the env so that it looks like this:
REACT_APP_CLIENT_ID={IMGUR_API_KEY} REACT_APP_BACKEND_URL=http://localhost:4000
- And run
npm start
-
You can let the frontend connect to the backend on the live version, although this has some caveats, to connect with the online api you need to be on a secure conection, this means opening the react developer server on
https
instead ofhttp
and this may cause your browser to give you an alert like this onein this case you need to click on advanced, and enter the page, It should only happen the first time.
Another viable option is to sign it yourself, in which case you can follow the official docs here. But I HIGHLY recommend to just enter manually, and save the time, the code is open source, so there's nothing harmful in the code.
After you choose what to do with the 'ssl-situation':
- set the .env to be like this:
REACT_APP_CLIENT_ID={IMGUR_API_KEY} HTTPS=true REACT_APP_BACKEND_URL=https://my-eat-list-backend.herokuapp.com
- And run
npm start
- React
- Netlify
- Heroku
- FontAwesome
- Icons made by Flat Icons from www.flaticon.com
- Code from myself Joseph Flores