React Native Matsuri 2021

Transcript

1. Takeru Chuganji 2021/10/02 10:10‐10:50 ϝϧΧϦUS͕ϞόΠϧΞϓϦΛ React NativeͰ࡞Γ௚͍ͯ͠Δ࿩ React Native Matsuri 2021
2. Takeru Chuganji Software Engineer Mercari, Inc. chuganzy
5. Tokyo Japan Palo Alto / Portland / Boston United States
6. Tokyo Japan Palo Alto / Portland / Boston United States ϑϧ ϦϞʔτԽ
7. $15 $15 $15 $15 $15 $15 $15 $15 $15 $15 $15 $15 What are you looking for? Category Home Chat My Page Sell Search 2014 2017 2017 2018 2021
8. $15 $15 $15 $15 $15 $15 $15 $15 $15 $15 $15 $15 What are you looking for? Category Home Chat My Page Sell Search 2014 2017 2017 2018 2021 Objective-C, Swift, Java Swift, Java, Kotlin, React Native
9. $15 $15 $15 $15 $15 $15 $15 $15 $15 $15 $15 $15 What are you looking for? Category Home Chat My Page Sell Search 2014 2017 2017 2018 2021 Objective-C, Swift, Java Swift, Java, Kotlin, React Native ৽͍͠ ίʔυϕʔε
10. Double 2017.4-7 RewriteϓϩδΣΫτ
11. Double 2017.4-7 RewriteϓϩδΣΫτ ϏδωεࢦඪΛ “ഒ”ʹ͢Δ
12. Double Rewriteͷഎܠ US൛ϝϧΧϦΛࠜຊ͔Βߟ͑௚͠୹ظؒͰ࣮ݱ͢Δ US։ൃνʔϜͷ೔ຊνʔϜ͔Βͷಠཱ ٕज़ελοΫΛ࡮৽͠DXΛ޲্ͤ͞Δ US։ൃνʔϜͷΧϧνϟʔ࠶ߏஙɹͳͲ
13. ϗʔϜ ঎඼ৄࡉ ϓϩϑΟʔϧ ϨϏϡʔ
14. Native Native React Native React Native
15. Double NativeͱReact NativeͷHybridΞϓϦ Native ϗʔϜ / ݕࡧ / ঎඼ৄࡉ / ग़඼ / ߪೖ / ΢Σϒ / αΠϯΠϯ ͳͲ ϝΠϯ
 ಈత / ύϑΥʔϚϯε React Native ֤छઃఆ / ট଴ / औҾ / Ҿ͖མͱ͠ / ݸਓೝূ ͳͲ αϒ ੩త / ಠཱ
16. Double React NativeΛ࠾༻ͨ͠ཧ༝ ୯७ʹNative͚ͩͰ΍Δ ࣌ؒͱ ਓ͕଍Γͳ͔ͬͨ ։ൃظؒ 3ϲ݄ AndroidΤϯδχΞ 4ਓ iOSΤϯδχΞ 4ਓ
17. Double React NativeΛ࠾༻ͨ͠ཧ༝ ୯७ʹNative͚ͩͰ΍Δ ࣌ؒͱ ਓ͕଍Γͳ͔ͬͨ ։ൃظؒ 3ϲ݄ AndroidΤϯδχΞ 4ਓ iOSΤϯδχΞ 4ਓ ͦͷଞͷJavaScriptॻ͚Δਓ 4-6ਓ
18. Double Ϗδωεͷ੒௕ ϦϒϥϯσΟϯά Χʔτ ਅآೝূ Uberఏܞ഑ૹ ޙ෷͍ܾࡁɹͳͲ ʴ ਺ଟͷABςετ ྲྀ௨૯ֹ
19. Double Ϗδωεͷ੒௕ ϦϒϥϯσΟϯά Χʔτ ਅآೝূ Uberఏܞ഑ૹ ޙ෷͍ܾࡁɹͳͲ ʴ ਺ଟͷABςετ ྲྀ௨૯ֹ ଞʹ΋ ΍Γ͍ͨ͜ͱ͕ ࢁ΄Ͳʂ
20. Double Ұํ։ൃ໘Ͱ͸… ࠾༻೉ ߴΦϯϘʔσΟϯάίετ ߴίϛϡχέʔγϣϯίετ ߴϝϯςφϯείετ ߴϏϧυ࣌ؒ εϧʔϓοτʢงғؾʣ
21. Double Ұํ։ൃ໘Ͱ͸… ࠾༻೉ ߴΦϯϘʔσΟϯάίετ ߴίϛϡχέʔγϣϯίετ ߴϝϯςφϯείετ ߴϏϧυ࣌ؒ εϧʔϓοτʢงғؾʣ Scalabilityʹ ໰୊͋Γ
22. Double ঢ়گվળͷͨΊʹ 1ϓϥοτϑΥʔϜͷΈͰͷABςετ ڞ௨ϩδοΫͷNative ModuleԽ Πϯϑϥͷվળ Ϗϧυͷߴ଎Խ
23. Double ঢ়گվળͷͨΊʹ React NativeΞϓϦ ʹͨ͠Β͍͍ͷͰ͸ʁ ʢ2019/4ʣ 1ϓϥοτϑΥʔϜͷΈͰͷABςετ ڞ௨ϩδοΫͷNative ModuleԽ Πϯϑϥͷվળ Ϗϧυͷߴ଎Խ
24. React NativeΞϓϦԽʹ޲͚ͯ React NativeΞϓϦԽ͢Δํ๏ Refactoring
 طଘΞϓϦͷReact Native཰Λ૿΍͍ͯ͘͠ Rewrite
 ৽نͰΞϓϦΛॻ͖௚͢
