Awesome React

A collection of awesome things regarding React ecosystem.

• React
  • React General Resources
  • React Community
  • React Online Playground
  • React Tutorials
    • React General Tutorials
    • React styling
    • React Charts Tutorials
    • React and Meteor
    • React and Angular
    • React and Bootstrap
    • React and ClojureScript
    • React and CoffeeScript
    • React and Datatables
    • React and Haskell
    • React and SocketIO
    • Server-Client with React
    • Server Side Rendering
    • Compiling React Tutorials
    • Debugging React
    • Authentication
    • File Uploads
  • React Tools
    • Boilerplates
    • Routing
    • React Projects
    • Components
    • Libraries
    • Integration
    • Forms
    • Autocomplete
    • Documentation Tools
    • Graphics
    • Model Libraries
    • Data Managing
    • React Developer Experience
    • Template Engines
    • Maps
    • Charts
• React Native
  • React Native General Resources
  • React Native Community
  • React Native Tutorials
  • React Native Developer Experience
  • React Native Sample Apps
  • React Native Boilerplates
  • React Native Awesome Components
• JSX
  • JSX Resources
• Flux
  • Flux General Resources
  • Flux Implementations
  • Flux Tutorials
• Redux
  • Redux General Resources
  • Redux Tools
  • Redux Tutorials
• MobX
  • MobX General Resources
  • MobX Tools
  • MobX Tutorials
• Testing
  • Testing Utilities
  • Testing Tutorials
• GraphQL
  • GraphQL Spec
  • GraphQL Tools
  • GraphQL Tutorials
  • GraphQL Implementations
  • Server Integration
  • Database Integration
• Relay
  • Relay General Resources
  • Relay Tutorials
  • Relay Tools
• Apollo
  • Apolo General Resources
• Flow
  • Flow Resources
• Videos
  • Video from Confs
  • 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
  • Video Tutorials
• Books
• Demos
• Example Apps
• Real Apps
• Contribution

---

React

JavaScript Library for building User Interfaces

React General Resources

• React Official Site
• React GitHub
• React Community GitHub

React Community

• Reactiflux
• React Discussion Forum
• React StackOverflow
• React Twitter
• React Core meeting notes

React Online Playground

• React JSFiddle Integration with JSX
• React JSFiddle Integration without JSX
• Babel REPL
• React HTML to JSX Online Compiler
• React browser prototyping for components

React Tutorials

React General Tutorials

• React Tutorial
• React.js Fundamentals
• React Primer
• ReactJS: Keep Simple. Everything can be a component!
• React.js Koans: Practical exercises that will help you learn React.js from square one
• React.js Introduction For People Who Know Just Enough jQuery To Get By
• LearnCode React Tutorials
• Thinkster React topics
• React tutorial - Cloning Yelp
• Learn React by building the Hacker News front page
• React.js in patterns

React styling

• React: CSS in JS
• React: CSS in JS techniques comparison
• Radium
• jsxstyle
• ReactCSS
• Aphrodite
• Glamor
• Styletron
• TypeStyle
• styled-components

React Charts Tutorials

• Integrating D3.js visualizations in a React app
• D3 and React - the future of charting components?

React and Meteor

• Meteor official Guide
• Meteor with React Tutorial
• React for Meteor developers

React and Angular

• NgReact - React Components in Angular
• ng-React Update - React 0.9 and Angular Track By
• Using React for Faster Renders and Isomosphism in Angular
• Faster AngularJS Rendering
• Improving AngularJS long list rendering performance using ReactJS
• How can React and Flux help us create better Angular applications?
• Achieving Reasonable and Scalable Routing in AngularJS with Flux

React and Bootstrap

• Better Bootstrap modals and popover with React.js
• A mixin-based design for a React.js Bootstrap component library
• Popover mixin
• Bootstrap TabbedArea component with React.js
• Bootstrap forms using React.js

React and ClojureScript

• The Future of JavaScript MVC Frameworks
• The Case for React.js and ClojureScript
• A Reagent Framework For Writing SPAs

React and CoffeeScript

• React & CoffeeScript
• React patterns - Mostly reasonable patterns for writing React in CoffeeScript

React and Datatables

• React and Datatables

React and Haskell

