An Introduction to React Native

An introduction to React Native and an overview of its developer experience to an audience primarily made up of iOS developers and designers.

Event: CocoaHeads Montreal
Location: Shopify Montréal

Transcript

1. An Introduction to React Native
2. Hi, I’m Naoufal Naoufal
3. Hi, I’m No-Fell Senior UI Engineer @ Unsplash
4. Hi, I’m No-Fell Senior UI Engineer @ Unsplash
5. Unsplash Do whatever you want high-resolution photos
12. What is React Native
13. First, What is React
14. React • JavaScript Library • A new declarative way of building UIs • One-way data flow
15. Declarative UI
16. Example
17. Example • Liked • Count • Color • Transition
18. The Imperative Way • Liked • Count • Color • Transition
19. The Declarative Way • Liked • Count • Color • Transition
20. Declarative Wins • Less Code • Easier to Reason about the Application • Faster Development
21. React Structure
22. React Structure React React Native React Dom Objective-C/Swift/Java
23. React Native
24. React Native • It’s React • Manipulates Native UI Components • Powerful Native Plugin API • CSS Style with Flexbox • Apple Approved OTA Updates
25. Development Tools
26. Development Tools • Live Reload • Hot Module Replacement • Inspector • Chrome Debugger
27. Apps
28. Apps
29. Demo
30. Connect @naoufal on Twitter & GitHub