Awesome React

A collection of awesome things regarding the React ecosystem.

Create React AppAwesome ReactREACT

Awesome React

Awesome React

A collection of awesome things regarding the React ecosystem.

• React

  • React General Resources

  • React Community

  • React Online Playgrounds

  • React Tutorials

    • React General Tutorials

    • React Hooks

    • React and TypeScript

    • React Performance

    • React Internals

    • React Interview Questions

  • React Tools

    • React Development Tools

    • React Frameworks

    • React Styling

    • React Routing

    • React Component Libraries

    • React Awesome Components

    • React for Command Line

    • React Testing

    • React Libraries

    • React Integration

    • React State Management

    • React AR and VR

    • Forms

    • Autocomplete

    • Graphics

    • Data Managing

    • Maps

    • Charts

• React Native

  • React Native General Resources

  • React Native Community

  • React Native Tutorials

  • React Native Development Tools

  • React Native Sample Apps

  • React Native Boilerplates

  • React Native Awesome Components

• Redux

  • Redux General Resources

  • Redux Tools

  • Redux Tutorials

• MobX

  • MobX General Resources

  • MobX Tools

  • MobX Tutorials

• GraphQL

  • GraphQL Spec

  • GraphQL Tools

  • GraphQL Tutorials

  • GraphQL Implementations

  • Server Integration

  • Database Integration

• Relay

  • Relay General Resources

  • Relay Tutorials

  • Relay Tools

• Apollo

  • Apollo General Resources

• Videos

  • Important Talks

  • React.js Conf 2015 Playlist

  • ReactEurope Conf 2015 Day 1 Playlist

  • ReactEurope Conf 2015 Day 2 Playlist

  • ReactRally Conf 2015 Playlist

  • React.js Conf 2016 Playlist

  • ReactRally Conf 2016 Playlist

  • React.js Amsterdam 2018 Playlist

  • Video Tutorials

• Demo React Apps

• Real React Apps

• Contribution

React

JavaScript Library for building User Interfaces

React General Resources

• React Official Website

• React Documentation

• React GitHub

React Community

• Reactiflux Discord Channel

• React StackOverflow

• React Twitter

React Online Playgrounds

• CodePen

• CodeSandbox

• JSFiddle

React Tutorials

React General Tutorials

• React Official Tutorial

• Using React in Visual Studio Code

• Scrimba - Learn React for free interactively

• FreeCodeCamp React Challenges

• React Cheatsheet

• React Patterns

• Setup Flow with React

React Hooks

• React Hooks

• Replacing Redux with React Hooks and Context

• React Hooks cheat sheet: Unlock solutions to common problems

• How to fetch data with React Hooks?

• Easy to understand React Hook recipes

• Awesome React Hooks

• Build a React chat app with Hooks, a pragmatic example

React and TypeScript

• TypeScript, React and Webpack

• JSX in TypeScript

• Cheatsheets for experienced React developers getting started with TypeScript

React Performance

• React Optimizing Performance

• Introducing the React Profiler

• Optimizing React: Virtual DOM explained

• A Definitive Guide to Optimize Major Performance issues in React

• Twitter Lite and High Performance React Progressive Web Apps at Scale

• Using the React DevTools Profiler to Diagnose React App Performance Issues

• Top 5 Practices to Boost React Performance

• React is Slow, React is Fast: Optimizing react Apps in Practice

• Rendering large lists with react-window

React Internals

• Reconciliation

• React Fiber Architecture

• Build your own React

• Inside Fiber: In-depth overview of the new reconciliation algorithm in React

• Entire React code base explanation by visual block schemes

React Interview Questions

• 13 Essential React Interview Questions

• List of React interview Questions and Answers

React Tools

React Development Tools

• create-react-app - Set up a modern Web app by running one command

• react-starter-kit - Isomorphic Web app boilerplate

• react-devtools - Inspection of React component hierarchy in the Chrome and Firefox Developer Tools

• react-hot-loader - Tweak React components in real time

• react-loadable - A higher order component for loading components with promises

• loadable-components - React code splitting made easy

• reactotron - A desktop app for inspecting your React and React Native projects

• storybook - UI component dev & test

