Using React, build a UI that:
- Fetches a list of "employees" from the provided
/api/employees
endpoint. - Renders the list of employees, with each employee displayed in a summarized form.
- Allows a user to expand each employee to show the additional details about each employee.
- Allows a user to expand the entire list of employees at once using something like an "Expand All" button.
- Allows a user to delete an employee from the system.
- BONUS: Implement some kind of updating functionality for one or more fields on the employee.
A few helpful tips:
- Don't focus on styling. We're more interested in seeing how you write your component(s) and handle things like managing React state and making HTTP requests.
- You're encouraged to write unit tests.
- Fork the
employees-sample-app
repository. - In the project directory, run
yarn install
to download the app's dependencies. - Run
yarn start
to run the app in development mode. It will be viewable at http://localhost:3000 in your browser. The page will hot reload as you make changes to your application code. - We are using Mirage JS to provide a mock backend for the application. You can check out the mock backend server implementation in
src/server.js
. Feel free to extend or modify the endpoints provided if they do not suit your needs. Currently, the server implements three endpoints:GET /api/employees
- This endpoint returns a list of all the employees.PATCH /api/employees/:id
- This endpoint allows updating of a single employee record.DELETE /api/employees/:id
- This endpoint allows deleting a single employee record.
- You can run tests with
yarn test
. - When you are done, push your commits to your forked repository and send us a link to the repository (make sure the repository is public).
This project was bootstrapped with Create React App. If you run into any issues with running the app, you can check out the Create React App documentation for more information.