React

Created by Facebook, open sourced in 2013.

React is just the UI and implements one-way reactive data flow

20k stars on github

one-way reactive data flow

Frontend dependencies

node.js builtin system: npm

Browserify

That allow us to use components from others like this:

react-rails

• JSX transformation in the assets pipeline
• "Lazy" render with `react_ujs`
• Generator
• Server side rendering

"Lazy" render

• Generate a placeholder markup for the React component
• Mount the React component when ready
• React take control of the component

Server side rendering

Same thing as the "lazy" render

but JS is executed on the backend and the React component markup is injected in the placeholder

When DOM is ready, React take control of the component

The configuration

Gemfile

gem 'react-rails', '~> 1.0'

config/application.rb

config.react.variant = :production
config.react.addons = true
config.react.max_renderers = 10
config.react.timeout = 20 # seconds
config.react.react_js = -> { "" }
config.react.component_filenames = ["components-server.js"]