• react-styleguidist - Isolated React component development environment with a living style guide

• react-cosmos - Dev tool for creating reusable React components

• eslint-plugin-react - React specific linting rules for ESLint

• eslint-plugin-jsx-a11y - Static AST checker for a11y rules on JSX elements

• react-axe - Accessibility auditing for React applications

React Frameworks

• next.js - The React Framework

• gatsby.js - Free and open source framework based on React

React Styling

• styled-components - Visual primitives for the component age

• emotion - Library designed for writing CSS styles with JavaScript

• radium - A toolchain for React component styling

• jss - Authoring tool for CSS

React Routing

• react-router - Declarative routing for React

• navi - Declarative, asynchronous routing for React

• curi - JavaScript router for single-page applications

React Component Libraries

• material-ui - React components for faster and easier web development

• ant-design - A design system with values of Nature and Determinacy

• blueprint - A React-based UI toolkit for the webs

• office-ui-fabric-react - React components for building Microsoft web experiences

• react-bootstrap - Bootstrap components built with React

• reactstrap - Simple React Bootstrap 4 components

• semantic-ui-react - The official Semantic-UI-React integration

• react-fontawesome - Font Awesome 5 component library for React

• reakit - Accessible, Composable and Customizable components for React

• rsuite - A suite of React components

• atlaskit - Atlassian's official UI library, built according to the Atlassian Design Guidelines.

• baseweb - Base Web is a foundation for initiating, evolving, and unifying web products.

React Awesome Components

• Awesome React Components list

• react-select - The Select Component for React

• react-dnd - Drag and Drop for React

• react-grid-layout - A draggable and resizable grid layout with responsive breakpoints

• react-table - A lightweight, fast and extendable datagrid for React

• react-data-grid - Excel-like grid component built with React

• react-draggable - React draggable component

• react-resizable-and-movable - A resizable and draggable component for React

• react-resizable - A simple React component that is resizable with a handle

• react-resizable-box - A resizable component for React

• react-sortable-pane - A sortable and resizable pane component for React

• react-spaces - Nestable resizable, anchored, scrollable components

• react-dates - An easily internationalizable, mobile-friendly datepicker library for the web

• react-big-calendar - Calendar component

• react-datepicker - ReactJS Datepicker

• react-list - A versatile infinite scroll React component

• react-intl - Internationalize React apps

• react-i18next - Internationalization for React done right

• react-aria-modal - A fully accessible React modal

• react-hotkeys - Declarative hotkey and focus area management for React

• react-keydown - Lightweight keydown wrapper for React components

• react-joyride - Create guided tours for your apps

• react-virtualized - React components for efficiently rendering large lists and tabular data

• react-window - React components for efficiently rendering large lists and tabular data

• react-text-mask - Input mask for React

• react-loading-skeleton - Create skeleton screens that automatically adapt to your app

• react-spinkit - A collection of loading indicators animated with CSS for React

• rheostat - Accessible slider component built with React

• qrcode.react - QR component for use with React

• react-archer - Draw arrows between React elements

React for Command Line

• ink - React for interactive command-line apps

• react-blessed - A React renderer for blessed terminal interface library

React Testing

• jest - Delightful JavaScript Testing Framework

• enzyme - JavaScript Testing utilities for React

• react-testing-library - Simple and complete React DOM testing utilities

• react-hooks-testing-library - React hooks testing utilities that encourage good testing practices

• majestic - Zero config GUI for Jest

React Libraries

• react-border-wrapper - A wrapper for placing elements along div borders in React.

• react-magic - Automatically AJAXify plain HTML with the power of React

• react-toolbox - A set of React components implementing Google's Material Design specification

• tcomb-react - Library allowing you to check all the props of your React components

• react-responsive - Media queries in react for responsive design

• react-cursor - Functional state management abstraction for use with Facebook React

• Omniscient.js - Abstracting React components for fast top down render of immutable data

• Touchstonejs - React.js powered UI framework for developing beautiful hybrid mobile apps.

• Elemental - A UI Toolkit for React.js Websites and Apps

• StateTrooper - Centrally manage state for React applications with CSP

• Preact: Fast 3kb React alternative with the same ES6 API.

