Webinar Recording: React.js from a Rails Developer’s Perspective
How will React.js be different with Rails 5 from what we have now?
Based on what I’ve seen, Rails 5 doesn’t introduce changes in the area which may change the React.js integration.
Will ActionCable in Rails 5 make a difference in how React.js is integrated with Rails?
You will need to implement the JS part in some way to make the connection possible; after you receive the data you just pass it to the React components. ActionCable doesn’t change much in the view part.
How does using React.js with Rails differ from using it with Node.js?
If you just use the backend as the API, there’s no big difference between Node and Rails here.
What is the best practice to embed React.js In Rails App? Is it using react_rails gem or is there a more native approach?
Is there an existing thin layer between Rails and React to easily inject ActiveRecord models as JSON object in the views?
You can use any Rails serializer solution to turn the objects into JSON and expose them via an API or in HTML. Nothing React-specific is needed. Rails-react gem makes it very simple to use JSON to initialize a React component and pass those data as starting properties to the component.
Will Marcin present a bit more the Rails project structure when in “React mode”? How is it managed from an assets point of view?
You may look at this blogpost where we described it in more detail.
Ember is very easy to grasp for me because it follows convention over configuration like Rails. How does React compare?
I guess React will be much easier, as it is purely for the view layer of your application. And AFAIK, you can use Ember with React (though I have not tried it myself).
Are there any JS or React specific features in WebStorm that are not in RubyMine or IntelliJ? I know that JSX Harmony is supported across all three.
All features coming from WebStorm are also available in RubyMine and IntelliJ. You have support for ES-linter, some custom code inspections (check this blogpost ) and many more. I think it is enough for helping with React and JS. And there is a whole directory of additional plugins in the editor settings.
Is it possible to get the JS function to render a ERB partial? (Feels like it’d be good to separate the JS and HTML.)
I think you can just render stateless functions to render React components not using any state. This solution won’t be using ERB partial, but you can move its code (ERB partial’s code) entirely to the JS codebase as JSX code.
Would you recommend starting with TDD for React?
I think it’s good to start TDDing with React. You can try using shallow rendering technique or integration testing (which may be a bit painful).
Is there a way to separate the “view” (JSX) from the behavior (the functions, etc, rest of the component) in the dev environment?
JSX is just a syntactic ‘sugar’ for a structure of a component tree. I think you can just leave it as it is, because it only looks as HTML.
Is ReactJS easier to learn compared to Angular, Ember, etc.?
I think it’s easier – it focuses on the view part only and it doesn’t force you to use it for everything. I found it less invasive and easier to start with.
It is mainly because React is just a library for constructing views. Angular and Ember are whole frameworks taking care of much more stuff (not only views).
So React is primarily the view layer, but you can do some light logic like what’s being demo’ed right know. When is the right time to use something like RefluxJS? Do you recommend other tools if your apps grow larger?
We recommend Redux for the data management part. I think the time is if you are doing something more complex than just displaying data (e.g. sending some AJAX requests). You can use RefluxJS if it is good for you. There are lots of different flux architecture implementations (like RefluxJS). I personally use Redux with some custom architecture to control the flow using some event-bus for controlling the flow of data.
Rails uses CoffeeScript by default; how do you change it to JS? Remove the gem and rename the file extension?
That should do the trick. However, if you want to use EcmaScript2015, it may be a bit more complicated.
If you use the react-rails gem, then changing the file extension was enough for me, also for ES2015.
Books from Arkency
Use the discount code JETBRAINS_REACT_WEBINAR to buy Arkency React e-books at 35% off (valid through April 12th so hurry!).
The RubyMine Team