Skip to content

reactjs.md

Latest commit

 

History

History
33 lines (27 loc) · 2.25 KB

reactjs.md

File metadata and controls

33 lines (27 loc) · 2.25 KB

React.js Coding Challenge

Problem

Create a React.js web application that displays a list of products and allows users to filter and sort them based on various criteria.

Requirements

  1. Fetch a list of products from an API endpoint (you can use any mock APIs).
  2. Display the list of products in a grid or list view, showing the product name, price, and an image, ( any additional information like rating and review is added advantage ).
  3. Implement a filter functionality using query parameter, that allows users to filter products based on categories (e.g., electronics, clothing, books) or any other relevant criteria.
  4. Implement a sorting functionality that allows users to sort products by price (low to high or high to low) or any other relevant criteria.
  5. Include pagination or infinite scrolling to handle large product lists.
  6. Implement a search functionality that allows users to search for products by name or any other relevant search criteria.
  7. Add a feature to mark products as favorites using global state ( use Context API ) and allow users to view their favorite products separately.
  8. Implement proper error handling and loading states for API requests and data retrieval.
  9. Use React Router to create multiple routes/pages, such as a product detail page when a product is clicked.
  10. Use Context API to manage the app's state and handle data fetching and sharing.
  11. The code should be well-organized, commented, and readable.
  12. You should use Git for version control.

Submission:

  1. Please create a public GitHub / BitBucket repository for your project.
  2. Your repository must have a detailed README.md with instructions on how to set up & run your code locally.
  3. We would like you to present your work no later than 3 days from the day you receive your task.

The presentation would be done in these steps:

  1. Run your code locally
  2. Give us a UI and features walkthrough
  3. Explain your code
  4. Run tests, if any

Feel free to use any additional packages, libraries, or UI frameworks you find useful. Provide the source code of the React.js app and any necessary instructions to run it.

Remember, you can modify or extend this challenge according to your specific requirements and the skills you want to evaluate.