pragmatic introduction to react — maayan glikser
TRANSCRIPT
PRAGMATIC INTRODUCTION TO REACT
Maayan Glikser
Maayan Glikser
- Github addict - Hardcore metal fan - Converted from dogs to cats
Front End Developer @ 500Tech
ReactJS
Component Driven Development
Thinking in components
Thinking in components
JSX
`
let message = ( <div className="hello" onClick={ someFunc }> <span>Hello World</span> </div>);
Without JSX
`let message = React.DOM.div({ className: 'hello', onClick: someFunc },[ React.DOM.span(null, ['Hello World']) ]);
`
Basic Component
React.createClass({ render() { return <span>Hello World</span>; } });
PROPS & STATE
Lifecycle methods
Mount componentWillMount → Angular PreLink
componentDidMount → Angular PostLink
Update componentWillUpdate
componentDidUpdate
Unmount componentWillUnmount → $scope.$on('destroy')
DEMO
Flux
Flux
Flummox Fluxible Marty.js NuclearJS
Redux Lux.js Reflux Alt.js
Read our blog:http://blog.500tech.com
Maayan [email protected]