25. React NativeΞϓϦԽʹ޲͚ͯ Refactoring vs Rewrite ن໛ ϦεΫ ظؒ ෛ୲ ೉қ౓ Refactoring த Rewrite ઈେ
26. React NativeΞϓϦԽʹ޲͚ͯ Refactoring vs Rewrite ن໛ ϦεΫ ظؒ ෛ୲ ೉қ౓ Refactoring த খ Rewrite ઈେ େ
27. React NativeΞϓϦԽʹ޲͚ͯ Refactoring vs Rewrite ن໛ ϦεΫ ظؒ ෛ୲ ೉қ౓ Refactoring த খ 3೥ʴ Rewrite ઈେ େ 1೥
28. React NativeΞϓϦԽʹ޲͚ͯ Refactoring vs Rewrite ن໛ ϦεΫ ظؒ ෛ୲ ೉қ౓ Refactoring த খ 3೥ʴ େ Rewrite ઈେ େ 1೥ த
29. React NativeΞϓϦԽʹ޲͚ͯ Refactoring vs Rewrite ن໛ ϦεΫ ظؒ ෛ୲ ೉қ౓ Refactoring த খ 3೥ʴ େ ߴ Rewrite ઈେ େ 1೥ த த
30. React NativeΞϓϦԽʹ޲͚ͯ Refactoring vs Rewrite ن໛ ϦεΫ ظؒ ෛ୲ ೉қ౓ Refactoring த খ 3೥ʴ େ ߴ Rewrite ઈେ େ 1೥ த த
31. React NativeΞϓϦԽʹ޲͚ͯ Refactoring vs Rewrite ن໛ ϦεΫ ظؒ ෛ୲ ೉қ౓ Refactoring த খ 3೥ʴ େ ߴ Rewrite ઈେ େ 1೥ த த
32. React NativeΞϓϦԽʹ޲͚ͯ Refactoring vs Rewrite ن໛ ϦεΫ ظؒ ෛ୲ ೉қ౓ Refactoring த খ 3೥ʴ େ ߴ Rewrite ઈେ େ 1೥ த த React Native ΞϓϦԽࣗମ͕ ΰʔϧͰ͸ͳ͍
33. React NativeΞϓϦԽʹ޲͚ͯ ͦ΋ͦ΋Ͱ͖Δͷ͔ʁ ࣮ݧΞϓϦ։ൃ / ٕज़ݕূ React NativeΛ࢖͍ͬͯΔձࣾ΁ͷώϠϦϯά React / Native྆ํͷ๛෋ͳ஌ࣝ ҆શͳϦϦʔεϓϥϯχϯά ଞΫϩεϓϥοτϑΥʔϜٕज़ͱͷൺֱɹͳͲ
34. React NativeΞϓϦԽʹ޲͚ͯ Flutterͱͷൺֱ طʹReact Nativeͷ஌͕ࣝ͋Δ JavaScript ύϑΥʔϚϯε΋े෼ʹΑ͘վળͷ༧ఆ͢Β͋Δ WebରԠ
35. Denali 2021.4- RewriteϓϩδΣΫτ
36. Denali 2021.4- RewriteϓϩδΣΫτ ΞϝϦΧͰ Ұ൪ߴ͍ࢁ
37. Denali ϞόΠϧνʔϜ૊৫ମ੍ iOS Android React Native Denali ʢRewriteʣ
38. Denali ϞόΠϧνʔϜ૊৫ମ੍ iOS Android React Native Denali ʢRewriteʣ
39. Denali ϞόΠϧνʔϜ૊৫ମ੍ iOS Android React Native Denali ʢRewriteʣ …
40. Denali ϞόΠϧνʔϜ૊৫ମ੍ iOS Android React Native Denali ʢRewriteʣ … ඞཁʹԠͯ͡ ੵۃతʹ ॿ͚߹͏
41. Denali ٕज़ελοΫ TypeScript Expo Redux Toolkit React Navigation fastlane Protocol Buffers Sentry ͳͲ GitHub Actions
42. Denali ൓লΛੜ͔ٕͨ͠ज़ํ਑ “؆୯” ͳίʔυΛॻ͘ υΩϡϝϯτΛੵۃతʹΞοϓσʔτ ࣾ಺ษڧձʢDiscussionʣΛຖि։࠵ σβΠϯγεςϜΛશ໘దԠ
43. Denali εέʔϧ͍ͯ͠Δ։ൃ ݩWebνʔϜϝϯόʔ ݩAPIνʔϜϝϯόʔ ݱiOS / AndroidνʔϜϝϯόʔ NativeະܦݧΤϯδχΞ࠾༻ ۀ຿ҕୗɹͳͲͷίϯτϦϏϡʔτ εϧʔϓοτʢงғؾʣ
44. Denali ϑΣʔζ Phase 1 Phase 2 Phase 3 Phase 4
45. Denali ϑΣʔζ Phase 1 Phase 2 Phase 3 Phase 4 ج൫ ओཁը໘ νέοτચ͍ग़͠
46. Denali ϑΣʔζ Phase 1 Phase 2 Phase 3 Phase 4 ج൫ ओཁը໘ νέοτચ͍ग़͠ ඞਢػೳͷ׬੒ ࣾ಺ςετ։࢝
47. Denali ϑΣʔζ Phase 1 Phase 2 Phase 3 Phase 4 ج൫ ओཁը໘ νέοτચ͍ग़͠ ඞਢػೳͷ׬੒ ࣾ಺ςετ։࢝ αϒͷػೳ ݱߦΞϓϦͱͷࠩ෼ ݱߦ։ൃͷ
 εϩʔμ΢ϯ
