An introduction to React, the javascript framework from Facebook. Talk done at Fullstack.JS, a London Meetup. http://www.meetup.com/Fullstack-js-London/events/221009614/

1. Introduction to React
@qleonetti

2. ● Not an MVC Framework
● Virtual DOM
● REACTive data flow
React ?

3. Not an MVC Framework
● React is not enough
● Flux
● Can be used with other frameworks

4. Virtual DOM
● Re-render
● Generate a DOM patch

5. Virtual DOM
● Re-render
● Generate a DOM patch
Also :
● Server Rendering
● React Native

6. REACTive data flow

7. Components
● buildings blocks
● similar to AngularJS directives

9. Writing A React Component

10. JSX
● Allows use of html syntax
● You don’t need JSX to use React

11. JSX
● Allows use of html syntax
● You don’t need JSX to use React
● Nope, bad idea
https://facebook.github.io/react/jsx-
compiler.html

12. JSX - Compilation
● Client-side compilation
● Pre-compilation

13. JSX - Compilation
● Client-side compilation
● Pre-compilation
-> always compile your JSX for production !

14. Another Basic Example
(see fiddle http://jsfiddle.net/uctrnnbk/ )

15. React on steroids
● gulp / grunt
● browserify
● and more

16. https://github.com/reactjs/sublime-react

17. Little demo : Tweetr

19. Thanks !