• Animating Web UI with React and Haskell
• stackage-view, built with Yesod and GHCJS+React
• TodoMVC example with Shade (Haste+React)
• react-haskell, to be used with Haste (blog post)
• blaze-react, blaze-html style React bindings using GHCJS (video tutorial)
• purescript-react bindings (example app)

React and Socket.IO

• Socket.IO integration example
• Socket.IO integration example inside of a single React component
• Socket.IO integration employing separation of concerns

Server-Client with React

• Server/Client With React, Part 1: Getting Started
• Server/Client With React, Part 2: The Build System
• Server/Client With React, Part 3: Frontend Server

Server Side rendering

• Super-basic example of how server rendering works
• Server Side Rendering for ReactJS
• React Server Rendering
• JDK8 + Facebook React: Rendering single page apps on the server
• Server-side React with PHP – part 1
• Server-side React with PHP – part 2
• Server-rendered React components in Rails
• Server-rendered React + Flux in Rails
• Golang Isomorphic Hot Reloadable/React/Flummox/Css-Module Starter Kit
• Serverside rendering with React + Hapi
• Isomorphic React apps in PHP via dnode

Compiling React Tutorials

• Webpack Howto by Pete Hunt
• React Webpack Cookbook
• AMD and CommonJS examples with Webpack
• Integrating JSX live reload into your React workflow
• React JS and a browserify workflow, part1
• React JS and a browserify workflow, part2
• Choosing the correct packaging tool for React JS

Debugging React

• Trace Logging with React
• Reactotron: Control, monitor, and instrument

Authentication

• Adding authentication to your React Flux app
• Build a React Application with User Authentication

File Uploads

• Direct uploads to S3 with React, Rails, and Paperclip

API Integration

• react-flux-cosmicjs Data-driven react application connected to the Cosmic JS API

React Tools

Boilerplates

