React - Relay
Documentation
1_ENTRIES- Official Docs
Official Relay documentation.
FAQs
1_ENTRIES- Unofficial Relay FAQ
Common questions answered! Relay resources are scarce at the moment, so this is very helpful if you get stuck.
Tutorials
5_ENTRIES- Getting Started with Relay
One of the few detailed walk throughs of hand-on Relay.
- Relay 101: Building A Hacker News Client
A complete workable example.Relay 102: Mutations - A follow up to "Relay 101" concentrating on mutations.
- Facebook Relay talk - Lunch and Learn session
Walkthrough of building a simple app, and demonstration of GraphiQL.
- A Beginner's Guide to Relay Mutations
Mutations in depth.
- Learn Relay
Shows you how to make a Pokemon-themed CRUD app, providing a personal, cloud-based GraphQL backend so you can focus on the client-side code.
Overviews
9_ENTRIES- React Data Fetching with Relay
Clear conceptual overview of Relay's moving parts and magic.
- Joseph Savona - Relay: An Application Framework For React
Conceptual overview of Relay from the Facebook team.
- F8 2015 - React Native & Relay: Bringing Modern Web Techniques to Mobile
Overview of Relay, some about the philosophy.
- Relay - Daniel Dembach - Hamburg React.js Meetup
A good general overview of Relay, some discussion of alternatives. Common questions are covered in Q&A at the end.
- Facebook Relay talk - Lunch and Learn session
Walkthrough of building a simple app, and demonstration of GraphiQL.
- React with Relay and GraphQL with Andrew Smith
High level overview of Relay and GraphQL, with some useful discussion from the audience. Some discussion of other front-end frameworks, as well.
- Relay for Visual Learners
Very clear set of diagrams laying out how the different parts of Relay relate to each other.
- Relay: Seamless Syncing For React
An overview of what Relay is, and some discussion of experience using it in production.
- Cartoon Intro to Facebook's Relay - A...
Cartoon Intro to Facebook's Relay - An overview of how Relay works, complete with illustrations.Part 1: Saying what data you need with GraphQLPart 2: Fetching data from the serverPart 3: Syncing changes back up to the server[Part 4: How it all β¦
Example Implementations
4_ENTRIES- Relay TODO MVC
The classic TODO example app, written with Relay.
- `relay-chat`
Relay with routing and pagination.
- `koa-graphql-relay-example`
"TODO" app with
koa-graphqlandrelay. - `todomvc-relay-go`
Relay TodoMVC app, driven by a Golang GraphQL backend.
Lists of Lists
1_ENTRIESLibraries & Packages
13_ENTRIES- `graphql-relay-js`
Simplifies creating a JS GraphQL server for
react-relay. - Babel Relay Plugin
Use Relay the latest ES6+ syntax.
- `react-router-relay`
react-routerbindings for Relay. Greatly simplifies many local state UI uses cases.Relay and Routing - A well-articulated walk through ofreact-router-relay, and the problems that it solves.relay-nested-routes- Generate nested routes that reflect nested data. Helpful for managing deep data.[isomorphic-relay-router](https://github.com/denvned/isomorphic-relay-route⦠- `relay-decorator`
Simply syntax for Relay containers with ES7 decorators (
@syntax) - `recompose-relay`
Ease composition of Relay containers by currying and providing the component after the container.
- `relay-local-schema`
Use a local schema; no need for a remote GraphQL server.
- `react-native-relay`
Use Relay with React Native.May be supported out of the box in the future.
- `relay-sink`
Use Relay to fetch and store data outside of a React component.
- `babel-plugin-flow-relay-query`
Convert Flow types into Relay fragments.
- `sequelize-relay`
Make Relay compatible with
sequelize. - `relay-mongodb-connection`
Create Relay connections from MongoDB cursors.
- `relay-composite-network-layer`
Compose your Relay Network Layer of many different Network Layers each with their own schema.
- `react-relay-network-layer`
A Network Layer that adds support for query-batching and middlewares. It additionally provides some useful middlewares such as for auth, for logging, etc.
Tooling
3_ENTRIES- GraphiQL
A library to introspect GraphQL, test queries and mutations.GraphiQL App - A standalone app for viewing GraphQL, introspection docs, and testing queries/mutations. Invaluable for debugging your Relay app.
- `relay-local-schema`
Use a local schema; no need for a remote GraphQL server.
- Babel Relay Plugin
Use Relay the latest ES6+ syntax.
Starter Kits
7_ENTRIES- Relay Skeleton
Relay project skeleton.
- Relay Starter Kit
An app that it already set up with a basic setup. Just clone and tweak to suit your needs!
- Node.js API Starter Kit
Boilerplate and tooling for building data APIs with Node.js, GraphQL and Relay
- Simple Relay Starter
A Browserify version of the Relay Starter Kit.
- UniversalRelayBoilerplate
Boilerplate + examples for React Native (iOS, Android), React (isomorphic, Material-UI), Relay, GraphQL, JWT, Node.js, Apache Cassandra.
- Relay on Rails Starter Kit
A barebones starter kit for Relay application on Rails server. Just clone and tweak!
- Relay Fullstack
Relay Starter Kit integrated with Relay, Express, Webpack, Babel, Material Design Lite, and PostCSS.
Go
2_ENTRIES- Go Relay
A Go/Golang library to help construct a graphql-go server supporting react-relay.
- `todomvc-relay-go`
React/Relay TodoMVC app, driven by a Golang GraphQL backend.
JavaScript
1_ENTRIES- `graphql-relay-js`
Simplifies creating a JS GraphQL server for
react-relay.
Python
1_ENTRIES- `graphql-relay-py`
A library to help construct a
graphql-pyserver supportingreact-relay.
Ruby
1_ENTRIES- `graphql-relay-ruby`
Relay helpers for GraphQL & Ruby.
Rails
3_ENTRIES- GraphQL and Relay on RailsβββFirst relay powered react component
Full walk through of a simple Relay setup, including clonable code.
- Relay/GraphQL On Rails
A brief example of Relay with Rails, complete with several diagrams to aid in comprehension.
- Relay on Rails Starter Kit
A barebones starter kit for Relay application on Rails server. Just clone and tweak!
Scala
2_ENTRIES- `sangria-relay`
Relay support for Sangria.
- Writing Simple Unit Tests with Relay
An early first look at testing Relay.