Hands-on with React and Ruby on Rails

Table of Contents

Getting Started With Rails And React

Architectural Overview 00:10:50

Scaffolding The Ruby On Rails Application 00:08:15

Setting Up The Model Layer 00:07:43

Defining Our Views 00:09:55

Defining Rails Routes 00:02:46

Our First React Component 00:07:10

Preparing JSon Data For React 00:06:41

Rendering Ruby Models In React 00:05:58

Introduction To The Flux Application Pattern

Architectural Overview Of Flux 00:06:49

A Simple Flux Store - Part 1 00:05:11

A Simple Flux Store - Part 2 00:08:09

Integrating Flux Into React Components 00:08:59

Introducing ES6 With Ruby On Rails 00:03:59

Migrating Flux Javascript To Flux ES6 00:08:47

ES6 Module Loading - Part 1 00:08:08

ES6 Module Loading - Part 2 00:10:32

Finalizing The Flux Architecture

Introducing Reacts Notion Of Context 00:05:09

Migrating React Components To ES6 00:07:47

Making React Components Context-Aware 00:04:10

React Forms With Flux 00:10:15

Leveraging Action Creators With Context 00:05:28

Reading Server Data 00:05:31

Sending Server Data 00:12:48

Working With Promises 00:03:48

Complex UI Interactions In Flux

Nesting Components 00:05:50

Component Trees 00:05:58

Improving Component Styles 00:09:08

Incorporating Bi-Directional Data Flow 00:05:30

Reviewing Concepts By Example - Implementing Ranking 00:09:45

Reviewing Concepts By Example - Implementing Ordering 00:09:54

Real-Time

Real-Time Overview 00:04:33

Implementing Long Polling 00:04:33

Isomorphic Flux - Configuring NodeJS

Refactoring For Isomorphic Code 00:05:58

Setting Up Webpack With Rails 00:07:44

Overview Of Node Dependencies 00:07:59

Moving Sprockets Code To Webpack 00:06:00

Bridging Rails And Webpack - Part 1 00:06:25

Bridging Rails And Webpack - Part 2 00:11:01

Isomorphic Flux - Configuring Rails

Architectural Review 00:01:13

Bundling Processes With Foreman 00:02:19

Writing A Component Rendering Server 00:03:46

Finishing The Isomorphic Spike 00:07:05

Adding Support For Isomorphic And Non-Isomorphic Rails Configurations 00:02:14

Automated Testing

Setting Up Rspec 00:04:15

Using Code Coverage 00:04:00

Writing Model Specs 00:09:41

Writing Browser-Based Specs 00:05:52

Testing Flux With Rspec 00:08:05

Completing Ruby Code Coverage 00:07:02

A Look At Another Flux Implementation

Flux Fringes With Redux 00:02:37

Redux Container And Middleware 00:03:46

Reduxs Take On Action Creators 00:04:09

Redux React Components 00:05:52

Conclusion

Wrap Up 00:00:46