First impression is that this is a lot like their PHP language extension XHP[1], which allows you to embed XML syntax into PHP and automatically escapes variables depending on their context (inside or outside the XML):
<?php
// note: includes omitted
if ($_POST['name']) {
echo <span>Hello, {$_POST['name']}</span>;
} else {
echo
<form method="post">
What is your name?<br />
<input type="text" name="name" />
<input type="submit" />
</form>;
}
It would be nice to see a list of reasons one might choose this over angular or any of the other frameworks. The features and description on the homepage are pretty vague...
Consider the architectural difference of React vs. one of the similar "view model" frameworks. It's similar to the difference between Git vs. SVN.
Other view model frameworks typically track all changes to the view model by explicitly firing an event for every delta change. That in turn causes another delta and so on. This is similar to SVN where every change is a delta from the previous state. That means that you'll need to codify every possible diff through your view hierarchy/graph. For simple stuff, they have built-in tools to help you do this. For complex views, that's really difficult or impossible (you can get into conflicts and deadlocks).
React makes it easy by simply regenerating a copy of the next view. This is similar to Git where every change is a snapshot.
There are benefits with either architecture, but I'd recommend you figure out what benefits matter more for your use case. I'm just pointing out one area where React is different.
There's already a library named react.js: http://www.reactjs.com/
I've written a blog post that goes over why we made some of the decisions we made here: http://www.quora.com/Pete-Hunt/Posts/React-Under-the-Hood
var HelloMessage = React.createClass({
render: function() {
return <div>{'Hello ' + this.props.name}</div>;
}
});
EDIT: Oh I see it's something called "JSX." Interesting.
A Facebook & Instagram collaboration. fwiw
Looks really nice for creating components. However, two quick notes:
* This breaks code editors, static analysis tools like jshint etc.
* I think Web Components is landing soon, and this seems like it could leverage that.
I'm confused, every example is 100 times the code I would write using straight html... Is there a benefit I'm missing?
Got me really excited but I found that the "why" was missing. Not sure why I would start using it. And I feel like the examples don't explain it very well.. As someone else pointed out, it feels like it's very hard to do simple stuff (from the examples!). I'm sure the landing page will get better at explaining it! For now, maybe adding it to the FAQ could be a quick way to solve this issue (I looked there).
I'm happy to see they open-sourced it. I always was wondering how the framework could look like that produces code like on the instagram.com webapp and Facebook. Especially since instagram.com is still pretty new and would not suffer from legacy decisions like parts of Facebook may still do.
Do templates have to live inside the application logic? If so, this is a really poor decision.
We added react to hellojs so you can try it out easily:
https://hellojs.backliftapp.com/search/React
This includes the compiled version, which isn't included by default.
I'm very confused as to what this is and how you'd go about "building user interfaces" using this. Is it an Ember/Angular competitor? Does it replace or complement a back-end stack?
FYI, I've built a transform[1] for browserify for JSX — now React apps can be written with JSX and using CommonJS module system and then consumed by browsers.
P.S. It doesn't work now with react-tools installed from npm due to bug with their release, which is now fixed in the repo but isn't released yet.
This is terrible, so did we really not learn anything from PHP days? Are we seriously going to mix markup and logic again?
So can this do desktop-like interfaces? We've got a plethora of frameworks now, but sadly none of the offers a good option for more "dense" apps. It's all good and well if I "just" want to do a highly interactive web page, up to a gmail level, but if I want a Swing/Cocoa/Windows-like experience, it's either ext or native...
What is with this low-contrast trend?? Are the complainers not loud enough? Please stop doing that!
I'm guessing this would be the new way to write FB apps, and could be how they will support apps running in mobile FB.
I wonder though if Apple would ever allow their FB iOS app to run FB apps, as iOS guidelines forbid apps from downloading "code in any way or form".
Just had try doing a KnockoutJS version of this also : *http://anexiledderryman.com/post/51714264769/facebooks-new-r...
This looks really nice, will be spending some time with it. Seems like it could benefit a lot from a rich component library -- is there anything like that on the web somewhere or in the works?
I think it would help if you laid out why you're better/worse than some of the libraries already out there? That would make a great section on your site, and would set you apart
I really have the embedded XML in javascript code. I'm much more interested in the Angular or Dart approaches to building web applications.
I stared blankly into my screen for a minute trying to figure out the meaning behind why you can't things off the list in the Todo app.
OMG, JSX.. why? just why?? Stop ruining js people!
I can see how this might get out of hand quickly.
Great ideas IMO but what an ugly API: React.unmountAndReleaseReactRootNode(document.body);
Seems a child of php and angular...
I have just started to learn Angular :(
Meh.
Mixing js and xml syntax, variables in docblocks, DOM components that are not really DOM components ("React.DOM components look like browser DOM elements, they differ in a few ways"), undocumented/obscure OO features (React.createClass?). Yikes. Thank you, but no, thank you.
One of the biggest problems with the web platform is that we've spent the last 20 years trying to shim applications into a document framework. HTML was designed to help academics share research papers, not to replace native thick-client applications, yet that's the direction it's been evolving towards.
I'm really happy to see Web Components (inc. Polymer, Angular, x-tags, and React) landing into HTML. If we accept that web apps != web pages at a spec level, hopefully we can build an awesome platform on which to create tools that leverage all the great parts of the web (linkable, available, auto-updating, device-agnostic) without the mess that we've made trying to make the web do something it wasn't designed for.