MoonHighway / react-data

A React workshop at SeattleJS - August 7, 2023

Managing Data in a React Application

Thanks so much for being part of this workshop. I'm really glad that you're here. Below you'll find links for each section of the class.

Agenda

1. React Data Fetching
2. GraphQL Clients
3. @defer & @stream
4. Server Components Intro
5. Next.js App Router
6. Data Fetching with Next.js
7. Server Components-ifying Libraries

Instructor Info

• Eve Porcello: Twitter | Email
• Moon Highway Training: Moon Highway Website | Mailing List | Articles

1. React Data Fetching

• Slides
• useEffect
• useEffect States
• Fetch on render
• Fetch then render
• Suspense - Render as you fetch

2. GraphQL Clients

• Exercise Start
• Exercise Complete
• Apollo Client Docs
• Table JSX

3. @defer & @stream

• Slides
• @defer and @stream Docs
• Demo

4. Server Components Intro

• Slides
• RSC from Scratch
• Server Components with Next Documentation
• Patterns.dev Article
• Demystifying Server Components Tutorial

5. Next.js App Router

• Snowtooth UI - Project Start

npm install @supabase/auth-helpers-nextjs @supabase/supabase-js

At the root of the project -- .env.local

6. Data Fetching with Next.js

• Snowtooth UI - Project Complete
• Data Fetching Patterns
• Caching Docs

7. Server Components-ifying Libraries

• Rendering Third Party Context Providers
• Apollo Case Study