Learn the basics of ES6 and React. I assume that you know nothing about React. My goal is to teach you React without requiring any setup or tools. All code samples can be executed in the Browser. The course begins by giving you an overview of ES6. We then begin creating basic components in React, then continue to enhance them. The final example is an interactive web page with multiple stateful components interacting with each other on user actions.

React JS & ES6 for JavaScript beginners

We mentioned earlier that calling `this.setState` on a React component invokes a re-render on that component, and it's entire children component tree.

If you are getting worried that re-rendering the whole component is not efficient, your concern is legit.

However, DOM manipulation is the real bottleneck if you deal with UI updates. On the other hand, javascript is pretty darn fast.

And the good news is that we have been writing Javascript all this time. *But wait, weren't we writing JSX*?  Well, Babel transpiles JSX into JS (specifically into `React.createElement()`) calls. Here goes a side by side comparison of what your Babel output will be for the given React Component.

In this article you will see that react is really fast and we will try to highload it to feel it's limits.

Introduction

ES6

Pure React

State

What is next?

Appendix

Performance and VDOM