Awesome Relay Overview

Awesome resources for Relay

🏠 Home · 🔥 Feed · 📮 Subscribe · ❤️ Sponsor · 😺 expede/awesome-relay · ⭐ 257 · 🏷️ Front-End Development

[ Daily / Weekly / Overview ]

Awesome Relay

Awesome resources for Relay (⭐17k), based on the Awesome (⭐223k) project

Table of Contents

• Learning Resources
  • Documentation
  • FAQs
  • Tutorials
  • Overviews
  • Example Implementations
  • Lists of Lists
• Ecosystem
  • Libraries & Packages
  • Tooling
  • Starter Kits
• Relay-Specific Server Support
  • Go
  • JavaScript
  • Python
  • Ruby
    • Rails
  • Scala
• Testing

Learning Resources

Documentation

• Official Docs - Official Relay documentation.

FAQs

• Unofficial Relay FAQ - Common questions answered! Relay resources are scarce at the moment, so this is very helpful if you get stuck.

Tutorials

• 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 (⭐14k).
• 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

• 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 (⭐14k).
• 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 - An overview of how Relay works, complete with illustrations.
  • Part 1: Saying what data you need with GraphQL
  • Part 2: Fetching data from the server
  • Part 3: Syncing changes back up to the server
  • Part 4: How it all fits together

Example Implementations

• Relay TODO MVC (⭐162) - The classic TODO example app, written with Relay.
• relay-chat - Relay with routing and pagination.
• koa-graphql-relay-example - "TODO" app with koa-graphql and relay.
• todomvc-relay-go - Relay TodoMVC app, driven by a Golang GraphQL backend.

Lists of Lists

• Relay and GraphQL Introduction Materials

Ecosystem

Libraries & Packages

• 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-router bindings for Relay. Greatly simplifies many local state UI uses cases.
  • Relay and Routing - A well-articulated walk through of react-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 - Server side rendering support for react-router-relay.
• 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 (⭐17k) 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

• GraphiQL (⭐14k) - A library to introspect GraphQL, test queries and mutations.
  • GraphiQL App (⭐2.9k) - 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

• Relay Skeleton (⭐125) - Relay project skeleton.
• Relay Starter Kit (⭐1k) - An app that it already set up with a basic setup. Just clone and tweak to suit your needs!
• Node.js API Starter Kit (⭐3.6k) - Boilerplate and tooling for building data APIs with Node.js, GraphQL and Relay
• Simple Relay Starter (⭐156) - A Browserify version of the Relay Starter Kit (⭐1k).
• UniversalRelayBoilerplate (⭐713) Boilerplate + examples for React Native (iOS, Android), React (isomorphic, Material-UI), Relay, GraphQL, JWT, Node.js, Apache Cassandra.
• Relay on Rails Starter Kit (⭐42) - A barebones starter kit for Relay application on Rails server. Just clone and tweak!
• Relay Fullstack (⭐993) - Relay Starter Kit integrated with Relay, Express, Webpack, Babel, Material Design Lite, and PostCSS.

Relay-Specific Server Support

Go

• Go Relay (⭐397) - 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

• graphql-relay-js - Simplifies creating a JS GraphQL server for react-relay.

Python

• graphql-relay-py - A library to help construct a graphql-py server supporting react-relay.

Ruby

• graphql-relay-ruby - Relay helpers for GraphQL & Ruby.

Rails

• 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 (⭐42) - A barebones starter kit for Relay application on Rails server. Just clone and tweak!

Scala

• sangria-relay - Relay support for Sangria.

Testing

• Writing Simple Unit Tests with Relay - An early first look at testing Relay.