• riotjs - A React- like, 3.5KB user interface library

• Maple.js - Bringing the concept of web-components to React

• react-i13n - A performant, scalable and pluggable approach to instrumenting your React application

• react-icons - svg react icons of popular icon packs

• Keo - Plain functions for a more functional Deku approach to creating React components, with functional goodies such as pipe, memoize, etc...

• Bit - A virtual repository for managing and using react and other web components across applications

• AtlasKit - Atlassian's React UI library

• ReactiveSearch - UI components library for Elasticsearch

• Slate - A completely customizable framework for building rich text editors.

• react-json-schema - Construct React elements from JSON by mapping JSON definitions to React components that you expose.

• compose-state - Compose multiple setState or getDerivedStateFromProps updaters in React

• PrimeReact - The Most Complete UI Framework for React!

• react-lodash - Lodash as React components

• react-helmet - A document head manager for React

• Stator - Simple, plain JavaScript state management with built-in support for React

• ClearX - Fast & Effortless State management for React with zero learning curve. ClearX gives great flexibiility in separation of concerns for your React applicationss

• react-snap - Zero-configuration framework-agnostic static prerendering for SPAs

• Draft.js - A React framework for building text editors

• refract - Harness the power of reactive programming to supercharge your components

• react-desktop - OS X and Windows UI components built with React

• Reapop - A React & Redux notifications system

• react-extras - Useful components and utilities for working with React

• react-instantsearch - Lightning-fast search for React and React Native applications, by Algolia

• uppy - The next open source file uploader for web browsers

• react-motion - A spring that solves your animation problems

• react-esi - React Edge Side Includes

• hookstate - Modern, very fast and extendable state management for React that is based on hooks

React Integration

• ReasonReact

• React Rails

• ReactJS.NET

• om - ClojureScript interface

• Reagent - A minimalistic ClojureScript interface to React.js

• Express React views

• React Page Middleware

• ngReact - React Components in Angular

• coffee-react-transform - Provides React JSX support for Coffeescript

• sprockets-coffee-react - Sprockets preprocessor for CJSX

• react-kup - A simple, non-intrusive alternative to jsx for coffeescript

• turbo-react - Combine Turbolinks and React to apply DOM diffs

• react-bacon - A little module for using React with Bacon.js

• msx - React's JSX Transformer, tweaked to output calls to Mithril

• React.withBackbone - React 16 ready backbone binding

• Backbone React Component

• react-backbone - Backbone-aware mixins for react

• NestedReact - transparent integration with Backbone Views and NestedTypes models

• backbone-reaction - React, Backbone and then some

• react.backbone - Plugin for React to make Backbone migration easier

• reactbone - React extensions for Backbone

• backbone-react-ui - React components for use with backbone and backbone paginator

• react-events - Declarative managed event bindings for react components

• react-mixin-manager - React mixin registration manager

• gsap-react-plugin - A GSAP plugin for tweening React.js component state

• react-topcoat by @plaxdan - Topcoat CSS components built with the React library

• react-topcoat by @arnemart - A collection of React components for Topcoat

• reactdown - Write React components using markdown syntax

• react-jade - Compile Jade to React JavaScript

• jade-react - Compile Jade templates to React.DOM expressions

• gulp-jade-react - Compile Jade templates into React de-sugared JSX with Gulp

• sbt-reactjs - React SBT Plugin using npm

• scalajs-react - A guilty affair between Scala.js and Facebook's React

• react-xtags - Using React to implement xtags

• jreact - React on server-side Java (with Rhino or Nashorn)

• React.hiccup - A complete replacement for JSX written in sweet.js

• react-play - Rendering React components in the Play Framework with JDK8's Nashorn

• rx-react - Utilities to works with React in a RxJS

• react-with-di - A hacked prototype of React.js with DI

• reactfire - ReactJS mixin for easy Firebase integration

• firedux - Firebase + Redux for ReactJS

• react-clickdrag-mixin - ClickDrag mixin for React component

• Rewrite the Admin UI of KeystoneJS in React

• react-masonry-mixin - Standalone mixin for Masonry (@desandro)

