React JS Principles

Now lets begin out actual Journey with React

• Write HTML using JavaScript: HTML is great for static data, but not so great for dynamic changing data. Instead of using a template language in place of HTML, React’s way is to just generate HTML using the JavaScript language itself.

• You can use the JSX compromise: Since we love HTML, there is a compromise to get us to write HTML in JavaScript but still use a syntax similar to HTML. It the JSX JavaScript extension.

• Reusable, composable components: Just like HTML itself, and adding to what HTML already offer, with React you define small components and put them together to form bigger ones. You can reuse components as you wish across projects (and even across compile targets)

• Virtual views in memory: Before manipulating the DOM in the browser, React computes the “output” of an application in memory (which is fast). When updates happen, it “diffs” what it has with what is coming and performs only the minimum needed actual DOM operations.

• Views are a function of state: You write that “function” once and it’ll always reflect the current state. We don’t need to manually perform DOM operations to reflect the new state, React will do that for us.

• One-way flow of data (and behavior): There is no MVC, you flow the app data through props to any components that need data. You can also flow callbacks for children components to access certain actions of the app. Children components cannot directly read or write the app state. Writing components with well defined and constrained responsibilities that do not interfere with others is what makes great React applications.

• It’s just JavaScript: React has a small API which is basically a few functions that you can learn in a few hours. After that, your JavaScript skills are what makes you a good React developer.