Resources for Learning React & Flux

I’ve recently had a few people ask me about resources for learning React.js and Flux, so I figured I’d put all of the resources I’ve used in one spot. Please leave a comment if you find any of these useful/useless or have any good resources I’ve left out!

Why React?

The unexamined 3rd party library is not worth using

• Abridged Version
• Unabridged Version

React Basics

React 101

• Basics on components, props, and state
• Turning mockups into React components
• Composing multiple components

Flux

Facebook’s architecture pattern for organizing large React apps

• Shameless plug: My Intro to Flux blog post – some helpful links on the bottom too
• Flux for Stupid People
• Facebook’s Flux Overview
• Facebook’s Flux chat sample app – great code to dive into for a standard implementation of Facebook-flavored Flux

React Router

Inspired by Ember Router, a great addition to React apps

• React Router overview
• Github repo

Server-Side Rendering

Learn the way of React.renderToString()

• Simple React server example
• React server-side rendering demo kit

Tutorials

Learn by doing

• Make Hacker News with React
• Scotch.io React & Flux tutorials:
  1. Learning React: Getting started and concepts
  2. Build a real time Twitter stream with Node and React.js
  3. Getting to know Flux, the React.js architecture
  4. Creating a simple shopping cart with React.js and Flux
• John Biesnecker’s React Tutorials:
  1. Building a card game (war) with React
  2. Using React.js to draw dynamic SVGs

Cool React Projects

React rocks

• react.rocks

Official Documentation

Still the best and most comprehensive resource out there

• React docs
• Flux docs

Read the Source Code

Your great changes to React & Flux are just a pull request away…

• React source code
• Flux source code