Session Spotlight

Greg Brimble

Camp Counselor

Taking Off: creating a full-stack React app on Cloudflare

Event Logo

Monday, July 29, 2024 - 2:00 PM UTC, for 4 hours.

Workshop (pre-conference)

Room: African 20

Cloudflare
Cloudflare Workers
Cloudflare Developer Platform
React
React Server Components

This 4 hour session will be a deep-dive into React and Cloudflare. It will assume some knowledge of TypeScript and client-side rendered React, but we'll gently introduce React Server Components and Server Actions during the workshop. We'll also take you from never having used Cloudflare before, to deploying a fully-featured full-stack application using several of the free, modern and scalable serverless products. If you want to jump-start your next project with React, and want to deploy to an inexpensive but incredibly versatile platform, all while learning about new technology and architectures, this workshop is for you.

Agenda

We'll spend a bit of time at the beginning familiarizing ourselves with the latest from React 19: Server Components, Server Actions, Document Metadata and optimistic updates. Next, we'll sketch out the features of the application that we want to build, and discover which Cloudflare Developer Platform products can help us. We'll then actually build the thing! This will be broken up into a few different sections to allow us to skip ahead in case anyone gets stuck on one thing in particular. And finally, we'll deploy it for free to Cloudflare's global network. If we have time, we may go back and add some optimistic updates to improve the user experience, as well as some instrumentation to help us, as developers, get a better understanding of how our application is performing.

Prerequisites

- TypeScript - JSX - React basics (client-side rendered) - Node.js

Take Aways

  • React Server Components and Server Actions
  • Cloudflare's Developer Platform
  • Serverless architectures

Supporting Resources

favorited by:
Josh Gretz Greg Brimble Natalie Wheeler Matthew Ives Robert Derman Carlos "El Guapo" Porras Rodriguez Nick Heidke John Montet Brett Christiansen Jacob Graf Chris Nowicki