Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

React native sharing

614 views

Published on

Why react native is good for Mobile developer.

Published in: Technology
  • Be the first to comment

React native sharing

  1. 1. REACT NATIVE 這條 路 SAM LEE
  2. 2. Sam Lee : FED : / 

  3. 3. Demo
  4. 4. React Native Mobile Developer Javascript Java? FED
  5. 5. Why Javascript ? Javascript
  6. 6. Java Obj-C Javascript V8 Engine Javascript Core
  7. 7. React Native V-OBJ NATIVE
 OBJECT iOS Android Windows Tizen OSX QT VR JAVASCRIPT
  8. 8. ? ? ?
  9. 9. ReactJS Native
 Function V8 engine Javascript Bridge RCTBridge Java bridge
  10. 10. React Native ?
  11. 11. ReactJS Native
 Function JavascriptCore Javascript Bridge RCTBridge Obj-C bridge
  12. 12. React Native ?
  13. 13. https://facebook.github.io/react-native/showcase.html
  14. 14. - 2015/10 - React Native v0.11 ( Support Android) - 2016/04 in Facebook F8 conference , Microsoft and Samsung have committed to 
 bringing React Native to Windows 10 and Tizen - 2016/10/06 React VR announcement! - 2017/02 React Native v0.41
 2 1 release
  15. 15. ? Java
  16. 16. Lib / Backend 30% UI / UX 70%
  17. 17. Demo
 Hot Reload
  18. 18. :
 iOS x 1 Android x 1 FED x 1
  19. 19. - App iOS iOS App Android Android App FrontEnd
  20. 20. - App iOS Android FrontEnd React Native App
 (iOS, Android)
  21. 21. Bug : 250% up : 280% up
  22. 22. - React Native iOS Web (CP ) - Backend API (Fullstack…) - Team ( ) Extra Benefits
  23. 23. App React Native View App https://facebook.github.io/react-native/docs/integration-with-existing-apps.html
  24. 24. ?
  25. 25. 在 React Native
 經過, 路過, 也不會錯過的 坑
  26. 26. 不必要的 Render 坑
  27. 27. ListView 坑
  28. 28. Navigator 坑
  29. 29. React Native
 更新太快!! (好? 壞?) 坑
  30. 30. REACT NATIVE 這條路...
  31. 31. 其實
  32. 32. 幹 之 如 飴
  33. 33. Why 幹之如飴 1. 不⽤怕沒有 Solution (上⾯⼀群神⼈在幫你) 2. 更新很快, 這次沒有的 Feature 下次可能就有了 3. 刻 UI 不⽤等 !!! (省太多時間了) 4. ⼀套 Code 同時開發 2 個平台 (Reuse rate ⾼達 80%) 5. 80%的問題都是 1個 solution for 2 個平台
 (當然 bug 也是⼀次 2 個平台...)
  34. 34. react-native init AwesomeProject “Get your hands Dirty”
  35. 35. React Native - Javascript -> ES6 - ReactJS
 https://facebook.github.io/react/ - Flexbox - 
 https://css-tricks.com/snippets/css/a- guide-to-flexbox/
  36. 36. 發問吧!

×