Pro Yearly is on sale from $80 to $50! »

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

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

60952c750afeecd81999bd62e04d53cd?s=128

Hiromasa Ohno

July 15, 2020
Tweet

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Ͱ

  6. None
  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ͷ෼͚ͩϝϯςۀ͕૿͑Δ /BUJWF4%, ϥΠϒϥϦ ΞϓϦ 3FBDU/BUJWF ϥΠϒϥϦ ΞϓϦ /BUJWF4%, ωΠςΟϒΞϓϦ 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 େ໺ ߒ੣ ʘൃചத!!ʗ גࣜձࣾιχοΫΨʔσϯ