Search⌘ K
Home
Courses
Modern Front-end Development for Rails

Using the Context

Explore how to use React context and reducers to manage state efficiently across components. Understand how context eliminates prop drilling while enabling components like VenueHeader and VenueBody to access shared state and dispatch actions for updates.

We'll cover the following...

Venue component

Without having to pass properties or handle data, the Venue component gets a lot simpler:

TypeScript 3.3.4
import * as React from "react"
import Subtotal from "./subtotal"
import VenueBody from "./venue_body"
import VenueHeader from "./venue_header"
export const Venue = () => {
  return (
    <>
      <Subtotal />
      <VenueHeader />
      <VenueBody />
    </>
  )
}
export default Venue

It’s just calling three other components: the VenueHeader and VenueBody we already had, and our new one, Subtotal.

VenueHeader component

I’d like to cover Subtotal ...