React NativeからNativeアプリへ ~スタートアップ企業における「機能開発と保守性担保」の両立への挑戦~

by 株式会社ビットキー / Bitkey Inc.

Slide 1

Slide 1 text

3FBDU/BUJWF͔Β/BUJWFΞϓϦ΁ dελʔτΞοϓاۀʹ͓͚Δ   ʮػೳ։ൃͱอकੑ୲อʯͷཱ྆΁ͷ௅ઓd 4IPHP4BJUP

Slide 2

Slide 2 text

0VUMJOF 1. workhubʹ͍ͭͯ 2. ελʔτΞοϓʹ͓͚Δ  ιϑτ΢ΣΞ։ൃʹٻΊΒΕΔ΋ͷ 3. ؇΍͔ͳNativeԽ 4. NativeԽʹΑΓ  ಘΒΕͨ΋ͷ / ೉͔ͬͨ͠఺

Slide 3

Slide 3 text

ࡈ౻঑ޛ 4IPHP4BJUP גࣜձࣾϫʔΫεΞϓϦέʔγϣϯζʹೖࣾ &$ύοέʔδͷ$.4ྖҬͷ։ൃͳͲΛ୲౰ ϏοτΩʔʹೖࣾ ϞόΠϧΞϓϦʮCJUMPDLʯͷ্ཱͪ͛ɾ࣮૷Λ୲౰ CJULFZQMBUGPSNνʔϜ΁ҟಈ إೝূٕज़Λར༻ͨ͠ΞϓϦέʔγϣϯ։ൃͳͲʹ ܞΘΔ ϞόΠϧΞϓϦʮXPSLIVCʯͷ νʔϜϚωʔδϟʔͱͯ͠։ൃʹܞΘΔ

Slide 4

Slide 4 text

workhubʹ͍ͭͯ

Slide 5

Slide 5 text

1. workhubʹ͍ͭͯ

Slide 6

Slide 6 text

ελʔτΞοϓʹ͓͚Δ ιϑτ΢ΣΞ։ൃʹٻΊΒΕΔ΋ͷ

Slide 7

Slide 7 text

2.ɹελʔτΞοϓʹ͓͚Διϑτ΢ΣΞ։ൃʹٻΊΒΕΔ΋ͷ 0→1Λ૑଄͢ΔͨΊͷεϐʔυײΛ࣋ͬͨػೳ։ൃ 1→10ʹ͢Δʹ͋ͨͬͯาΈΛࢭΊͳ͍ͨΊͷอकੑͷ୲อ

Slide 8

Slide 8 text

ʮอकੑʯʹ͍ͭͯ ෆ۩߹ΛຒΊࠐΈʹ͘͘͢ΔͨΊͷ΋ͷ ෆ۩߹ൃੜ࣌ͷӨڹൣғΛ෼͔Γ΍͘͢͢ΔͨΊͷ΋ͷ ɹকདྷʹΘͨͬͯ҆શͳػೳ։ൃΛ͠΍͘͢͢Δ  ܧଓతʹ߈ΊΔɾվળ͢ΔͨΊʹඞཁͳ΋ͷ ˠ 2.ɹελʔτΞοϓʹ͓͚Διϑτ΢ΣΞ։ൃʹٻΊΒΕΔ΋ͷ

Slide 9

Slide 9 text

bitlockApp workhubApp 2.ɹελʔτΞοϓʹ͓͚Διϑτ΢ΣΞ։ൃʹٻΊΒΕΔ΋ͷ

Slide 10

Slide 10 text

2.ɹελʔτΞοϓʹ͓͚Διϑτ΢ΣΞ։ൃʹٻΊΒΕΔ΋ͷ

Slide 11

Slide 11 text

͜ͷΞϓϦͷอकੑΛܧଓతʹҡ࣋͢Δʹ͸Ͳ͏ͨ͠ΒΑ͍͔ʁ 2.ɹελʔτΞοϓʹ͓͚Διϑτ΢ΣΞ։ൃʹٻΊΒΕΔ΋ͷ

