Upgrade to Pro — share decks privately, control downloads, hide ads and more …

The way of React

The way of React

Talk on React.JS which is a powerful front-end library open sourced by facebook.

Rajika Imal

July 21, 2016
Tweet

More Decks by Rajika Imal

Other Decks in Programming

Transcript

  1. Agenda • Introduction to React.JS • Few facts on React

    internals • Brief introduction to Flux architecture • Demo • Angular vs React comparison
  2. Out of the box • Component based • Learn once

    write anywhere • Declarative • Loosely coupled • No routing solutions • No Ajax support
  3. Components to the rescue • Declarative syntax (JSX) • Tightly

    coupled UI logic and description • Cohesive • Reusable • Own properties (props) and states • Uses vanilla JavaScript • Supports ES2015/ES6
  4. Thinking in React const Tweet = React.createClass({ render: function() {

    return ( <div> <input type="text" value={this.props.tweetText} /> </div> ); } });
  5. Angular vs React • Steep learning curve • Regular DOM

    • 2 way data binding • No unique solution for server side rendering • Smooth learning curve • Virtual DOM • 1 way data binding • Supports server side rendering
  6. What’s next ? • Unit testing : Jest • React

    Devtools • Redux • Server side rendering