ryuzaki01/react-challenge

Goat React Code Challenge

XYZ GOAT React.js Code Challenge

TODO List React is a code challenge for frontend developer.

Mission

Here are the tasks you must complete:

• Complete the TODO List application in accordance with the design (image above)
  • Fetch tasks
  • Add a new task
  • Delete a task
• MUST use JSON Server (db.json) as API server when fetching tasks, adding a new task and deleting a task
• Implement custom hooks in order to manage tasks
• Add more than 3 unit tests (custom hooks and components) with jest
• Refactor the code to be more readable
• Add source code comments to be more readable

Rules

NOT ALLOWED

• Remove existing source code
• Change the API server and db.json
• Use another languages like TypeScript (MUST use JavaScript)

ALLOWED

• Change the design to have better UI and UX
• Modify existing source code
• Create new modules/methods/components/hooks
• Add new packages

Commands

In the project directory, you can run:

yarn start

Runs the app in the development mode.
Open http://localhost:3000 to view it in the browser.

The page will reload if you make edits.
You will also see any lint errors in the console.

yarn test

Launches the test runner in the interactive watch mode.
See the section about running tests for more information.

yarn build

Builds the app for production to the build folder.
It correctly bundles React in production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes.
Your app is ready to be deployed!

See the section about deployment for more information.

yarn server

Run the API server with JSON Server.

Hiring Criteria

We will evaluate your skills based on criteria as below.

• Complete all functionalities
• Test coverage should be greater than 70%
• Mocking network requests
• Follow component oriented programming
• Add source code comments to be more readable
• Good naming convention (filenames, functions and variables)
• Design testable functions
• implement custom hooks
• High maintenance source code
• Error handling