Slide 12

Slide 12 text

/BUJWFԽΛߟҊͨͭ͠ͷཧ༝ ɾiOSUpdate΁ͷ௥ैੑͷ՝୊ײ 2.ɹελʔτΞοϓʹ͓͚Διϑτ΢ΣΞ։ൃʹٻΊΒΕΔ΋ͷ

Slide 13

Slide 13 text

/BUJWFԽΛߟҊͨͭ͠ͷཧ༝ ɾiOSUpdate΁ͷ௥ैੑͷ՝୊ײ ɾۃྗϥΠϒϥϦʹґଘ͠ͳ͍ٕज़ར༻ 2.ɹελʔτΞοϓʹ͓͚Διϑτ΢ΣΞ։ൃʹٻΊΒΕΔ΋ͷ

Slide 14

Slide 14 text

/BUJWFԽΛߟҊͨͭ͠ͷཧ༝ ɾiOSUpdate΁ͷ௥ैੑͷ՝୊ײ ɾۃྗϥΠϒϥϦʹґଘ͠ͳ͍ٕज़ར༻ ɾBuild࣌ؒͷ஗͞ 2.ɹελʔτΞοϓʹ͓͚Διϑτ΢ΣΞ։ൃʹٻΊΒΕΔ΋ͷ

Slide 15

Slide 15 text

/BUJWFԽΛߟҊͨͭ͠ͷཧ༝ ɾiOSUpdate΁ͷ௥ैੑͷ՝୊ײ ɾۃྗϥΠϒϥϦʹґଘ͠ͳ͍ٕज़ར༻ ɾBuild࣌ؒͷ஗͞ ɾAndroidΞϓϦͷLaunchʹ͸࣌ؒత༛༧͕͋ͬͨ 2.ɹελʔτΞοϓʹ͓͚Διϑτ΢ΣΞ։ൃʹٻΊΒΕΔ΋ͷ

Slide 16

Slide 16 text

XPSLIVC"QQͷ/BUJWFԽʹ͍ͭͯ બ୒ࢶ͸2ͭ 2.ɹελʔτΞοϓʹ͓͚Διϑτ΢ΣΞ։ൃʹٻΊΒΕΔ΋ͷ

Slide 17

Slide 17 text

XPSLIVC"QQͷ/BUJWFԽʹ͍ͭͯ બ୒ࢶ͸2ͭ ɾϑϧNativeͰ1͔ΒผΞϓϦͱͯ͠࡞Γ௚͢ 2.ɹελʔτΞοϓʹ͓͚Διϑτ΢ΣΞ։ൃʹٻΊΒΕΔ΋ͷ

Slide 18

Slide 18 text

XPSLIVC"QQͷ/BUJWFԽʹ͍ͭͯ બ୒ࢶ͸2ͭ ɾϑϧNativeͰ1͔ΒผΞϓϦͱͯ͠࡞Γ௚͢ ɾطଘReact NativeΞϓϦΛঃʑʹNativeԽ͢Δ 2.ɹελʔτΞοϓʹ͓͚Διϑτ΢ΣΞ։ൃʹٻΊΒΕΔ΋ͷ

Slide 19

Slide 19 text

౰࣌ͷνʔϜ؀ڥʹ͍ͭͯ ɾ։ൃର৅͸workhubAppͷΈ ɾ։ൃϝϯόʔ͸3໊ XPSLIVC"QQͷ/BUJWFԽʹ͍ͭͯ 2.ɹελʔτΞοϓʹ͓͚Διϑτ΢ΣΞ։ൃʹٻΊΒΕΔ΋ͷ

Slide 20

Slide 20 text

؇΍͔ͳNativeԽ

Slide 21

Slide 21 text

/BUJWFԽͷํ๏࿦ U ػ ೳ ։ ൃ ͷ ݴ ޠ ׂ ߹ React Native Swift 3.ɹ ؇΍͔ͳNativeԽ

Slide 22

Slide 22 text