• react-packery-mixin - Standalone mixin for Packery (Metafizzy)

• react-dropzone - Simple HTML5 drag-drop zone with React.js.

• aframe-react - A-Frame VR + React

• react-three - React bindings to create and control a 3D scene using three.js

• react-three-renderer - Render into a three.js canvas using React

• react-threejs - Simplest bindings between React & Three.js

• react-masonry-css - Fast Masonry layout powered by CSS, dependency free

• react-captcha - A react.js reCAPTCHA for Google

• reaptcha - Clean, modern and simple React wrapper for Google reCAPTCHA

• react-recaptcha-that-works - A reCAPTCHA bridge for React that works

React State Management

• redux

• mobx

• flux

React AR and VR

• React 360 - Create exciting 360 and VR experiences using React

• Viro React - Platform for rapidly building AR/VR applications using React Native

Forms

• React Forms

• react-formal - Better form validation and value management for React, Provides minimal wiring

• react-forms - Forms library for React

• valuelink - full-featured two-way data binding with extended React links

• wingspan-forms - A dynamic form library for Facebook React

• newforms - Isomorphic form-handling for React

• formjs - A form generator for Reactjs

• react-form-builder - A Form Builder for React.js

• plexus-form - A dynamic form component for react using JSON-Schema

• tcomb-form - UI library for developing forms writing less code

• formsy-react - A form input builder and validator for React JS

• Learn Raw React: Ridiculously Simple Forms

• Winterfell - Generate complex, validated and extendable JSON-based forms in React

• Redux-Autoform - Create Redux-Forms dynamically out of metadata

• uniforms - Bunch of React components and helpers to easily generate and validate forms

• formik - Forms in React, without tears

• NeoForm – Modular HOCs for form state management and validation

• react-jsonschema-form – A React component for building Web forms from JSON Schema

• List View Select - A Toggleable select box for React Native with native components

• Final Form 🏁

• formland - A simple, super-flexible, extensible config based form generator

• react-reactive-form - Angular like reactive forms in React

• unform - ReactJS form library to create uncontrolled form structures with nested fields, validations and much more!

• Formal - Elegant form management primitives for the react hooks era

Autocomplete

• react-autocomplete by @rackt - WAI-ARIA compliant React autocomplete

• react-autosuggest by @moroshko - WAI-ARIA compliant React autosuggest component

• react-autocomplete by @eliseumds- Just tasting some ReactJS + RxJS

• react-autocomplete by @prometheusresearch - Autocomplete widget based on React

• instatype by @gragland - Simple react autocomplete component

• downshift - 🏎 Primitives to build simple, flexible, WAI-ARIA compliant enhanced input React components

• React Bootstrap Typeahead - A React-based typeahead that relies on Bootstrap for styling and was originally inspired by Twitter's typeahead.js.

Graphics

• react-art - React Bridge to the ART Drawing Library

• react-canvas - High performance rendering for React components

• react-famous - Complex 3D animations UI at 60 FPS with Famo.us

• react-kinetic - HTML5 Canvas via KineticJS using React

• react-svg-morph - morph your svg components one into another

• react-hooks-svgdrawing - SVG Drawing with React hooks

• react-svg-pan-zoom - A React component that adds pan and zoom features to SVG.

Data Managing

• Immutable.js - Immutable Data Collections for Javascript

• cortex - A javascript library for centrally managing data with React

• avers - A modern client-side model abstraction library

• imvvm - Immutable Model-View-ViewModel for React

• morearty.js - Better state management for React in pure JavaScript

• valuable - An immutable data store for React

• react-resolver - Isomorphic library to recursively lazy-load data for React components

• freezer-js - Lightweight and reactive immutable data structure for React

• MobX - Simple, scalable state management

• baobab - JavaScript persistent and optionally immutable data tree with cursors

• baobab-react - React integration for Baobab

• immstruct - Immutable data structures with history for top-to-bottom properties in component based libraries like React

• seamless-immutable - Immutable data structures for JavaScript which are backwards-compatible with normal JS Arrays and Objects

• tydel - Typed Models and Collections, with React bindings

• extendable-immutable - Extend any Immutable.js data structure

