What is special about React?
React is built around the concept of components. This is in contrast to frameworks like Angular and Ember, which use two-way data bindings to update the HTML of the page. In my opinion React is easier to learn than Angular and Ember – it is much smaller and plays nicely with jQuery and other frameworks. It is also extremely fast, because it uses a virtual DOM, and syncs only the changed parts with the underlying page (accessing the DOM is still the slowest part of a modern web application, which is why the framework gets a performance boost by optimizing it).
However, the flip side is that it takes a bit more code in React to achieve the same things that can be easily done with a data binding, as you can see from the examples below. For a comparison, see our article about Angular.
I personally think that a framework becomes interesting when it provides a set of abstractions that enable a different mode of thinking. In this aspect, react, the new JS framework from the folks at Facebook, will force you to rethink (to some extent) how you decompose the UI and interactions of your application. Having reached version 0.4.1 (as of this writing), React provides a surprisingly simple, yet effective model for building JS apps that mixes a delightful cocktail of a different kind.
In this article, we’ll explore the building blocks of React and embrace a style of thinking that may seem counter-intuitive on the first go. But, as the React docs say: “Give it Five Minutes” and then you will see how this approach will become more natural.
- User Interface
- Vitual DOM
- Data Flow and Data Binding
• 4. React.js Libraries
A collection of awesome React tools, resources, videos and shiny things.
• 5. Tutorial | React
We’ll be building a simple but realistic comments box that you can drop into a blog, a basic version of the realtime comments offered by Disqus, LiveFyre or Facebook comments.
- A view of all of the comments
- A form to submit a comment
- Hooks for you to provide a custom backend
It’ll also have a few neat features:
- Optimistic commenting: comments appear in the list before they’re saved on the server so it feels fast.
- Live updates: other users’ comments are popped into the comment view in real time.
- Markdown formatting: users can use Markdown to format their text.
Want to skip all this and just see the source?
[It’s all on GitHub.]( Edit on GitHub