/BUJWFԽͷํ๏࿦ U ػ ೳ ։ ൃ ͷ ݴ ޠ ׂ ߹ React Native Swift शಘظ 3.ɹ ؇΍͔ͳNativeԽ

Slide 23

Slide 23 text

/BUJWFԽͷํ๏࿦ U ػ ೳ ։ ൃ ͷ ݴ ޠ ׂ ߹ React Native Swift शಘظ शख़ظ 3.ɹ ؇΍͔ͳNativeԽ

Slide 24

Slide 24 text

/BUJWFԽͷํ๏࿦ 1. ϏδωεϩδοΫΛSwiftʹدͤΔ 1. ػೳͷগͳ͍ը໘͸ը໘͝ͱSwiftUIʹϦϓϨΠε 1. ػೳ͕ෳࡶͳը໘͸ίϯϙʔωϯτ୯ҐͰ  SwiftUIʹϦϓϨΠε 3.ɹ ؇΍͔ͳNativeԽ

Slide 25

Slide 25 text

+BWB4DSJQU 3FBDU/BUJWF #SJEHF #VTJOFTT -PHJD 3.ɹ ؇΍͔ͳNativeԽ

Slide 26

Slide 26 text

+BWB4DSJQU axios 3.ɹ ؇΍͔ͳNativeԽ

Slide 27

Slide 27 text

+BWB4DSJQU 3FBDU/BUJWF #SJEHF #VTJOFTT -PHJD axios Alamofire 3.ɹ ؇΍͔ͳNativeԽ

Slide 28

Slide 28 text

+BWB4DSJQU 3FBDU /BUJWF #SJEHF 3$57JFX .BOBHFS 4XJGU6*7JFX 3.ɹ ؇΍͔ͳNativeԽ

Slide 29

Slide 29 text

workhubApp workhubApp 3.ɹ ؇΍͔ͳNativeԽ

Slide 30

Slide 30 text

NativeԽʹΑΓ ಘΒΕͨ΋ͷ / ೉͔ͬͨ͠఺

Slide 31

Slide 31 text

؇΍͔ͳ/BUJWFԽΛ͢Δ͜ͱͰಘΒΕͨ΋ͷ ɾBLE΍NFCɾإೝࣝͳͲͷػೳ܈ΛReact NativeͷϥΠϒϥϦʹ Ұ੾པΒ࣮ͣ૷ ɾϥΠϒϥϦͷSwiftPackageManagerҠߦ: 4ׂ΄Ͳ  → ͜ΕʹΑΓBuild࣌ؒΛ20෼΄Ͳ·ͰʹॖΊΔ͜ͱʹ੒ޭ 4.ɹ NativeԽʹΑΓಘΒΕͨ΋ͷ

Slide 32

Slide 32 text

/BUJWFԽΛਐΊ্͍ͯ͘Ͱো֐ͱͳͬͨ΋ͷ ɾϥΠϒϥϦҠߦʹ෇͍ͯճΔσάϨͷةݥੑ ɾSwiftUIಛ༗ͷUI࡞੒ͷ೉͠͞΍ෆ۩߹΁ͷରॲ ɾSwiftUIͷΈͰ͸࡞Γਏ͍UI 4.ɹ NativeԽʹ͓͍ͯ೉͔ͬͨ͠఺

Slide 33

Slide 33 text

࣌ܥྻͰͷৼΓฦΓ SwiftUI औΓࠐΈ։࢝ 4.ɹ NativeԽʹΑΓಘΒΕͨ΋ͷ Bridgeύλʔϯ ࢼߦظ NativeԽઓུ ࿅Γ࢝Ί ৽ن։ൃΛ SwiftUIʹҠߦ طଘViewͷSwiftUI ஔ׵ Concurrency ରԠ

Slide 34

Slide 34 text

ϓϩμΫτͱνʔϜʹ߹ͬͨख๏Λ࿅Δ͜ͱͰ ػೳ։ൃͱอकੑ୲อͷཱ྆͸ୡ੒Մೳ 4.ɹ ·ͱΊ