「React Nativeで自社サービスのiOS/Androidアプリをリプレイスした話」 から2年経った今何を思うのか/techplay-mobile-cross-platform-lt-2020-07-15

Transcript

1. ʮReact NativeͰࣗࣾαʔϏεͷiOS/ AndroidΞϓϦΛϦϓϨΠεͨ͠࿩ʯ ͔Β2೥ܦͬͨࠓԿΛࢥ͏ͷ͔ ˏTECH PLAY 2020/07/15 גࣜձࣾιχοΫΨʔσϯ େ໺ߒ੣
2. ࣗݾ঺հ ✦ େ໺ߒ੣ʢͻΖ·͞ʣ ✦ 2015೥͔ΒιχοΫΨʔσϯ ✦ ϓϩάϥϚʔ / ސ໰CTO ✦ Rails / iOSωΠςΟϒ ✦ ੩Ԭݝ඿দࢢࡏॅ
3. ιχοΫΨʔσϯʹ͍ͭͯ ✦ डୗ։ൃத৺ɾࣗࣾαʔϏε΋ ✦ ϓϩάϥϚʔΛத৺ʹࣾһ50໊΄Ͳ ✦ ೲ඼ͷͳ͍डୗ։ൃ ❖ όʔνϟϧCTO ❖ ۀ຿ϋοΫ ✦ ϦϞʔτϫʔΫ
4. Remotty
5. ✦ 2017೥3݄ɿ։ൃ։࢝ ✦ 2017೥9݄ɿϦϦʔεʢچόʔδϣϯΛࠩ͠ସ͑ʣ ✦ 2018೥4݄ɿϒϩάʹ·ͱΊͨ ✦ ↑↑2೥લ RemottyͷΞϓϦΛReact NativeͰ
7. ✦ ྆OSͷωΠςΟϒ൛͕͋ͬͨ ✦ ϒϥ΢β൛ϝΠϯͷͨΊΞϓϦ༏ઌ౓௿Ί ✦ ઐۀͰ͸ͳ͍ ✦ React NativeͰαΫͬͱ΍ͬͯΈΑ͏ ओ୊1ɿReact Nativeબ୒ͷഎܠ ʢ˞2ʙ3೥લͷ࿩Ͱ͢ʣ
8. ✦ ։ൃମݧɺྑ͍ʂ☺ ❖ UIΛએݴతʹॻ͚ͯΊͬͪΌྑ͍☺ ❖ Code PushͰͷϦϦʔεͱͬͯ΋ศར☺ ❖ JSON APIͷ݁ՌΛͦͷ··ѻָ͑ͯͪΜ☺ ओ୊2ɿReact Native͓͓ΉͶྑ͔ͬͨ ʢ˞2ʙ3೥લͷ࿩Ͱ͢ʣ
9. ͋Ε͔Β2೥ޙͷࠓࢥ͏͜ͱ ʢ։ൃ͸͡Ί͔ͯΒ3೥ޙ…ʣ
10. ✦ ։ൃମݧɺྑ͍ʂ☺ ❖ UIΛએݴతʹॻ͚ͯΊͬͪΌྑ͍☺ ❖ Code PushͰͷϦϦʔεͱͬͯ΋ศར☺ ❖ JSON APIͷ݁ՌΛͦͷ··ѻָ͑ͯͪΜ☺ ։ൃ͸΍͸ΓָͪΜ ౰࣌ͱมΘΒͳ͍ؾ࣋ͪ
11. ϞόΠϧΞϓϦͷ໋॓
12. OS͕ਐԽ͢ΔͱΞϓϦ͕૬ରతʹѱ͘ͳΔ ✦ ͨͱ͑͹͜ΜͳରԠ͠·ͨ͠ ✦ iOS ❖ iPhone Xͷग़ݱʢSafeAreaͷߟྀ ✦ Android ❖ Google PlayͰͷ64bitରԠ
13. ✦ OSʹ௥ै͢Δʹ͸React NativeͷΞοϓσʔτ͕ඞਢ ✦ React NativeͷόʔδϣϯΛ্͛Δͱɺࢮ͵ ✦ ྫʣ ❖ 0.59ʹ͋͛ͨΒAndroidͷTextView͕όά͍ͬͯΔ ❖ →0.60ʹ͋͛ͨΒϏϧυͷ࢓૊Έ͕มΘΔ ❖ →΍ͬͱ௚ͨ͠Β࣮͸AndroidͷListView͕όάͬ…ʢҎԼུʣ ❖ 0.61ʹͨ͠ΒΑ͏΍͘ಈ͍ͨ Ξοϓσʔτܥ͕େมɾRNຊମฤ
14. ✦ αΫοͱ࡞ΔͨΊɺ࢖͑ͦ͏ͳϥΠϒϥϦ͸࢖༻ ❖ OAuthɹ ❖ ը૾ϐοΧʔ/ϦαΠζ ❖ Mentionઌબ୒UI ✦ ͜Ε΋ͳ͔ͳ͔ ❖ RNͷ࠷৽όʔδϣϯະରԠʢͦ΋ͦ΋ϝϯςࢭ·ͬͯΔ ‣ ผϥΠϒϥϦʹஔ͖׵͑ ‣ ϓϧϦΫ || fork Ξοϓσʔτܥ͕େมɾϥΠϒϥϦฤ
15. ֶͼ
16. RNͷ෼͚ͩϝϯςۀ͕૿͑Δ /BUJWF
    4%, ϥΠϒϥϦ ΞϓϦ 3FBDU
    /BUJWF ϥΠϒϥϦ ΞϓϦ /BUJWF
    4%, ωΠςΟϒΞϓϦ React Native ΞϓϦ ✦ NativeͷਐԽʹ൐͏ϝϯς ✦ React NativeͷਐԽʹ൐͏ϝϯςΒ ※ Expo͸3೥લ͙Β͍ʹͪΒͬͱ৮ͬͯҎདྷ࢖ͬͯ·ͤΜͷͰɺ൑அͰ͖·ͤΜ ✦ NativeͷਐԽʹ൐͏ϝϯς
