Unit 03: Frontend APIs and Async

Overview

The focus this unit is:

  • Asynchronous JavaScript
  • Consuming web APIs created by other developers
  • Testing client side apis
  • Using APIs on the client-side with Tanstack Query
  • Exposing client-side web API endpoints

We'll expose and consume web APIs and be using this to make even more powerful React interfaces.

Core Concepts

Asynchronous JavaScript

Web APIs

React Component Life Cycle with useEffect

Exercises

*Note: If any of these exercise links are sending you to a 404, it means the challenge hasn't been made available yet. You will get access to challenges alongside the material in bootcamp. Please let an instructor know if something should be available that isn't.

  • consuming-clientside-apis (select your cohort for a link)

Async State with Tanstack Query

Exercises

  • query-em-all (select your cohort for a link)

Query Mutations

Exercises

  • korihi (select your cohort for a link)
  • Performing client-side rendering of API data

    • Issuing client-side requests
  • Testing with vitest

    • Client-side - react-testing-library, nock

Learning Outcomes

Tech Skills

Core

I can...

  • Use React-Query in a React app
  • Use a simple external api and render some information on the web page

Stretch

I can...

  • Test React Query
  • Test connected components that depend on React Query