• statty - A tiny and unobtrusive state management library for React and Preact apps

• Hydux - An Elm-Like state manager for React with "batteries included"

• ReSub - A library for writing better React components and data stores

• ProppyJS - A tiny library for functional props composition

• WatermelonDB - 🍉 Next-gen database for powerful React and React Native apps that scales to 10,000s of records and remains fast

• Effector — Fast and powerful reactive state manager. Lets you write simple, fast and type safe code and manage reactive state with ease.

• reactn - React, but with built-in global state management

• immer - Create the next immutable state by mutating the current one

Maps

• react-googlemaps - React interface to Google maps

• react-maps - A map component for React

• react-google-maps - React.js Google Maps integration component

• react-gmaps - A Google Maps component for React.js

• react-map-gl - A React wrapper for MapboxGL-js plus overlay API

• google-map-react - Isomorphic google map React component

• react-mapbox-gl - A mapbox-gl-js wrapper to make the API react friendly

• google-maps-react - A declarative Google Map React component using React, lazy-loading dependencies, current-location finder and a test-driven approach by the Fullstack React team.

• react-leaflet - React components for Leaflet maps

• react-geo - A set of geo-related components using react, antd, and ol

• pigeon-maps - ReactJS maps without external dependencies

Charts

• DevExtreme React Chart - High-performance plugin-based React chart for Bootstrap and Material Design

• react-chartjs - Common react charting components using chart.js

• react-stockcharts - Highly customizable stock charts with ReactJS and d3

• Number Picture - Low-level building blocks for constructing animated visualizations with React & D3.

• Victory - A collection of composable React components for building interactive data visualizations

• Recharts - A charting library built on D3 with an awesome declarative API

• React-ApexCharts - React component for ApexCharts (An Interactive SVG Chart Library)

• reaviz - React Data Visualization Library based on D3.js

• react-vis - A React visualization library designed with the following principles in mind: React-friendly, high-level and customizable, expressive, and industry-strong.

• nivo - It provides a rich set of data visualization components, built on top of the D3 and React libraries.

• vx - A collection of reusable low-level visualization components. It combines the power of D3 to generate your visualization with the benefits of React for updating the DOM.

• echarts-for-react - A very simple ECharts wrapper for React.

• Chartify - React plugin for building charts using CSS.

• Semiotic - A data visualization framework combining React and D3.

React Native

Framework for building native apps using React

React Native General Resources

• React Native Official Site

• React Native GitHub

• React Native Newsletter

• React Native Playground

• React Native Awesome List

• React Native StackOverflow

• React Native Radio

React Native Tutorials

• React Native Tutorial

• Introducing React Native: Building Apps with JavaScript

• Introduction to React Native: Building iOS Apps with JavaScript

• React Native Meets Async Functions

• Gesture detection in React Native – fixing unexpected panning

• Digital Smart Mirror lab with React Native

• The Beauty Of React Native: Building Your First iOS App With JavaScript (Part 1)

• The Beauty Of React Native: Building Your First iOS App With JavaScript (Part 2)

• A Mini-Course on React Native Flexbox

• A Complete Guide to Flexbox

• Test driving react native applications

• Using React Native With TypeScript

React Native Development Tools

• react-native-code-push - React Native module for CodePush

React Native Sample Apps

• HackerNews

• Ziliun

• FinanceReactNative

• SplashWalls

• NBAreact

React Native Boilerplates

• Create React Native App - Create a React Native app on any OS with no build config, with or without Expo

• Snowflake - React Native iOS & Android with Redux, Parse.com, Jest (88% coverage)

• Ignite - The hottest CLI for React Native, boilerplates, plugins, generators, and more!

• React Native Starter Kit - A powerful starter project that bootstraps development of your mobile application

React Native Awesome Components

• Expo - The Expo platform for making cross-platform mobile apps

• react-navigation - Routing and navigation for your React Native apps

• react-native-social-share - Use the iOS and Android native Twitter and Facebook share popup with React Native

• react-native-fbsdk - A wrapper around the iOS Facebook SDK

• react-native-side-menu - Simple customizable component to create side menu

• react-native-mapbox-gl - A Mapbox GL react native module

