What React isn't
React is not a complete framework, kit or anything else. From the homepage:
React consists of components. You may have already heard about Web Components that allow us to create custom HTML tags and include them anywhere on the outside world as easile as we include an
H1 tag. React components work just like this but can only be used inside the React ecosystem.
React.render( <h1>Hello, world!</h1>, document.getElementById('example') );
Think of a
List element. We will write a List component that will contain a
ListItem component. Every time we need to display it, the
List component will render a
<ul/> tag with a bunch of
ListItem components,, and each of these
ListItems will render
<li/>, each with their information.
But wait? Did you said... render... every time? Like every time someone adds something in the list we will rerender it?
Enter the Virtual DOM magic, or in React's terms, the Reconciliation. The essence of React. React will not render directly to the DOM every time something changes. Instead, it will render to its own internal DOM (the Virtual DOM) and then compute diffs on the real DOM. React makes only the appropriate changes to the DOM to reflect the new changes. We never have to interact with the DOM again. We may never even have to write external stylesheets. React has you covered.
I would suggest getting your hands on the React's documentation as fast as possible. There are a lot of concepts you need to understand in order to grasp its full potential.
Please let me know if I missed or misunderstood something, since it's my second day using React. If you liked my article please share it. :)
I have to thank Matthew Lewis for reviewing this article. Thank you Matt.