48. Denali ϑΣʔζ Phase 1 Phase 2 Phase 3 Phase 4 ج൫ ओཁը໘ νέοτચ͍ग़͠ ඞਢػೳͷ׬੒ ࣾ಺ςετ։࢝ αϒͷػೳ ݱߦΞϓϦͱͷࠩ෼ ݱߦ։ൃͷ
 εϩʔμ΢ϯ ϑΣʔζϦϦʔεͷ ։࢝ ෆ۩߹मਖ਼ 100%ϦϦʔε΁ʂ
49. Denali ϑΣʔζ Phase 1 Phase 2 Phase 3 Phase 4 ج൫ ओཁը໘ νέοτચ͍ग़͠ ඞਢػೳͷ׬੒ ࣾ಺ςετ։࢝ αϒͷػೳ ݱߦΞϓϦͱͷࠩ෼ ݱߦ։ൃͷ
 εϩʔμ΢ϯ ϑΣʔζϦϦʔεͷ ։࢝ ෆ۩߹मਖ਼ 100%ϦϦʔε΁ʂ
50. Denali ϑΣʔζ Phase 1 Phase 2 Phase 3 Phase 4 ج൫ ओཁը໘ νέοτચ͍ग़͠ ඞਢػೳͷ׬੒ ࣾ಺ςετ։࢝ αϒͷػೳ ݱߦΞϓϦͱͷࠩ෼ ݱߦ։ൃͷ
 εϩʔμ΢ϯ ϑΣʔζϦϦʔεͷ ։࢝ ෆ۩߹मਖ਼ 100%ϦϦʔε΁ʂ νέοτ શମͷ60%ۙ͘ ফԽࡁΈ
51. 2022 AndroidϩʔϧΞ΢τ։࢝༧ఆʂ
52. React Nativeޙ ΤϯδχΞ૊৫ͱͯ͠໨ࢦ͢ઌ React NativeίϛϡχςΟ΁ͷߩݙ Ҿ͖ଓ͖ “ෑډ” Λ௿͘͢Δ “Pods”ʢʹখ͍͞νʔϜʣͰ
 ΍Γ͍ͨ͜ͱΛͳΊΒ͔ʹ࣮ߦ͢Δ ΤϯδχΞ΋ੵۃతʹΞΠσΟΞΛग़͢
53. React Nativeޙ ΤϯδχΞ૊৫ͱͯ͠໨ࢦ͢ઌ React NativeίϛϡχςΟ΁ͷߩݙ Ҿ͖ଓ͖ “ෑډ” Λ௿͘͢Δ “Pods”ʢʹখ͍͞νʔϜʣͰ
 ΍Γ͍ͨ͜ͱΛͳΊΒ͔ʹ࣮ߦ͢Δ ΤϯδχΞ΋ੵۃతʹΞΠσΟΞΛग़͢ ຖ೔͕ ϋοΧιϯঢ়ଶʹ ͳΔ!?
54. શ໘తɾੵۃతʹ࠾༻த
55. We are hiring! શΤϯδχΞੵۃ࠾༻த US / JPͱ΋ʹ࠾༻த React Native Engineer iOS Engineer Android Engineer API EngineerɹͳͲͳͲ