React Native + Expo のバージョンアップと互換性の維持に関する運用と絶技

React Native Matsuri 2022 Session Talk

ExpoのOTA (Over-the-Air) Updateはストアでの申請を通さなくてもアプリの動作を変更することができる素晴らしい機能です。次世代の飲食インフラを開発するdiniiでも、プロダクトの改善を高速に実行していくためにOTA Updateを活用しています。非常に便利なOTA Updateですが、アップデートに際して遥か昔から開発者を悩ませてきたある問題も内包しています。そう、互換性です。このセッションでは、一般的なAPIとクライアントの間の互換性の問題に加え、OTA Updateによって生じる基盤部分とバンドル部分の互換性の問題をdiniiではどのように解決しているかをご紹介します。

Transcript

1. React Native + Expo
   dinii aka karszawa
   React Native Matsuri 2022
   2022/10/08
   

   View Slide

2. ࣗݾ঺հ
   ま
   ほ aka @karszawa
   ま dinii
   ほ
   ほ karszawa
   ま JavaScript TypeScript
   ほ
   2
   

   View Slide

3. ͜ͷൃදͷείʔϓ
   3
   

   View Slide

4. ࣮ࡍͷλΠϜϥΠϯ
   4
   

   View Slide

5. ʲେલఏʳ
   גࣜձࣾ dinii ࣾͰ͸
   5
   

   View Slide

6. ҿ৯ళͷ All in One Platform
   “μΠχʔ”
   

   View Slide

7. All in One SaaS “μΠχʔ”
   7
   All in One = to B + to C
   to B
   to C
   

   View Slide

8. ࢼߦճ਺Λ૿΍͢ʹ͸ʁ 🤔
   8
   

   View Slide

9. ࢼߦճ਺Λ૿΍͢ʹ͸ʁ
   9
   ϢʔβʔώΞϦϯά
   εΫϥϜ
   ϦϦʔεϊʔτ
   ίʔυ
   
   
   ΫΦϦ
   ςΟ
   ϦϦʔε
   
   
   Ϛωδϝϯτ
   Ξοϓσʔτ
   
   
   खஈ
   ϞχλϦϯά
   

   View Slide

10. Ξοϓσʔτखஈ
    10
    Web React Native App
    ま
    ま CDN
    

    ま Expo OTA Update
    ま OTA = Over The Air
    ま
    ま
    ま
    ま
    

    View Slide

11. ิ଍આ໌ɿExpo ͕͍͢͝
    11
    ま
    ま
    ま Push
    ま OTA Update
    ほ
    ほ Expo
    

    View Slide

12. ิ଍આ໌ɿExpo's OTA Update ֓ཁ
    12
    ま Managed Workflow Bare Workflow
    ま 1 5~10 min
    ま
    ほ
    ま JS
    ほ
    

    View Slide

13. ิ଍આ໌ɿExpo's OTA Update ֓ཁ ͦͷ̎
    13
    ま dinii 10
    ま
    ま Expo
    Bundle
    Native
    

    View Slide

14. جຊతʹ͸ศརͳٕज़͕ͩ…
    14
    装
    

    View Slide

15. ͕ͭ͜͜Β͍Α OTA Update 🤧
    15
    ま 20~30 MB
    ま
    ま
    ま
    

    View Slide

16. ໰୊̍ ྼѱωοτϫʔΫͰͷΞοϓσʔτ໰୊
    16
    Bundle
    

    View Slide

17. ໰୊ͷ؍࡯ɿྼѱωοτϫʔΫͰͷΞοϓσʔτ໰୊
    17
    1.
    a.
    

    2. SDK
    a.
    

    3.
    

    View Slide

18. ରࡦɿྼѱωοτϫʔΫͰͷΞοϓσʔτ໰୊
    18
    N
    a. SDK
    b.
    

    View Slide

19. ରࡦɿྼѱωοτϫʔΫͰͷΞοϓσʔτ໰୊
    19
    ま
    ま Cloud Logging BigQuery & Redash
    

    View Slide

20. 20
    SECRET
    

    View Slide

21. ໰୊̎ ޓ׵ੑ
    21
    

    API
    Q.
    

    View Slide

22. ΞϓϦέʔγϣϯͷαϙʔτظݶɿ΋ͪΖΜਖ਼ղ͸Ϗδωε࣍ୈ
    22
    Twitter ?
    Windows ? Office ?
    

    View Slide

23. ޓ׵ੑͷ໰୊
    23
    Bundle Native
    Expo Native vs Bundle
    

    Bundle
    Native
    OK
    Native
    NG
    Native
    

    View Slide

24. ໰୊ͷ؍࡯ɿޓ׵ੑͷ໰୊
    24
    1. Native
    a.
    2. Managed Workflow Native Expo
    a. Expo Bundle
    b. Managed Workflow Eject PJ
    

    View Slide

25. ରࡦɿޓ׵ੑͷ໰୊
    25
    OTA Update SDK
    Native
    

    Info.plist ExUpdatesRuntimeVersion
    Bundle
    

    app.config.js runtimeVersion
    

    View Slide

26. dinii Ͱͷӡ༻
    26
    ま
    ほ ios / android
    ほ app.config.js
    ま SDK
    

    Native
    

    View Slide

27. dinii Ͱͷӡ༻
    27
    ま Native
    

    ま
    

    View Slide

28. Ξοϓσʔτ؂ࢹ
    28
    ま Native Bundle
    

    ま
    😆 < AppStore
    < ☺ 👊
    

    View Slide

29. to B αʔϏεͷσόΠε؅ཧʹ͸՝୊͕ͨ͘͞Μʂ
    29
    ま dinii
    ま Apple dinii MDM
    Apple ID & Password
    OS
    

    View Slide

30. dinii Ͱͷӡ༻
    30
    ま N
    ほ toB
    

    View Slide

31. ຊ೔ͷ·ͱΊ
    31
    ま Expo OTA Update
    ま
    ま
    API
    😺
    

    View Slide