React Native in Production

These are the slides from a talk I gave at Droidcon India, 2016, explaining our journey at Myntra in embracing React Native

1. React Native in Production @mariostallone myntra
2. What is React Native? React Native lets you build mobile apps using only JavaScript. It uses the same design as React, letting you compose a rich mobile UI from declarative components.
3. Didn’t Sencha, Phonegap, Ionic and… say that you can do the same?
4. Didn’t Sencha, Phonegap, Ionic and… say that you can do the same? React Native is Native :)
5. Why React Native?
6. All our Front end Devs are now Mobile Devs JavaScript… React lets them bring the same fundamentals that they used to develop web apps to mobile
7. Developer friendly Double tap ‘R’ to Reload your view build fast… really fast
9. Share code between Android and iOS
10. Instant App Updates The Play Store allows this The App Store clearly states that this is permitted
11. Why React Native? - Business Reasons
12. Why React Native? - Business Reasons Product can iterate and push out features faster
13. Why React Native? - Business Reasons Product can iterate and push out features faster Make the business guy happy by pushing out that teeny new feature just before the sale
14. Why React Native? - Business Reasons Product can iterate and push out features faster Make the business guy happy by pushing out that teeny new feature just before the sale Fix bugs really fast
15. Why React Native? - Business Reasons Product can iterate and push out features faster Make the business guy happy by pushing out that teeny new feature just before the sale Fix bugs really fast Your users needn’t update their app
16. Why React Native? - Business Reasons Product can iterate and push out features faster Make the business guy happy by pushing out that teeny new feature just before the sale Fix bugs really fast Your users needn’t update their app Lesser cost of development
17. Taking the Leap of Faith Convincing our CTO One Platform at a time Put a smart and enthusiastic dev on it Release to a controlled audience Metrics…
18. Some Learnings
19. App Structure Analytics Networking Caching … Native Screens React Screens Native Modules
20. Routing
21. Routing Native Screen React Screen
22. Routing Native Screen
23. Routing Native Screen Native Screen
24. Routing Native Screen React Screen Native Screen
25. Routing Native Screen React Screen Native Screen React Screen
26. Routing Native Screen React Screen Native Screen Native Screen React Screen
27. Routing Native Screen Router React Screen
28. Move Fast Build all features henceforth with React Native Release fast
29. Update your dependencies The core team releases every 2 weeks Since its a growing framework, a lot of things change between releases We almost got ourselves in this mess, and spent an entire sprint ensuring we don't get there again
30. Get Everyone Involved…
31. Some Caveats
32. Components You might need to write your own Bridge Component for something that’s not available out of the box or in the O/S community You would probably end up writing wrapper modules to re-use a lot of your existing native code
33. Tracking Crashes Unlike Native crashes, all crashes get accumulated under the same crash - Fabric, etc. Support sourcemaps from the get go You may need a JS error tracker as well - eg. sentry Sometimes hard to debug
34. App Size Unlike iOS, Android doesn't ship with a JS runtime, and hence this needs to be packaged with the app We resorted to platform specific builds to ensure a lower size
35. Demo Time
36. Where are we with RN? More than 60% of Myntra’s iOS app is on React Native The Home Page of the Android app is on React Native We’re re-writing other parts of our app using React Native while ensuring they work across Android and iOS We push out weekly, sometimes more frequent updates to our apps Our developers are Cross Platform… Yay!
37. When not to use React Native? React Native is not a Golden Bullet for every problem It works well for apps that do not have too much of hardware interaction. Largely enterprise apps and apps that frequently get updated would benefit from React Native and… if you are a JS dev, and hate writing Native (java, objective -c or swift)
38. Questions?
39. @mariostallone Thank You