Skip to main content

Relay Video Series

We've got a video series covering Relay, some GraphQL, ReScript and RescriptRelayRouter. It's growing and will eventually cover everything you need to get up and running using these techniques.

This series is intended to function as onboarding material for developers starting with Relay and ReScript.

Even if you're not using RescriptRelay (yet, right!) there's a good amount of Relay knowledge and tips and tricks in there, so check it out.

This page lists all videos and what they cover.

Introduction and project outline​

  • Setting up a new RescriptRelay project
  • Setting up your editor
  • Basic route configuration with RescriptRelayRouter
  • The Relay network layer

...and more.

Making lazy and preloaded Relay queries​

  • Making lazy queries
  • Using custom scalars with custom types
  • Autoconverting custom scalars to ReScript
  • Understanding network waterfalls and what you can do about them
  • Making preloaded queries
  • Render-as-you-fetch, preloading code and data in parallel

Reusable components with GraphQL fragments, and routing​

  • The Node interface and why I use it a lot
  • Using GraphQL fragments to create composable and reusable UI components
  • Creating new routes with RescriptRelayRouter
  • Type safe links with RescriptRelayRouter
  • Controlling how data and code is loaded for each link

Relay, partial rendering, and suspense​

  • The Node interface
  • When and why Relay suspends
  • How to control loading states and route transitions using suspense and the RescriptRelayRouter
  • Partial rendering of views with existing cached data
  • Using the Relay browser dev tools
  • Using the React browser dev tools to work with suspense

Pagination in Relay with connections​

  • Setting up pagination for a fragment in Relay
  • The @refetchable Relay directive and how Relay optimizes your pagination queries
  • The @argumentDefinitions Relay directive
  • The @connection Relay directive
  • The @connection Relay directive filters argument and how that works
  • Why connections are structured the way they are
  • How to paginate with Relay
  • Loading states when paginating