Create a web app where the user has a list of everything she eats and the amount.
✅ 1 - The user should be able to add items to the list.
✅ 2 - The items are organized by day.
✅ 3 - The user can filter items by date.
✅ 4 - Each food item can have a type: Protein, Fat, or Carbohydrate.
✅ 5 - User can see a graph on the top of the list with the Item type distribution(Protein, Fat, or Carbohydrate).
✅ 5.1 - For the backend please create a way to get data for the graph.
✅ 5.2 - For the frontend please create a way to display the graph.
✅ 6 - Here in Finetune we are huge fans of tests especially TDD, so it's strongly recommended to implement the features using TDD and adding the tests first on the commit, this is optional.
✅ 7 - The user can delete items from the list.
This test has a lot of features on purpose, you should feel free to choose the ones you think will make the most impact on the user and showcase your skills.
.
├── cypress # Automated tests(cypress)
├── src # source code
|___ components # application components
|___ context # Contexts
|___ hooks # Hooks
|___tests__ # Hooks tests (react testing library)
|___ pages # application pages
|___ home # Initial Page
|___ utils # Utilities functions
|___tests__ # Utilities tests (react testing library)
Typrescript - https://www.typescriptlang.org/
Material UI - https://mui.com/
Cypress - https://www.cypress.io/ (Integration tests)
React Testing Library - https://testing-library.com/ (Unit tests)
Conventional Commits - http://conventionalcommits.org/ (commits specification)
$ git clone https://github.com/thalesf/challenge-finetune.git
$ cd challenge-finetune
$ npm install or yarn
$ npm start or yarn start
# visit http://localhost:3000
$ npm test or yarn test
$ start the project(port 3000)
$ run test:cypress
$ choose the test
Please use React or NextJS. There are no contains on libraries. TypeScript is a plus. Your focus is on the UI and not on the backend. Any API is a plus.
Please use Python (Django, Flask, or Chalice) Hasura is a plus Your focus is on the backend and not on the UI. Any UI is a plus.
The goal is to demonstrate how organized and structure your code is. Please put your code in a repository and share it with me.