The Complete React on Rails 5 Course
Instructor: Hrishi Mittal
Learn how to use React.js with Ruby on Rails applications in this comprehensive video course.
Co-founder and Ruby Engineer at RankTracker
"The course is very comprehensive and Hrishi is excellent at explaining everything in great detail. It starts with a simple Rails app which you migrate into React components, which gives you a great understanding of how much better a React approach is. I came into the course feeling overwhelmed by the React ecosystem, but I'm now feeling confident in my ability to move RankTracker's Rails views into React components."
Can I still use the asset pipeline?
Do I need to use Browserify or Webpack?
Do I need to make an API to use React?
It's too confusing, so you give up.
The Complete React on Rails Course
Why is learning React important for a Rails developer?
- Web UIs have matured a lot over the last decade. We're doing more complex things to build better user experiences on the web. jQuery has served well but even a medium-sized project can now quickly turn into the Flying Spaghetti Monster. React offers a simple yet powerful alternative to spaghetti code.
- Even if React itself is replaced by something else, the concept of reactive UI - UI as functional components is here to stay. So it'll help you a great deal to learn to use it.
- In many ways React is to the modern frontend, what Rails is to the backend - there are many alternatives, but React has the best combination of simplicity, power and popularity to make it a great choice.
- There's a huge and growing market demand for React developers. Many companies are moving their frontend away from plain Rails templates and jQuery over to React, so learning React would give you a unique advantage over others vying for the same jobs.
- Once you learn to use React with Rails, you can also use React Native to build mobile apps for the same API. This way, your investment in learning React gives you the chance to easily build cross-platform apps.
Senior Web Developer, Co-founder at BISINFO
"The course is wonderful, it's put together very well and helps both with understanding the theoretical concepts as well as their practical implementation. I've learned a lot from it and would recommend it to anyone, both seasoned developers and people who are just starting out."
US army veteran and recently trained web developer
"Before stumbling upon Hrishi's Complete React on Rails course, I had been browsing for numerous articles, and youtube videos on how to learn React. My approach was to learn how to use the React library itself, and then eventually figure out how to implement it into a Rails project. I decided to pick this course because it is project based. It encompassed everything from implementation, testing, to deployment using Heroku. Hrishi does an excellent job at conveying the principles used in React. Each lesson gave me great confidence with each new concept that was introduced; there was an explanation of what we were doing and why it is done this way. If you want to learn how to use React with Rails, this course is a must. One of the best tutorials since taking Michael Hartl's Rails Tutorial. The best part of this course so far has been incrementally building the application, and then deploying it. One of the biggest concepts I've learned is how to build a component based application. For a beginner, it makes development less daunting, and easier to grasp, but overall it makes application development so much simpler. This course is helping to build my own personal website using React and Rails, and ultimately getting a job as a developer."
What You'll Get With This Course
1. Introduction to React
1.1. Quick Introduction to key React concepts
2. Getting started with React in Rails
2.1. Installation and setup of Rails 5 app with react-rails gem
3. Your first Rails app with React
3.1. Calendar appointments app with jQuery and Haml
3.2. React props and nested components
3.3. React State - Handling user form input
3.4. React State - Handling form submission
3.6. Using a third-party React component - react-datetime
3.7. Styling with CSS in React
3.8. Deploying a react-rails app to Heroku
4. ECMAScript 6 (ES6)
4.1. Introduction to ES6 using the react-rails component generator
4.2. ES6 classes in React
4.3. ES6 Arrow functions in React
4.4. Stateless Functional Components in React
4.5. How to use React with the webpacker gem and Rails 5.1
5. Using React with Webpack in Rails
5.1. Introduction and setup of Webpack with react_on_rails gem
5.2. Migrating the Calendar appointments app to react_on_rails
5.3. Server-side rendering
5.4. Deploying to Heroku
5.5. Hot Module Replacement
6. Forms in depth
6.1. Basic form validation
6.2. Client-side form validation in React
6.3. Code refactor and corrections
6.4. Multiple field validations on client side
6.5. Refactor client side validations
6.6. Client side validation errors
6.7. Generalised form validations
6.8. Typechecking With PropTypes
7. React Router v4
7.1. Introduction to React Router v4
7.2. Viewing a record on its own route
7.3. Navigating between routes
7.4. Keeping data fresh with componentDidMount
7.5. Editing a record - Part 1
7.6. Editing a record - Part 2
7.7. Deleting a record
8. User authentication with Devise
8.1. Using Devise with React
9. Using React with a Rails API
9.1. Setting up a Rails API app and Create React App
9.2. Porting React components from react_on_rails to React
9.3. API User authentication with devise_token_auth
9.4. Displaying session data and signing out
10. Testing React
10.1. Testing with Jest
10.2. Testing with Enzyme
10.3. Snapshot testing
10.4. Testing forms
11. Styling and animations
11.1. Using Bootstrap with React
11.2. CSS Animations and Transitions
12. Flux and Redux
12.1. Introduction to Flux
12.2. Introduction to Redux
12.3. Using Redux with react_on_rails
13. BONUS Example Apps
13.1. Fitness dashboard Part 1
13.2. Fitness dashboard part 2
13.3. Fitness dashboard part 3
13.4. How to build a chat app with Rails 5.1 ActionCable and React.js Part 1
13.5. How to build a chat app with Rails 5.1 ActionCable and React.js Part 2
13.6. How to build an online store using React and Rails - Part 1
13.7. How to build an online store using React and Rails - Part 2
About the instructor
He has more than a decade of experience building software using a number of different technologies. He has worked for organisations ranging from tiny startups to large governmental departments. He is also the author of the R Graphs Cookbook.