layout	permalink
page	/react-intro/

What is React?

A Javascript UI framework based on declarative views
Generate page with nested function calls that take data as input and produce HTML as output

What Problems Does It Solve?

Older UI frameworks built DOM trees imperatively
- HTML initially be created on the server
- Data stored on the HTML elements as attributes
A lot of re-rendering (performance penalty)
Tied tightly to browsers (in a world with a growing variety of devices)

DOM nodes are no longer a source of data
Declarative view rendering and composition removes the need to understand DOM state when updating views
View implementation details are easier to modularize
It's faster: React only re-renders those parts of the view that need to be updated

Install the latest Long-term Support (LTS) version of NPM and Node v6+ from http://nodejs.org/download/
- The download above should install two commands: node and npm
- npm may require some extra configuration to set permissions properly
A code editor
- VS Code
- WebStorm
- Sublime Text
- Atom
create-react-app command-line tool: npm install --global create-react-app

Command-line tool that creates a React application with a standard structure and dependencies
create-react-app robodex: creates the app in the folder robodex
package.json: information on what dependencies your application has as well as some simple commands
README.md: documentation on React and create-react-app
- Replace this with a description of your application
node_modules: dependency files
src: application source files
public: the build target path

npm start: serves the application in a development environment
- Code changes are automatically refreshed in the browser
npm build: builds the application for deployment and copies the files to the public folder
npm test: runs the application's tests
npm eject: ejects the build configuration
- Don't do this!
- (for advanced users only) Don't do this yet