• react-native-icons - Quick and easy icons in React Native

• react-native-vector-icons - 3000 Customizable Icons for React Native with support for NavBar/TabBar

• react-native-google-signin - Google Signin for React Native

• react-native-picker-modal-view

Redux

Predictable State Container for JavaScript Apps

Redux General Resources

• Redux GitHub

• Redux Official Site

• Awesome Redux List

Redux Tools

• react-redux - Official React bindings for Redux

• redux-devtools - DevTools for Redux with hot reloading, action replay, and customizable UI

  • react-router-redux - Bindings to keep react-router and redux in sync

• redux-form - A Higher Order Component using react-redux to keep form state

• redux-thunk - Thunk middleware for redux

• redux-logger - Logger middleware for redux

• reselect - Selector library for Redux

• normalizr - Normalizes nested JSON according to a schema

• redux-saga - An alternative side effect model for Redux apps

• redux-data-fx - Declarative Side Effects for Redux

• redux-observable - RxJS middleware for Redux

• redux-analytics - Analytics middleware for Redux

• redux-undo - Higher order reducer to add undo/redo functionality to redux state containers

• redux-search - Redux bindings for client-side search

• redux-mock-store - A mock store for your testing your redux async action creators and middleware

• redux-immutable - Create an equivalent function of Redux combineReducers that works with Immutable.js state

• redux-react-i18n - An i18n solution for redux/react

• R16N - A redux/react I18n solution

• redux-actiontyper - Helper to create less verbose action types for Redux

• redux-state-validator - A simple redux middleware to validate redux state values and object types using JSON Schema

• redux-persist - Persist and rehydrate a redux store

Redux Tutorials

• Building Applications with React and Redux in ES6

• Getting Started with Redux

• Building React Applications with Idiomatic Redux

• Redux Tutorial

• Getting Started with React, Redux and Immutable: a Test-Driven Tutorial: Part 1

• Getting Started with React, Redux and Immutable: a Test-Driven Tutorial: Part 2

• Full-Stack Redux Tutorial

• Server-Side Rendering with Redux and React-Router

• Deep Introduction to Redux

• Unit Testing Redux Apps

• Secure Your React and Redux App with JWT Authentication

• Build an Image Gallery Using React, Redux and redux-saga

• A simplified approach to calling APIs with redux

• React Redux based blood donor demo application

• LearnCode.academy Redux Tutorials Series

• Practical Redux

• A Complete React Redux Tutorial for Beginners

MobX

Simple, scalable state management for JavaScript Apps

MobX General Resources

• MobX GitHub

• MobX Official Site

MobX Tools

• mobx-react - React component wrapper for combining React with MobX

MobX Tutorials

• Ten minute introduction to MobX and React

• Manage Complex State in React Apps with MobX

• Refactor your application from Redux to MobX

• Redux or MobX: An attempt to dissolve the Confusion

GraphQL

Query Language

GraphQL Spec

• GraphQL Official Site

• GraphQL Specification

• GraphQL Specification Repository

GraphQL Tools

• GraphCMS - The GraphQL Headless CMS

• GraphQL CMS

• Mongoose schema To GraphQL

• GraphQL bridge to REST API

• GraphQL Playground - GraphQL IDE for better development workflows

GraphQL Tutorials

• GraphQL Introduction

• First Thoughts on GraphQL

• Modeling Queries in a GraphQL Like Way

• Thin and Graphy

• GraphQL Overview - Getting Started with GraphQL and Node.js

• Writing a Basic API with GraphQL

• Building a GraphQL Server with Node.js and SQL

• GraphQL Tour: Variables

• How to Graphql - The Fullstack Tutorial for GraphQL

GraphQL Implementations

• graphql-js - A reference implementation of GraphQL for JavaScript

• react-transmit - Relay-inspired library based on JavaScript Promises

• graphql-ruby - Ruby implementation of Facebook's GraphQL

• graphql-java - GraphQL Java implementation

• sangria - Scala GraphQL client and server library

• graphql-php - A PHP port of GraphQL reference implementation

• graphene - GraphQL in Python made simple

• graphqllib - GraphQL implementation for Python

• graphql-dotnet - GraphQL for .NET

