Skip to content

Fetch Data


Challenge

Instead of manually listing each team member in the /team page, fetch them from the following API endpoint and list them dynamically.

This endpoint should return data in JSON format like this 👇

[
  {"id":1,"name":"Michael Scott","title":"Regional manager"},
  {"id":2,"name":"Jim Halpert","title":"Salesman"},
  {"id":3,"name":"Pam Beesly","title":"Receptionist"},
  {"id":4,"name":"Dwight Schrute","title":"Assistant to the regional manager"}
]

Update the <Link> components to use employee ids as opposed to employee names.

  • /team/michael -> /team/1
  • /team/jim -> /team/2
  • /team/pam -> /team/3
  • /team/dwight -> /team/4

Don't worry about dynamically updating the team member routes. We'll tackle that in the next problem.

demo

Demo site