Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
React Native CodePush in Wantedly
Search
Yuki YAMADA
May 29, 2018
Technology
1
1k
React Native CodePush in Wantedly
Roppongi.js #3 で発表しました。Microsoft の提供する React Native CodePush についてです。
Yuki YAMADA
May 29, 2018
Tweet
Share
More Decks by Yuki YAMADA
See All by Yuki YAMADA
Frontend Engineering at Wantedly
yamadayuki
5
37k
Actor Model in Reason
yamadayuki
0
1.1k
React with Reason
yamadayuki
1
670
Wantedlyの新卒研修
yamadayuki
1
3.4k
Introduction to Flow
yamadayuki
0
470
Other Decks in Technology
See All in Technology
Amazon Q Developerの無料利用枠を使い倒してHello worldを表示させよう!
nrinetcom
PRO
2
110
Oracle Database Technology Night #87-1 : Exadata Database Service on Exascale Infrastructure(ExaDB-XS)サービス詳細
oracle4engineer
PRO
1
170
Perlの生きのこり - エンジニアがこの先生きのこるためのカンファレンス2025
kfly8
2
270
AI Agent時代なのでAWSのLLMs.txtが欲しい!
watany
2
220
OCI Success Journey OCIの何が評価されてる?疑問に答える事例セミナー(2025年2月実施)
oracle4engineer
PRO
2
130
OSS構成管理ツールCMDBuildを使ったAWSリソース管理の自動化
satorufunai
0
630
スキルだけでは満たせない、 “組織全体に”なじむオンボーディング/Onboarding that fits “throughout the organization” and cannot be satisfied by skills alone
bitkey
0
170
組織におけるCCoEの役割とAWS活用事例
nrinetcom
PRO
4
120
開発組織を進化させる!AWSで実践するチームトポロジー
iwamot
1
340
脳波を用いた嗜好マッチングシステム
hokkey621
0
280
OPENLOGI Company Profile
hr01
0
60k
EMConf JP 2025 懇親会LT / EMConf JP 2025 social gathering
sugamasao
2
190
Featured
See All Featured
Git: the NoSQL Database
bkeepers
PRO
427
65k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
The Power of CSS Pseudo Elements
geoffreycrofte
75
5.5k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
160
15k
VelocityConf: Rendering Performance Case Studies
addyosmani
328
24k
Site-Speed That Sticks
csswizardry
4
400
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
129
19k
Into the Great Unknown - MozCon
thekraken
35
1.6k
Automating Front-end Workflow
addyosmani
1368
200k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
47
5.2k
Typedesign – Prime Four
hannesfritz
40
2.5k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
507
140k
Transcript
©2018 Wantedly, Inc. React Native CodePush Roppongi.js #3 29.Mar.2018 -
Yamada Yuki
©2018 Wantedly, Inc. Yuki Yamada @yamadayuki I’m an Engineer @
Wantedly I write JS, Golang, Ruby … etc. Now I focus on Frontend Engineering at Feed squad.
©2018 Wantedly, Inc. React Native CodePush ͷΛ͠·͢
©2018 Wantedly, Inc. 1. React Native / CodePush ͱ 2.
CodePush ͷಋೖഎܠɾํ๏ 3. CodePush ͷதͷͳ͠ ࣍
©2018 Wantedly, Inc. React Native / CodePush ͱ
©2018 Wantedly, Inc. React Native React Ͱهड़Ͱ͖Δ View ϥΠϒϥϦ iOS
/ Android ͷදࣔͷ෦Λ React ͷදݱํ๏Λ ͍͍ͬͯײ͡ʹهड़Ͱ͖ΔϥΠϒϥϦɻදࣔͷ෦ ͚ͩͰͳ͘ɺϩδοΫͷ෦JSͰهड़Ͱ͖Δ ͷͰɺॏཁͳϏδωεϩδοΫͷ෦Λ iOS / Android ྆ํͰڞ௨ԽͰ͖Δ͜ͱ͕Մೳʹͳͬͨੌ ͍ͭɻؤுΕΣϒͱͷڞ௨ԽՄೳɻ
©2018 Wantedly, Inc. CodePush React Native ෦Λૉૣ͘ఏڙͰ͖Δ Microsoft ͕ఏڙ͢Δ Visual
Studio App Center ͷ ػೳͷҰͭɻReact Native Cordova ͷ JS ෦ ΛϓϥοτϑΥʔϜͷ৹ࠪແ͠ͰมߋͰ͖Δπʔϧɻ React Native ༻ͷ HOC ༻ҙ͞Ε͍ͯͯɺҰಋ ೖͯ͠ϨʔϧΛෑ͚ૉૣ͍ΠςϨʔγϣϯͰ։ൃ ΛਐΊΔ͜ͱ͕Ͱ͖Δͣɻ
©2018 Wantedly, Inc. CodePush ͷಋೖഎܠɾํ๏
©2018 Wantedly, Inc. CodePush ͷಋೖഎܠ Feed νʔϜͱͯ͠ Wantedly ͷ iOS
ΞϓϦʹ৽͍͠ػೳΛ࡞Γ͔ͨͬͨɻ -> Ͱ User Growth νʔϜผͷػೳ։ൃΛ͍ͯ͠ΔͷͰ iOS ΤϯδχΞ͕͍ͳ͍ɻ -> ͔͠৽͍͠ػೳ࣮ݧΛ͍Ζ͍Ζ͍͖͍ͯͨ͠ɻ React Native / CodePush ΛͬͨΒղܾͰ͖ͦ͏
©2018 Wantedly, Inc. CodePush ಋೖํ๏ Πϯετʔϧ `yarn add react-native-code-push` ࠓճطଘΞϓϦʹಋೖ͢Δ͜ͱʹͳ͍ͬͯͨͷͰɺ
node module ΛΠϯετʔϧͨ͠ͷͪɺ CocoaPods Ͱཧ͢Δඞཁ͕͋ͬͨɻ
©2018 Wantedly, Inc. CodePush ಋೖํ๏ codePush HOC CodePush appcenter
ʹରͯ͠৽͍͠Ϗϧυ͕ ଘࡏ͢Δ͔Λ֬ೝͯ͠ɺ͋ͬͨΒμϯϩʔυ͖ͯ͠ ͍͍ͯλΠϛϯάͰ jsbundle ϑΝΠϧΛஔ͖͑ ΔɻͦΕΛఏڙ͢ΔHOC ͰίϯϙʔωϯτΛ wrap ͢Δɻ
©2018 Wantedly, Inc. CodePush ಋೖํ๏ σϓϩΠ appcenter CLI ΛͬͯσϓϩΠ͢Δɻ Visual
Studio App Center ʹσϓϩΠͨ͠Βɺ CodePush Λಋೖͨ͠ React Native ΞϓϦ͕֬ೝ ͯ͠৽͍͠ίʔυΛऔಘ͢ΔΑ͏ʹͳ͍ͬͯΔ
©2018 Wantedly, Inc. CodePush ͷಋೖഎܠ Feed νʔϜͱͯ͠ Wantedly ͷ iOS
ΞϓϦʹ৽͍͠ػೳΛ࡞Γ͔ͨͬͨɻ -> Ͱ User Growth νʔϜผͷػೳ։ൃΛ͍ͯ͠ΔͷͰ iOS ΤϯδχΞ͕͍ͳ͍ɻ -> ͔͠৽͍͠ػೳ࣮ݧΛ͍Ζ͍Ζ͍͖͍ͯͨ͠ɻ React Native / CodePush ΛͬͨΒղܾͰ͖ͦ͏ -> ߦ͚ͦ͏
©2018 Wantedly, Inc. CodePush ͷதͷͳ͠
©2018 Wantedly, Inc. CodePush தͷͳ͠ Ͳ͏ͬͯಈ͍ͯΔͷ͔ https://github.com/Microsoft/react-native- code-push/blob/ dea708813f14f1aba6d464f46e7a1883d1a491da/ CodePush.js
ΛಡΜͰΈΔ `codePushfy` ͱ `NativeCodePush` ͕ॏཁɻ
©2018 Wantedly, Inc. CodePush தͷͳ͠
©2018 Wantedly, Inc. CodePush தͷͳ͠
©2018 Wantedly, Inc. CodePush தͷͳ͠
©2018 Wantedly, Inc. CodePush தͷͳ͠
©2018 Wantedly, Inc. CodePush தͷͳ͠
©2018 Wantedly, Inc. CodePush தͷͳ͠ NativeCodePush Native ͷ bridge ͕٧·ͬͨ
moduleɻ `ios/CodePush/CodePush.m` ͱ͔ʹͦΕͧΕ ͷϓϥοτϑΥʔϜͷ࣮͕͋ΔɻͦΕ͕ React Native ͷ NativeModule ͱ͍͏ػೳͰ OS ͷڍ ಈΛJS ଆ͔ΒݺΔΑ͏ʹ expose ͞Ε͍ͯΔɻ ࠷৽ͷϏϧυΛ֬ೝ͢Δͱ͖ͱ͔ʹར༻͞ΕΔɻ
©2018 Wantedly, Inc. NativeCodePush ͷத JS͡Όͳ͍ͷͰͳ͠·ͤΜ Feed ʹϒϩάΛॻ͖·͢ɻ CodePush தͷͳ͠
©2018 Wantedly, Inc. ·ͱΊ WebΤϯδχΞͰ CodePush ͷಋೖͳΜͱ͔Ͱ͖ͨ CodePush ӡ༻͑͞Ͱ͖Ε͍͍πʔϧʹͳΔ React
Native Λͬͯૉૣ࣮͘ݧΛ͢Δ͕Ͱ͖ͨ
©2018 Wantedly, Inc. Enjoy