• graphql-go - GraphQL for Go/Golang

Server Integration

• express-graphql - Create a GraphQL HTTP server with Express

• graphql-yoga - Easiest way to run a GraphQL server

Database Integration

• Hasura - Instant Realtime GraphQL on Postgres

• Prisma - a performant open-source GraphQL ORM-like * layer doing the heavy lifting in your GraphQL server.

• graphql-bookshelf - Some help defining GraphQL schema around BookshelfJS models

• GraphpostgresQL - GraphQL for PostgreSQL

• graffiti - Node.js GraphQL ORM

• sql-to-graphql - Generate a GraphQL API based on your SQL database structure

• graphql-sequelize - GraphQL & Relay for MySQL & Postgres via Sequelize

Relay

Data-Driven React Applications

Relay General Resources

• Relay Offical Site

• Relay GitHub

Relay Tutorials

• official Relay Getting Started

• Relay for Visual Learners

• Getting Started with Relay

• Relay and Routing

Relay Tools

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

• react-router-relay - Relay integration for React Router

• relay-local-schema - Use Relay without a GraphQL server

• relay-codemod - Codemod scripts based for on jsodeshift to update Relay APIs

Apollo

Data stack based on GraphQL

Apollo General Resources

• Apollo Official Site

• Apollo GitHub

• Apollo Blog

• Apollo Slack

Apollo Tools

• react-apollo-redux - A small wrapper to automatically dispatch actions in response to apollo mutations

Videos

reactjsvideos.com

Important Talks

• Pete Hunt: React: Rethinking best practices - JSConf EU 2013

• Pete Hunt: React: Rethinking Best Practices (updated) - JSConf.Asia 2013

• Tom Occhino and Jordan Walke: JS Apps at Facebook - JSConfUS 2013

• React: CSS in JS

• Pete Hunt: Be Predictable, Not Correct - Mountain West JavaScript 2014

• Hacker Way: Rethinking Web App Development at Facebook

• Christopher Chedeau: Why does React Scale? - JSConf2014

• Christopher Chedeau: React's Architecture - OSCON 2014

• Pete Hunt: React RESTful UI Rendering - Strange Loop 2014

• Pete Hunt: How Instagram.com Works - OSCON 2014

• Bill Fisher and Jing Chen: React and Flux - NewCircle Training 2014

• Sebastian Markbage: Minimal API Surface Area - JSConf EU 2014

• Avik Chaudhuri: JavaScript Testing and Static Type Systems at Scale - Scale 2014

• React Native & Relay: Bringing Modern Web Techniques to Mobile - f8 2015)

• Citrusbyte Presents GraphQL: A Horizontal Platform with Nick Schrock

• Laney Kuenzel: Mutations and Subscriptions in Relay - JSConf 2015

• React Today and Tomorrow and 90% Cleaner React With Hooks - React Conf 2018

• React Conferences

• React Videos

• Awesome React Talks

React.js Conf 2015 Playlist

ReactEurope Conf 2015 Day 1 Playlist

ReactEurope Conf 2015 Day 2 Playlist

ReactRally Conf 2015 Playlist

React.js Conf 2016 Playlist

React Amsterdam 2016 Playlist

ReactEurope Conf 2016 Day 1 Playlist

ReactEurope Conf 2016 Day 2 Playlist

ReactRally Conf 2016 Playlist

React.js Amsterdam 2018 Playlist

Video Tutorials

• Trying React Hooks for the first time with Dan Abramov

Demo React Apps

• hackernews-react-graphql - Hacker News clone rewritten with universal JavaScript, using React and GraphQL

• react-reduction - Free Admin Template Built with React and Bootstrap4

• reactjs-tmdb-app - Responsive React The Movie Database App

• react-shopping-cart - Simple ecommerce cart application built with React Redux

• dnote - A simple personal knowledge base

Real React Apps

• kibana - Your window into the Elastic Stack

• firefox debugger - The Firefox debugger that works anywhere

• spectrum – Simple, powerful online communities

• mattermost - Open source Slack alternative

• overreacted - Personal blog by Dan Abramov

• winamp2-js - Winamp 2 reimplemented for the browser