• Create React App
• React App SDK - CLI tools and templates for authoring React apps with a single dev dependency and zero configurations
• React Starter Kit — isomorphic web app boilerplate (Node.js, GraphQL, React, Babel, Webpack, CSS Modules, HMR)
• ASP.NET Core Starter Kit (C#) — Frontend: React, Babel, PostCSS, CSS Modules + backend: .NET Core, C#
• ASP.NET Core Starter Kit (F#) — Frontend: React, Babel, PostCSS, CSS Modules + backend: .NET Core, F#
• React Redux Universal Hot Example
• React Slingshot - React + Redux with Babel, hot reloading, testing, linting and working example app
• este - Robust and comfortable dev stack for mobile/offline/frontend first isomorphic web apps
• frontend-boilerplate - webpack-react-redux-babel-autoprefixer-hmr-postcss-css-modules-rucksack-boilerplate
• react-engine - A composite render engine for isomorphic express apps
• react-webpack-node - Boilerplate for an universal/isomorphic React + Redux/alt Flux
• react-native-nw-react-calculator - Mobile, desktop and website Apps with the same code
• StarHackIt - An ES6/ES7 full-stack starter kit with authentication and authorization code
• react-cordova-boilerplate - TodoMVC example for React to build a Cordova application
• UniversalRelayBoilerplate - Boilerplate + examples for React Native (iOS, Android), React (isomorphic, Material-UI), Relay, GraphQL, JWT, Node.js, Apache Cassandra
• react-boilerplate - A highly scalable, offline-first foundation with the best developer experience and a focus on performance and best practices.
• Next.js - A minimalistic framework for server-rendered React applications

Routing

• react-router - A complete routing library for React

React Projects

• gatsby - Transform plain text into dynamic blogs and websites using React.js
• react-blessed - A react renderer for blessed terminal interface library
• MJML - The only framework that makes responsive-email easy. Based on React

Components

• React Component List

• JS.coach - A catalog of React components

• iReact: Fantastic React Components and Libraries!

• Khan Academy React Components

• VistarMedia Components

• React Topcoat UI components

• react-material - Material design components written with React.js and React Style

• material-ui - A CSS Framework and a Set of React Components for Material Design

• react-google-login-component

• react-facebook-login-component

• react-component - A Collection of React UI Components

• Ant Design - An enterprise-class UI design language and React-based implementation

• UXCore - A React UI Component Set living for enterprise backend application

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

• react-aim - Determine the cursor aim for triggering mouse events

• react-touch - React photo viewer for mobile

• griddle - A simple grid component for use with React

• react-grid - Data grid for React

• React-iCheck - iCheck components built with React. Highly customizable checkboxes and radio buttons

• react-absolute-grid - An absolutely positioned, animated, filterable, sortable, drag and droppable, ES6 grid for React

• react-async - Async rendering for React components

• react-async-input - Inputs that behave properly with async set{State,Props} calls

• react-countup - A React component wrapper around CountUp.js

• react-mediaswitch - Choose your DOM based on media queries

• react-frame-component - Render your React app to an iFrame

• react-gravatar - React component for rendering a gravatar profile image

• markdown-react - React Render for Standard Markdown

• react-component-gallery — React component for creating an evenly spaced components

• react-markdown-textarea - Component to create textareas for entering Markdown

• react-markdown-area - Github flavored markdown editor with live preview

• react-textarea-autosize - Textarea component for React which grows with content

• react-spinner - Zero configuration loading spinner

• react-treeview - Easy, light, flexible tree view made with React

• react-tree-menu - A stateless tree menu component built with the Flux architecture in mind

• react-tween-state - React animation tween state

• react-stripe-checkout - Easily load Stripe Checkout as a React component

• react-swipe - Brad Birdsall's swipe.js, as a React component

• react-smart-time-ago - Show relative "time ago" dates

• react-autoupdate-time - Renders a element that autoupdates

• react-time - Component for React to render relative and/or formatted dates into

• react-crouton - A message component for reactjs

• react-ago-component - Renders the approximate time ago in words from a specific past date

• react-translate-component - Provides multi-lingual/localized text content

• react-lorem-component - Renders lorem ipsum placeholder text

• react-interpolate-component - Renders elements into a format string

• react-proxy-loader - Hot Module Replacement and Code Splitting

• RCSS - Turn your JavaScript objects into CSS classes

• ReactiveElements - Allows to use React.js component as HTML element

• react-chosen - React wrapper for Chosen jQuery

• react-inlinesvg - An SVG loader component for React

• react-imageloader - A React component for wrangling image loading

• expose - A React mixin for lazy loading

• react-loadqueueloader - A React component for managing loads with a load queue

• react-loadermixin - A React mixin for giving components loading behavior

• react-pressable - Add onRelease, onReleaseInside, onReleaseOutside, and onPress events

• react-google-analytics - Google analytics component

• react-layers - A library for layering components in React

• react-gcal-events-list - A Reusable component that pulls events from your google calendar

• reactdi - Dependency injection for ReactJS components

• qrcode.react - A component for use with React

• react-swf - Shockwave Flash Player component for React

• react-unmount-listener-mixin - React mixin for listenable componentWillUnmount

• react-sortable - A sortable list component built \w React

• react-anything-sortable - A sortable component with IE8 compatibility

• react-controllables - Easily create controllable components

• react-datalist - A polyfill for Reactjs

• react-pad - Authoring tool for React components

• ogre.js - Object graph manager, built with ReactJS in mind

• react-scroll-components - A set of components that react to page scrolling

• react-fullscreen-component - Create fullscreen toggles

• react-frozenhead - Make your whole page a React component and render it on the server

• react-document-title - declarative, nested, stateful document.title

• react-tags - A simple wrapper around React.DOM

• react-datepicker by @misino - Datepicker component for application using Facebook React

• react-datepicker by @Hacker0x01 - A simple and reusable datepicker component for React

• react-table-sorter-demo - A React.js Table Sorter Component

• react-table-component - React Table Component for creating a very basic html table

• react-input-placeholder - Input is a small wrapper around React.DOM.input

• react-infinite-scroll - An infinite scroll component for React

• react-ellipsis - Ellipsis component for React

• react-pillbox - Pillbox component for React

• react-intl - React Internationalization Component

• react-tokeninput - Tokeninput component for React

• react-select-box - An accessible select box component for React

• react-ladda - React wrapper for Ladda buttons

• react-list - A versatile infinite scroll React component

• olay-react - Olay implemented as a React component

• reactable - Fast, flexible, and simple data tables in React

• react-tabs - React tabs component

• react-simpletabs - Just a simple tabs component

• react-draggable - React draggable component

• react-resizable - A tiny Resizable component based on react-draggable

• react-grid-layout - A Masonry-style responsive grid layout

• react-dnd - Flexible HTML5 drag-and-drop mixin for React with full DOM control

• react-sticky - component for React-based apps

• js-object-to-table - JavaScript objects drawing themselves into a table using React

• react-kaomoji - A React component for displaying Japanese emoticons

• react-calendar - Calendar that inspired by React philosophy

• react-element-pan - React component for allowing panning of DOM-elements

• react-anchor - Functional factory to create react anchor components

• react-bootstrap-daterangepicker - A date/time picker for react (using Bootstrap)

• react-bootstrap-datetimepicker - A react.js datetime picker for Bootstrap

• react-bootstrap-multiselect - A multiselect component for react (with bootstrap)

• react-colorpicker - Colorpicker for React

• react-commits-graph - A React component to render an svg graph of git commits

• react-layout - Dynamic subview layout for React

• react-weather - Example React weather app using forecast.io's API

• react-sparkline - React component for rendering simple sparklines

• react-component-width-mixin - React mixin which sets width

• react-micro-bar-chart - React component for micro bar-charts rendered with D3

• react-horizontal-bar-chart - Simple horizontal bar chart component, using D3 scales only

• react-infinity - A UITableView Inspired list and grid display

• react-timeago - A simple time-ago component for React

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

• react.animate - State animation plugin for react.js

• react-animate - React animation mixin

• react-star-rating-input - React.js component for entering 0-5 stars

• react-star-rating - A simple star rating component built with React.

• react-data-components - React components and mixins for manipulating data

• react-number-editor - Number editor (textfield) component for react

• react-localstorage - Simple localstorage mixin for react

• react-sortable-data React Mixin to sort data easily

• react-widgets - Suite of ui input widgets including combobox, multiselect, datepicker and more

• react-select - Rich Select Component

• react-video - React component to load video from Vimeo or Youtube

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

• react-cassette-player - Vector-based HTML5 Audio Player

• react-tagsinput - A simple react component for inputing tags.

• react-autolink - An autolink mixin for React

• react-emoji - An emoji mixin for React

• react-portal - A transportation of (not just) modals and lightboxes to document.body

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

• react-data-grid - Data grid for React:Excel-like grid component built with React, with editors, keyboard navigation, copy & paste

• react-datagrid - A carefully crafted DataGrid for React

• react-panels - A multipurpose tabbed panel with many features

• autoresponsive-react - A Magical Layout Libary For React

• Belle - Set of easy to style React Components with great UX

• react-input-color - React input color component with hsv color picker

• react-medium-editor - React wrapper for medium-editor

• react-progress-label - Progress label component

• react-input-slider - React input slider component

• react-range-slider - Collection of react slider components

• react-ui-tree - React tree component with drag and drop support

• react-frame - React components within an iframe for isolated css styling

• rodal - A React modal with animations

• react-scrollbar - Simple ScrollArea component built for React

• react-experiments - Implement A/B tests with randomized parameterizations of your components

• react-slide-deck - For swipe, tabs, carousel, one page scroll. With animation hooks. tweening, tween callbacks

• react-resizable-box - Resizable component for React

• react-ios-switch - React switch component

• react-listview-sticky-header - Turn listview with section headers that stick to the top

• react-expandable-listview - Create listview with expandable section headers

• react-keydown - Lightweight keydown wrapper for React components

• searchkit - Components to build user interfaces for elasticsearch

• grommet - The most advanced UX framework for enterprise applications

• react-resizable-and-movable - Resizable and movable component for React

• react-sidebar - An app like sidebar for React including touch support

• react-motion - An spring-based animation library, similar to Rebound.js

• react-motion-menu - Motion menu component powered by React Motion

• sweetalert-react - Using sweetalert in React

• React Joyride - Create walkthroughs, tours and tooltips for your apps

• react-file-reader-input - Complete control over styling + abstraction from file reading

• react-sortable-pane - Resizable and sortable pane component for React

• react-DnR - Dragable and Resizable window build with React.js

• react-http-request - React component exposes network request functionality

• react-https-redirect - Force a redirect to HTTPS when not on a local web server

• react-browser-detection - React component to detect browser

• react-text-mask - React input mask

• rebass - Configurable React Stateless Functional UI Components

• echarts-for-react - baidu Echarts(v3.0) components for React

• react-pagespeed-score - A React component for display a dial-type chart of PageSpeed Insights

• react-livestamp - A simple and html date countdown component for React

• react-offcanvas - Off-canvas menus for React

• react-svg-pan-zoom - Adds pan and zoom features to the SVG images

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

Containers

• Reapop - A React & Redux notifications system

Libraries

• 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...
• Blueprint - A React-based UI toolkit for the web

Integration

• ReactJS.NET
• React ASP.NET Boilerplate
• React Bootstrap
• React Bootstrap Components Playground
• React Rails
• React on Rails
• om - ClojureScript interface
• quiescent - A lightweight ClojureScript abstraction over React
• Reagent - A minimalistic ClojureScript interface to React.js
• react-haskell - React bindings for Haskell
• Express React views
• Express Coffee-React views - render coffee-react on the server
• React Page Middleware
• ngReact - React Components in Angular
• React Python
• React PHP
• React Laravel
• React Meteor
• Coffee React
• react-coffee - Build React components using natural CoffeeScript syntax
• 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
• 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
• react-semantic-ui - React components for Semantic UI
• semantic-react - React wrappers for Semantic UI
• sbt-reactjs - React SBT Plugin using npm
• scalajs-react - A guilty affair between Scala.js and Facebook's React
• rpm-xtags-rivets-finch-react - RPM project: x-tags, rivets.js, finch.js, and 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 - Utilitiels to works with React in a RxJS
• react-typescript - Wrapper to make react play nicely with typescript
• 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

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

Autocomplete

• react-typeahead-search by @tonyspiro
• 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

Documentation Tools

• react-docgen - Extract information from React component files for documentation generation
• react-styleguide-generator - Easily generate a good-looking styleguide

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

Model Libraries

• mori - ClojureScript's persistent data structures and supporting API
• NestedTypes - fast mutable models with "pure render" support
• swarm - JavaScript replicated model (M of MVC) library
• caplet - JavaScript models library

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
• datascript - Immutable database and Datalog query engine in ClojureScript
• 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

React Development Experience

• react-devtools - React Chrome Developer Tools
• react-transform-hmr - A React Transform that enables hot reloading React
• Nuclide - An open IDE for web and native mobile development, built on top of Atom
• babel-sublime - Syntax definitions for ES6 JavaScript with React JSX extensions
• babel-sublime-snippets - Next generation JavaScript and React snippets for Sublime
• atom-react - Atom React.js support
• vim-jsx - Vim JSX Syntax
• vim-react-snippets - Vim version of the snippets from sublime-react
• vim-babel - Wrapper around babel.js for vim
• web-mode.el - An autonomous emacs major-mode for editing web templates
• eslint-plugin-react - React specific linting rules for ESLint
• generator-react-webpack - Yeoman generator for ReactJS and Webpack
• generator-react-gulp-browserify - Yeoman generator for React
• generator-reactapp - Yeoman generator for react app with redux, webpack, gulp and restful.js etc.
• static-site-generator-webpack-plugin - Prerender isomorphic JavaScript apps to static HTML
• React Storybook - UI Component Dev Environment for React
• generator-sui-react - A yeoman generator for Schibsted User Interface (SUI) ReactJS components
• Racket - A yeoman generator for creating a universal react/redux web application

Template Engines

• react-templates - Lightweight templates for React
• teact - A JSX alternative based on composing functions in the Markaby / CoffeeKup / Teacup tradition

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

Charts

• react-d3 - Modular React charts made with d3.js
• react-chartjs - Common react charting components using chart.js
• react-stockcharts - Highly customizable stock charts with ReactJS and d3
• VictoryJS - A collection of composable React components for building interactive data visualizations
• Recharts - A charting library built on D3 with an awesome declarative API

---

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
• Building the F8 2016 App
• 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
• Use The iOS Camera In Your React Native Mobile App
• 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

React Native Development Experience

• react-native-webpack-server - Build React Native apps with Webpack
• react-native-code-push - React Native plugin for the CodePush service
• Preview your React Native apps in your Github Pull Request

React Native Sample Apps

• HackerNews
• Ziliun
• FinanceReactNative
• SplashWalls
• NBAreact

React Native Boilerplates

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

React Native Awesome Components

• 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

---

JSX

XML-Like Syntax Extension to JavaScript

JSX Resources

• JSX Spec
• JSX in Depth
• JSX in TypeScript

---

Flux

Application Architecture for Building User Interfaces

Flux General Resources

• Flux Official Site
• Flux GitHub

Flux Implementations

• Flux Comparision
• RefluxJS
• Fluxxor
• Marty
• McFly
• Alt
• Fluxible
• NuclearJS
• Flummox

Flux Tutorials

• Flux Application Architecture
• Flux: A simple architecture model to build Client-side apps
• Isomorphic Flux examples using Dispatchr and Fetchr from Yahoo
• Async requests with React.js and Flux
• Implementing Flux in CoffeeScript
• React: Flux Architecture
• Understanding Flux
• Yo in Flux
• React.js architecture - Flux VS Reflux
• Avoiding Event Chains in Single Page Applications
• ReactJS and Flux
• Deconstructing ReactJS's Flux
• Flux Step By Step
• Flux in practice
• What is the Flux Application Architecture?
• React + Flux Backed by Rails API: Part 1
• React + Flux Backed by Rails API: Part 2
• React + Flux Backed by Rails API: Part 3
• Flux solutions compared by example
• Flux Cargo-Culting
• The Case for Flux
• The Evolution of Flux Frameworks
• React with Flux by example - a simple Todo List dissected
• FOR FLUX SAKE! - a beginners tutorial
• Simple Counter App with React and Nuclear JS
• LearnCode.academy Flux Tutorial Series

---

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-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

Redux Tutorials

• Getting Started with Redux
• Building React Applications with Idiomatic Redux
• Redux Tutorial
• Redux with React introduction for beginners
• 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
• 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] (https://github.com/smanne/reduxnor)
• LearnCode.academy Redux Tutorials Series

---

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 from Redux to MobX in real world SoundCloud Client in React

---

Testing

React Testing

Testing Utilities

• Jest - Painless JavaScript Unit Testing
• enzyme - JavaScript Testing utilities for React

Testing Tutorials

• Approaches to testing React components - an overview
• Unit testing React components without a DOM
• The missing piece to the React testing puzzle

---

GraphQL

Query Language

GraphQL Spec

• GraphQL Official Site
• GraphQL Specification
• GraphQL Specification Repository

GraphQL Tools

• GraphQL CMS
• Mongoose schema To GraphQL

GraphQL Tutorials

• GraphQL Introduction
• First Thoughts on GraphQL
• Learn GraphQL
• Modeling Queries in a GraphQL Like Way
• Thin and Graphy
• GraphQL and g2sd
• 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

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

Database Integration

• 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

• Relay Tutorial
• 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

---

Flow

Static Type Checker for JavaScript

Flow Resources

• Flow Official Site
• Flow GitHub

---

Videos

Video from Confs

• 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
• Pete Hunt: High performance functional programming with React and Meteor -- Devshop 11
• Stoyan Stefanov: Introduction to React - LAWebSpeed meetup
• Pete Hunt: Be Predictable, Not Correct - Mountain West JavaScript 2014
• Pete Hunt: The Secrets of React's Virtual DOM - FutureJS 2014
• Hacker Way: Rethinking Web App Development at Facebook
• Christopher Chedeau: Why does React Scale? - JSConf2014
• Christopher Chedeau: React's Architecture - OSCON 2014
• Christian Johansen: Functional UI Programming - flatMap 2014
• Pete Hunt: React RESTful UI Rendering - Strange Loop 2014
• Stefano Masini: Refactoring to React - Amsterdam Javascript MVC meetup 10 sep 2014
• Pete Hunt: How Instagram.com Works - OSCON 2014
• Bill Fisher and Jing Chen: React and Flux - NewCircle Training 2014
• Vagmi Mudumbai: Building single page apps with React.JS - JSFoo 2014
• Ben Anderson: Reactive, Component-based UIs with React - E4E Developer Conf 2014
• Sebastian Markbage: Minimal API Surface Area - JSConf EU 2014
• Pete Hunt, Aaron Murray, and Contra Schof: Facebook React at the Famo.us Meetup 8/13/14
• Steven Luscher: Decomplexifying Code with React - Powered by JavaScript conf 2014
• James Pearce: An Introduction to ReactJS - All Things Open 2014
• Avik Chaudhuri: JavaScript Testing and Static Type Systems at Scale - Scale 2014
• Jonathan Beebe: Real World React - Nodevember 2014
• Pete Hunt: Secrets of the Virtual DOM - JSConf.au 2014
• Dave Smith: Angular + React = Speed - ng-conf 2015
• Ilya Boyandin: Interactive Data Visualization with React: Taming the Complexity of Changing State - OpenVis 2015
• React Native & Relay: Bringing Modern Web Techniques to Mobile - f8 2015)
• Flux: A Unidirectional Data Flow Architecture for React Apps - ACM Applicative 2015
• Michael Chan: React.js on Rails
• What's new in React Native
• Building and Deploying Relay with Facebook
• Supercharge your React.js Development with Taylor Hakes
• Citrusbyte Presents GraphQL: A Horizontal Platform with Nick Schrock
• Laney Kuenzel: Mutations and Subscriptions in Relay - JSConf 2015
• Pete Hunt: Immediate Mode UIs with React - SFJS Meetup 2015

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

Video Tutorials

• learnreact.com — 3ish minute videos on React.js
• Learn ReactJS (make a Pokedex!) - part 1
• Learn ReactJS (make a Pokedex!) - part 2
• React.js Components - part 1
• React.js Components - part 2
• Advanced Input Validation With React
• ReactJS: Dealing with the Server
• Building UIs with ReactJS
• React.js Internals
• React in 7 Minutes
• jFlux - Going from MVC to FLUX
• Learn React in steps - BigBinary
• Keep up with React - BigBinary
• React Native Intro
• Building a Simple ToDo App With React Native and Firebase
• React & Flux by: Christian Lilley
• React for beginners
• React For Everyone

---

Books

• SurviveJS - Webpack and React
• Fullstack React: The Complete Guide to ReactJS and Friends

---

Demos

• react.rocks - Pinterest-style directory of online demos with available code
• react-hn - A React & react-router-powered implementation of Hacker News
• react-pokemon - A React component for displaying Pokémon
• React + Backbone TodoMVC
• React + NestedTypes TodoMVC
• react-rxjs-todomvc - TodoMVC implementation with React and RxJS
• react-mvc - A sample chat application written with React and pure MVC
• react-observe-todomvc - TodoMVC implementation built on top of React and Object.observe
• react-lights-out - Simple demo of the React framework's power and flexibility
• todomvc-swarm - React TodoMVC implementation using Swarm for real-time collaboration
• reactodo - Multiple localStorage TODO lists, built with React
• lifequote - React port of a life insurance quick quoting application
• reactor-demo - Isomorphic Javascript app with React
• imgsible - React-based Imgur-like isomorphic demo app
• wow-realm-status-react - WoW Realm Status: React Edition
• react-json-editor - A generic JSON editor
• react-todos - Backbone's example TODO app with React JS for views
• github-issues-viewer - A gitub issues viewer build in react + backbone
• wolfenstein3D-react - Wolfenstein with the rendering layer written in React
• Flux ImmutableJS TodoList
• Hapi+React+Flux user management system
• Redux TodoMVC
• react-babel-webpack - CRUD demo app featuring React, React Router, Flux, Webpack, Bootstrap

---

Example Apps

• isomorphic500 - Isomorphic JS app built with React and Fluxible
• fil - A playground for in-browser interpreters (Redux)
• sound-redux - A Soundcloud client built with React / Redux
• react-pomodoro - A Pomodoro timer for developers
• Do - Notes management application built with React and Redux

---

Real Apps

• reddit/reddit-mobile
• khan/perseus
• mozilla/payments-ui
• webbylab/itsquiz-wall
• brainfock/brainfock

---

Contribution

Your contributions and suggestions are heartily♡ welcome. (✿◠‿◠)

---

License