Skip to content

Latest commit

 

History

History
25 lines (18 loc) · 1.08 KB

README.md

File metadata and controls

25 lines (18 loc) · 1.08 KB

React Router Challenge

Objective

Implement routing in a React application using react-router-dom. Set up routes for Home, Inventory, and InventoryDetails, and use the Navbar to navigate between them.

Instructions

  1. Setup Routes in App Component:

    • Wrap your application in a router component.
    • Define routes for Home ("/"), Inventory ("/inventory"), and InventoryDetails ("/inventory/:id").
  2. Create Navbar with Links:

    • Implement the Navbar component.
    • Add links to navigate to Home and Inventory pages using the appropriate components from react-router-dom.
  3. Implement InventoryDetails Component:

    • Use the useParams hook to get the item id from the URL.
    • Find the item in the inventory array by id.
    • Display the details of the item such as name, category, price, and quantity.
    • Use the useNavigate hook to create a back button that navigates to the Inventory page.

Notes

  • Ensure that all the links work correctly and navigating to different routes updates the displayed content accordingly.

Good luck!