React Walk-Thru - Santa Cruz JS

Quick intro to React which was followed by some code demos (not in this slide deck) and some Q&A. Will post video link on Twitter @simonsturmer

Transcript

1. React Walk-Thru Santa Cruz JS Meetup 8th May 2015
2. Simon Sturmer Front-end Engineer @ Facebook
 @simonsturmer
3. –Some Guy on Twitter “Building in React feels a little like Cheating.”
4. Before we begin: ES6 • Template Strings • Arrow Functions • Destructuring Assignment • Many more goodies…
5. Template Strings … also multi-line and backslash literals.
6. Arrow Functions Note the .bind(this) which is the most important part.
7. Destructuring Assignment the real win is using with function calls like require()
8. … ok, now to the good stuff Why React? • Fresh way to build your UI • Just the View layer • Small API (can be learnt in a day) • It’s an abstraction over the browser DOM
9. React is different react(data) → <View/> • View is pure function of state • Declarative • Compositional
10. Think of React like this… …this is in-fact how react started.
11. In React this would be: oh right, JSX…
12. JSX • Not a templating library • Just syntax sugar on top of JS • Totally Optional
13. Using State
14. Composition • Does not actually wrap one element with another • Extend functionality, add defaults, etc.
15. OK, let’s build…
16. Who’s Using React • Netflix • AirBnB • PayPal • Yahoo • BBC • Pintrest • Instagram • WhatsApp • …and of course Facebook
17. Simon Sturmer …and my little coder-in-the-making
 @simonsturmer I’ll post links to the slides and the demo code on Twitter.