Intro to React | Upcase

Upcase
1
On this weeks episode Chris presents an introduction to Facebook's React.js framework. React is a JavaScript framework used for building dynamic UIs. Learn why React is interesting and what makes it different from the other frameworks for JS UIs. ...
This is a companion discussion topic for the original entry at https://thoughtbot.com/upcase/videos/intro-to-react
1 Like
2

Thanks, that was a great introduction.

1 Like
3

Very cool, Iā€™ve been playing react for a few weeks and enjoying it more than angularā€™s directives.

This is a decent tutorial for getting it up and running within rails. I havenā€™t looked at testing react components at all yet, anyone have experience there or resources?

The other very cool idea with react is flux.

1 Like
4

I found that using Flux helped avoid having to use a top-level component that was effectively storing global state and then passing it down to grandchildren or great-grandchildren components. If you are passing props through more than one level of component to get them somewhere else (you have more than one component receiving the prop and passing it on without using it in rendering), thatā€™s a code smell.

ReactDC did a comprehensive review of Flux implementations recently. Iā€™m curious about giving more of them a try. Weā€™re using Marty.js at Cortex, and Iā€™ve had a great experience with it. Itā€™s under active development, has reasonable documentation, and the author is responsive to bug reports and suggestions.

5

Anyone else find it extremely easy to follow along with Chrisā€™s videos?

2 Likes
6

very interesting indeed. I wonder if React.js is a replacement for Ember.js, or if both frameworks serve another purpose.

greetings,

Anthony

7

Excellent overview! Just what I needed. Are there any plans for a React trail? Iā€™d love to see something on Vanilla React, Flux, Reflux, and React Native.

1 Like
8

@imwithsam Thanks! Weā€™ve started using React on more client apps and as our expertise grows I could see us producing more content. At a minimum I have a strong interest in React so I will likely end up doing a few more Weekly Iterations on it.

6 Likes
9

Iā€™m definitely interested in a React Trail with react-rails, reflux and react-router. There is so much churn around Javascript right now. Iā€™m having a difficult time deciding on ES6, webpack or plain rails assets, etc.

10

I think it would be great to do a Rails/React trail.

11

Iā€™ve found Chris to be the best presenter on Upcase Iā€™ve seen so far! You should do more videos :slight_smile:

12

At 10:58, should it it be this.props.users rather than this.state.users, since we are not setting state anywhere rather than just passing props?

13

Iā€™m actually going to take a gamble on React and learn it for a new clientā€™s app. I would love to see how Thoughtbot approaches React! I would love a new Trail with React/Rails!

2 Likes
14

Me :relaxed:

15

Really looking forward to more in-depth videos on React

16

Iā€™d be really interested in more videos around React. React+Rails maybe.

17

I would also love to see more React related videos/trial.
Been trying to get my head around React + Flux + Rails with not much luck. So I would find Flux/Rails explanations very useful.

18

React would be my top pick for a new trail. Everything I can find on the web only goes so far as to give a ā€œHello Worldā€ level example when dealing with Rails. There is far too much that happens in the middle when building out a real application.

I would love to see the process of implementing React on a simple Rails crud app (preferably via React-Rails).

2 Likes
19

Iā€™m with you on this idea. I love React and using Rails API gem to build isomorphic apps

1 Like
20

Great intro to ReactJS @christoomey !

Iā€™m starting to dabble with it by using the react-rails gem and have a few questions:

  1. When using ReactJS components, is there a way that we can use Rails helpers (like link_to) within JSX?
  2. Similar to first question, Is it possible to use simple_form within components? Iā€™m building all of my markup manually right now :frowning: .
  3. How do we deal with ruby logic within a component? For example, what if you need to call a boolean ruby method on an object in a collection that is passed in as a prop. (i.e. this.props.article.printed?).
  4. How would you recommend breaking down your react components into separate files? Some find it a bit painstaking to have to navigate over several partials when working with something they consider a single component (like a table for instance)?
  5. Do you know of any vim plugins that allow the use of gf on react component names?

Cheers! :beers:

1 Like