Objective

Create a responsive multi-page app using react-router to display data fetched from an API.

Learning Outcome(s)

  • Use react-router to create multiple pages
  • Clear usage of a component tree to structure data flow.
  • Understanding of when and where to use hooks or not.
  • Ability to break down a website into reusable components.
  • Clear folder structure and architecture.
  • Isolated CSS to each component where necessary.

Notes

  • Use functional components and hooks to create your projects.
  • Dynamically add child components
  • Show and hide some elements on screen, conditional rendering
  • Filter data and show only relevant content
  • Include form as a contact form

Resources

Criteria for Assessment

  • Clear component tree for data flow
  • Correct use of react router
  • Correct api implementation to meet the project requirements (on page load? after button click?)
  • Correct use of hooks and state management
  • File architecture is structured and consistent