17. ✦ ϝϯςφϯε͠΍͢͞Λҡ࣋ ❖ ઐۀͰͳ͍ͳΒͳ͓͞Β ✦ ͜·ΊʹΞοϓσʔτ͠Α͏ ❖ ϓϥοτϑΥʔϜͷਐԽʹ߹Θͤͳ͍ ✦ ϥΠϒϥϦ΁ͷґଘΛݮΒͦ͏ ❖ ಛʹୈࡾऀ੡ͷUIϥΠϒϥϦ͸… ϝϯςφϯεੑ > ։ൃମݧ
18. ࠓ΍ΔͳΒͲ͏͢Δʁ
19. ※ ΞϓϦͷಛੑʹΑΔͷͰࢲ/Remottyͷ৔߹ͱ͍͏͜ͱͰ… ✦ ϝΠϯը໘ʹ͸WebViewΛ࢖༻͢Δ ✦ Push௨஌ͳͲҰ෦ͷػೳ͸ωΠςΟϒͰ࣮૷͢Δ ✦ AndroidͰ͋Ε͹PWAͰ΋Մೳ ✦ Web։ൃͳͷͰɺ։ൃɾϦϦʔεָ͕ʢ1ຊԽʣ ✦ ωΠςΟϒ࣮૷ۃখͷͨΊɺϝϯςίετ௿͍ ωΠςΟϒ࣮૷ͷWebViewΞϓϦʹ͢Δ ↓
20. ͲΜͳ৔߹ʹ React NativeΛબͿ͔
21. ✦ React Nativeͷಛ௃ ❖ ։ൃମݧྑ͍ ❖ ೃછΈ͕͋ΔͰ͋Ζ͏JSͰͷ։ൃ ❖ ωΠςΟϒΞϓϦͷϓϥοτϑΥʔϜͷ࢓૊Έɾ؀ڥͷཧղ RNબ୒ͷϝϦοτ͸ґવͱͯ͋͠Δ
22. ✦ ϑϧλΠϜͰऔΓ૊ΊΔ৔߹ ✦ νʔϜͷਓ਺͕े෼ͳ৔߹ ✦ ϥΠϒϥϦͷϝϯςΛ͍ͱΘͳ͍৔߹ ✦ ʢϑϨʔϜϫʔΫΛࣗ෼ͨͪͰ௚ͤΔ৔߹ʣ ܧଓͯ͠ϝϯςφϯεͰ͖Δମ੍
23. ʮReact NativeͰࣗࣾαʔϏεͷiOS/ AndroidΞϓϦΛϦϓϨΠεͨ͠࿩ʯ ͔Β2೥ܦͬͨࠓԿΛࢥ͏ͷ͔ ˏTech Play 2020/07/15 גࣜձࣾιχοΫΨʔσϯ େ໺ߒ੣
24. ͋Γ͕ͱ͏͍͟͝·ͨ͠ ࣭໰͋Ε͹ͥͻ͓ئ͍͠·͢
25. ͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ Twitter: @pi_cha_n Facebook: hiromasa.ohno େ໺ ߒ੣ ʘൃചத!!ʗ גࣜձࣾιχοΫΨʔσϯ