11 ms·

I am surprised at all of the hate that Yahoo! is receiving for this, in the comments section of Hacker News (not surprisingly). This is great in my opinion, I t

I am surprised at all of the hate that Yahoo! is receiving for this, in the comments section of Hacker News (not surprisingly). This is great in my opinion, I think React.js is definitely the future of SPA's especially when combined with the Flux architecture. As someone who has been using React on a daily basis for the last few months, I have a severe man-crush on it. It just makes so much sense, combined with something like Browserify and working with a isomorphic workflow (shared codebase front and back-end). And those who say Yahoo! are just jumping onboard the React hype train or Node.js hype train, you have it all wrong. Yahoo! have been using Node.js for the last few years, in-fact early 2010 is around the time Yahoo! engineers started playing with Node.js, long before it was considered mainstream cool or being used really in any high-profile scale environment. It is rare that a company the size of Yahoo! truly ever embraces moving at this kind of pace and embracing new open source technologies, languages, frameworks and libraries. Now that Yahoo! have openly declared their use of React on such a large scale, expect it to explode even more so in 2015. For an open source project that is a little over a year old, React is getting the kind of user-base and adoption that most open source projects can only dream of having. This news excites me. I honestly cannot wait to see how it all turns out. PS. I have noticed a few people in the comments section getting confused. Yahoo! Mail is NOT using React just yet. The current mail product is still using YUI and plain HTML/Javascript. If you read through, it mentions 2015...

Sawbones 12y ago
I really need someone to explain to me what they love so much about React.js. I tried it out and I absolutely hated the way components didn't understand their relation with other components. I had to chain a callback all the way down to my ListItem Component just so it could set which item was selected in the component and let other components know that. If you ever end up adding another parent component you have to rewrite all those top level components to pass that information down.
- rakoo 12y ago
  That's because you used React alone, which works as a top-down view engine. If you want to modify something in the view, you have to go back to the top and modify the model. Instead of doing it manually, Facebook has created the Flux architecture to help you scale this process efficiently.
  - marknutter 12y ago
    So Facebook created an architecture to solve a problem their new web framework introduced?
    - neftaly 12y ago
      No, they created an architecture and decoupled their web framework from it.
      - findjashua 12y ago
        Which was a poor decision, imho. Using React only makes sense with Flux, why separate them? Furthermore, the examples on React's docs use the pass-down-the-event-handlers madness, instead of using Flux. React+Flux is a good solution, but the documentation leaves a lot to be desired.
        nutate 12y ago
        React components can be brought into any architecture. Using them with flux certainly simplifies many things, but by the same token, flux apps can be written using other libraries (react based like om, or even full frameworks like angular). The decoupling is good. It lets you try out a component from http://react.rocks/ http://react.rocks/ without diving into a fully architectured SPA.
- edvinbesic 12y ago
  I think if you need to pass callbacks several levels down you should consider some form of event system so that you may decouple your components from the hierarchy.
- insin 12y ago
  Try going sideways once things get too nested for callbacks not to be arduous: https://github.com/rpflorence/react-training/blob/gh-pages/lessons/04-less-simple-communication.md https://github.com/rpflorence/react-training/blob/gh-pages/l... Another option (albeit currently an undocumented one) is to use contexts to obviate the need to pass things down manually: http://davehking.com/2014/11/15/introduction-to-contexts-in-react-js.html http://davehking.com/2014/11/15/introduction-to-contexts-in-...
- findjashua 12y ago
  That's because React only makes sense if used with Flux. Otherwise just use Ractive.js - components can communicate with each other via events, so you don't have to pass event handlers down the hierarchy.
- modarts 12y ago
  You have a very topical understanding of how to structure an app with react then.

Sawbones 12y ago

I really need someone to explain to me what they love so much about React.js. I tried it out and I absolutely hated the way components didn't understand their relation with other components. I had to chain a callback all the way down to my ListItem Component just so it could set which item was selected in the component and let other components know that. If you ever end up adding another parent component you have to rewrite all those top level components to pass that information down.

rakoo 12y ago
That's because you used React alone, which works as a top-down view engine. If you want to modify something in the view, you have to go back to the top and modify the model. Instead of doing it manually, Facebook has created the Flux architecture to help you scale this process efficiently.
- marknutter 12y ago
  So Facebook created an architecture to solve a problem their new web framework introduced?
  - neftaly 12y ago
    No, they created an architecture and decoupled their web framework from it.
    - findjashua 12y ago
      Which was a poor decision, imho. Using React only makes sense with Flux, why separate them? Furthermore, the examples on React's docs use the pass-down-the-event-handlers madness, instead of using Flux. React+Flux is a good solution, but the documentation leaves a lot to be desired.
      - nutate 12y ago
        React components can be brought into any architecture. Using them with flux certainly simplifies many things, but by the same token, flux apps can be written using other libraries (react based like om, or even full frameworks like angular). The decoupling is good. It lets you try out a component from http://react.rocks/ http://react.rocks/ without diving into a fully architectured SPA.
edvinbesic 12y ago
I think if you need to pass callbacks several levels down you should consider some form of event system so that you may decouple your components from the hierarchy.
insin 12y ago
Try going sideways once things get too nested for callbacks not to be arduous: https://github.com/rpflorence/react-training/blob/gh-pages/lessons/04-less-simple-communication.md https://github.com/rpflorence/react-training/blob/gh-pages/l... Another option (albeit currently an undocumented one) is to use contexts to obviate the need to pass things down manually: http://davehking.com/2014/11/15/introduction-to-contexts-in-react-js.html http://davehking.com/2014/11/15/introduction-to-contexts-in-...
findjashua 12y ago
That's because React only makes sense if used with Flux. Otherwise just use Ractive.js - components can communicate with each other via events, so you don't have to pass event handlers down the hierarchy.
modarts 12y ago
You have a very topical understanding of how to structure an app with react then.