Video and slides synchronized, mp3 and slide download available at URL http://bit.ly/1KstMEq. Christopher Chedeau walks through the challenges involved in bringing the React JavaScript UI library to iOS. Some of these are technical, but there are also interesting people management challenges since, from an iOS developer perspective, React Native is a very bad looking proposition. Filmed at qconnewyork.com. Christopher Chedeau started as a front-end engineer in the photos team at Facebook where he built the tagging interface using face detection, sending photos via chat and refactored the image fetching pipeline. As soon as he saw React, he got hooked up and quickly became part of the core team. More recently, he started React Native, an iOS and Android backend for React.

1. From Hackathon
to React Native
Christopher “vjeux” Chedeau

2. InfoQ.com: News & Community Site
• 750,000 unique visitors/month
• Published in 4 languages (English, Chinese, Japanese and Brazilian
Portuguese)
• Post content from our QCon conferences
• News 15-20 / week
• Articles 3-4 / week
• Presentations (videos) 12-15 / week
• Interviews 2-3 / week
• Books 1 / month
Watch the video with slide
synchronization on InfoQ.com!
http://www.infoq.com/presentations
/react-native-facebook

3. Presented at QCon New York
www.qconnewyork.com
Purpose of QCon
- to empower software development by facilitating the spread of
knowledge and innovation
Strategy
- practitioner-driven conference designed for YOU: influencers of
change and innovation in your teams
- speakers and topics driving the evolution and innovation
- connecting and catalyzing the influencers and innovators
Highlights
- attended by more than 12,000 delegates since 2007
- held in 9 cities worldwide

4. Historical Context
JavaScript Execution
API Design
Convincing
Plan
Demo
Demo
Demo

5. Facebook 2012:
Mobile First Company

6. “Our biggest mistake was betting too
much on HTML5”

7. Mobile Web?
•Touch Handling
•Browser UI & Gestures
•Keyboard & Dimensions APIs
•Image Management

8. Mobile Native?

9. iOS?
•Iteration Speed
•Imperative APIs
•Show Random Experiments

10. Sad Panda

11. React Native

12. f8

13. JavaScript Execution

14. You should write Objective-C in
Objective-C and JavaScript in
JavaScript
Goal

15. Bridge
Asynchronous Batched Serializable
(callback) (json)

16. •JavaScript Core
•WebView
•Chrome
•Heroku!?
Execution Engines

17. Groups

18. How do we design APIs?

19. API Design
Wait
Study
Future
Proof
Codemod
Wait

20. “The main reason overfitting
happens is because you have a
small dataset and you try to learn
from it” — Prateek Joshi
Wait

21. iOS, Android and Web are not
that different
Study

22. • iOS: SCNetworkReachability
• Android: ConnectivityManager
• Web: navigator.connection
Study

23. getConnectionType()
• none
• wifi
• 2g
• 3g
• 4g
Study

24. isConnected?
Study

25. isMetered?
Study

26. isFast?
Study

27. Future Proof
Connection Class

28. “Code multiplies when you’re
not looking, not unlike bunnies
that tend to multiply when you’re
not looking.” — Nicholas C.
Zakas
Codemod

29. Wait

30. Escape Hatches

31. Groups

33. Convince
Unproven JavaScript React

34. •JavaScript
•JSX
•ES6, ES7…
•Flow
Programming Language

35. Convince
Unproven JavaScript React

36. Convince
Management Web Devs iOS Devs

37. Historical Context
JavaScript Execution
API Design
Convincing
Conclusion
Demo
Demo
Demo

38. Thanks!
Christopher “vjeux” Chedeau

39. Watch the video with slide synchronization on
InfoQ.com!
http://www.infoq.com/presentations/react-
native-facebook