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
Expoで本番運用をしてみよう
Search
Yu Watanabe
September 13, 2018
Technology
2
1.1k
Expoで本番運用をしてみよう
Expoで本番運用をするときに必要なことをまとめてみました
Yu Watanabe
September 13, 2018
Tweet
Share
More Decks by Yu Watanabe
See All by Yu Watanabe
Bolt 🤝 Expo
watanabeyu
0
330
npm packageとリリースとモノレポ
watanabeyu
0
64
react-native-ffmpegを使って動画をいじくりmawasou
watanabeyu
0
940
react-native-unimodulesを用いてのApp内課金実装
watanabeyu
0
1.1k
gandhの紹介です
watanabeyu
0
35
XcodeやAndroid Studioを弄らないアイコン管理
watanabeyu
2
660
Firebaseオンリー + React Nativeでアプリを作ると果たして簡単になるのか?
watanabeyu
4
1.3k
react-native-unimodulesのススメ
watanabeyu
1
6.5k
JavaScript製npmパッケージをTypeScriptで書き直した話
watanabeyu
0
1.1k
Other Decks in Technology
See All in Technology
サラリーマンの小遣いで作るtoCサービス - Cloudflare Workersでスケールする開発戦略
shinaps
2
470
react-callを使ってダイヤログをいろんなとこで再利用しよう!
shinaps
2
270
共有と分離 - Compose Multiplatform "本番導入" の設計指針
error96num
2
1.2k
Create Ruby native extension gem with Go
sue445
0
130
開発者を支える Internal Developer Portal のイマとコレカラ / To-day and To-morrow of Internal Developer Portals: Supporting Developers
aoto
PRO
1
480
Rustから学ぶ 非同期処理の仕組み
skanehira
1
150
JTCにおける内製×スクラム開発への挑戦〜内製化率95%達成の舞台裏/JTC's challenge of in-house development with Scrum
aeonpeople
0
270
COVESA VSSによる車両データモデルの標準化とAWS IoT FleetWiseの活用
osawa
1
400
AWSを利用する上で知っておきたい名前解決のはなし(10分版)
nagisa53
10
3.2k
【NoMapsTECH 2025】AI Edge Computing Workshop
akit37
0
230
TS-S205_昨年対比2倍以上の機能追加を実現するデータ基盤プロジェクトでのAI活用について
kaz3284
1
230
メルカリIBISの紹介
0gm
0
410
Featured
See All Featured
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
32
1.6k
Why You Should Never Use an ORM
jnunemaker
PRO
59
9.5k
Scaling GitHub
holman
463
140k
Art, The Web, and Tiny UX
lynnandtonic
303
21k
Side Projects
sachag
455
43k
Building Flexible Design Systems
yeseniaperezcruz
329
39k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
8
530
Making the Leap to Tech Lead
cromwellryan
135
9.5k
How to Think Like a Performance Engineer
csswizardry
26
1.9k
How to train your dragon (web standard)
notwaldorf
96
6.2k
Rebuilding a faster, lazier Slack
samanthasiow
83
9.2k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
29
1.9k
Transcript
2018/09/13 ΘͨͳΏ͏ EXPOͰຊ൪ӡ༻Λͯ͠ΈΑ͏
▸ ࣗݾհ ▸ Expoͬͯ·͔͢ʁ ▸ ExpoͰͷຊ൪ӡ༻ ▸ ։ൃڥͱຊ൪ڥͷ͚ํ ▸ ଟݴޠରԠ
▸ ΤϥʔτϥοΩϯά ▸ CodePushతͳػೳͷ͍ํ ▸ ·ͱΊ ֓ཁ
ࣗݾհ(1) ΘͨͳΏ͏ ▸ ॴଐ ▸ גࣜձࣾg&h ▸ Web / ΞϓϦΛझຯͰެ։
▸ ࣄ༰ ▸ αʔό / ϑϩϯτ / ΞϓϦ / Web ▸ ΞΧϯτ ▸ Twitter : @hmktsu ▸ Github : @watanabeyu
ࣗݾհ(2) ▸ https://www.gandh.jp ▸ 3໊(ΤϯδχΞࣗҰਓ)ͰฏۉྸߴΊͷγχΞձࣾ ▸ ΤϯλϝܥʹಛԽͨ͠αʔϏεΛओʹӡӦ ▸ WeddyWeddy(ݱࡏࠐதͰ10݄ϦϦʔε༧ఆ) ▸
μϯαʔ͚ಈըϓϥοτϑΥʔϜ ▸ Spotful(ൢചཧళ) ▸ ΧφμൃΠϯλϥΫςΟϒಈըαʔϏε ▸ getstage(΄΅Ϋϩʔζ) ▸ ϛϡʔδγϟϯ/μϯαʔ/DJʹಛԽͨ͠ΦϯϥΠϯϚονϯάαʔϏε ▸ Partee(Ϋϩʔζ) ▸ ࣸਅσβΠϯΛΦϦδφϧάοζͱͯ͠࡞Ͱ͖ΔΞϓϦ ݱࡏWeddyWeddyΛϝΠϯʹνΣέϥονϣத
EXPOͰຊ൪ӡ༻Λͯ͠ΈΑ͏ Expoͬͯ·͔͢ʁ
▸ ExpoͬͯԿͳͷʁ ▸ શʹJSͷΈͰΞϓϦ͕࡞Մೳ(XcodeɺAndroid Studio͍Βͣ) ▸ ωΠςΟϒͳAPIΛExpo SDKͱͯ͠แׅ ▸ CodePushతͳͷ࠷ॳ͔Β͑Δ
▸ όʔδϣϯ্͕͕Δ͝ͱʹػೳ͕ͨ͘͞ΜՃ EXPOͬͯ·͔͢ʁ(1)
▸ Expoʹର͢Δෆ҆ͷ ▸ JSͷΈ͔͠৮Εͳ͍ͷͰ։ൃͰ͖ͳ͍ػೳ͕͋Δ ▸ react-native linkͰ͖ͳ͍͔Β֎෦ͷSDK͑ͳ͍ ▸ react-nativeຊମͷΞοϓσʔτʹ͙͢ʹରԠͰ͖ͳ͍ ▸
detach͢Δͷ͕ҋਂ͍ͱ͍͏͔͠ฉ͍ͨ͜ͱͳ͍ ▸ ຊ൪Ͱ͍ͬͯΔਓ͍Δͷʁ EXPOͬͯ·͔͢ʁ(2) Ҏલʹൃදͨ͠༰͕͋ΔͷͰͦͪΒΛࢀߟʹͲ͏ͧ ػೳຖʹϥΠϒϥϦͳͲͷհΛ͍ͯ͠·͢ https://speakerdeck.com/watanabeyu/shi-li-dejian-ruexpopurodakusiyonapuri (גࣜձࣾFACTBASE͞ΜͰͷษڧձʹͯൃද) ຊʹຊ൪Ͱެ։Ͱ͖ΔΑ͏ͳΞϓϦ࡞ͬͨͷʁ
EXPOͰຊ൪ӡ༻Λͯ͠ΈΑ͏ ExpoͰͷຊ൪ӡ༻
EXPOͰຊ൪ӡ༻Λͯ͠ΈΑ͏ ։ൃڥͱຊ൪ڥͷ͚ํ
▸ ຊ൪ӡ༻Λ͢Δʹ͋ͨͬͯ։ൃͱॾʑͷઃఆ͕ҧ͏ ▸ APIͷΤϯυϙΠϯτ ▸ firebaseͷΩʔใ ▸ ͳͲͳͲ… ։ൃڥͱຊ൪ڥͷ͚ํ(1) ▸
react-native-configΛ͏ ▸ .envϑΝΠϧΛ࡞ͯ͠Ϗϧυ࣌ʹࢦఆͯ͠ସ ▸ $ ENVFILE=.env.staging react-native run-ios ௨ৗͷReact Native։ൃͰͲ͏͢Δͷ͔ʁ
▸ 1. release-channelΛ͏ ▸ publish / build͢Δࡍʹ--release-channel <environment>Ͱସ ▸ Constants.manifest.releaseChannel
=== “environment”Ͱผ ։ൃڥͱຊ൪ڥͷ͚ํ(2) ExpoڥԼͰͲ͏ͨ͠ΒΑ͍ͷ͔ʁ EXPO.HOST exp publish —release-channel development development exp publish —release-channel production production
▸ 2. app.jsonΛγϯϘϦοΫϦϯΫͰସ ▸ app.development.json / app.production.jsonΛ࡞ ▸ publish /
build͢ΔࡍʹγϯϘϦοΫϦϯΫͰସ ▸ $ ln -fs app.development.json app.json && expo build:ios ▸ Constans.manifest.extra.hogeͱͯ͠औΓग़͠ ։ൃڥͱຊ൪ڥͷ͚ํ(3) ExpoڥԼͰͲ͏ͨ͠ΒΑ͍ͷ͔ʁ APP.DEVELOPMENT.JSON APP.JSON APP.PRODUCTION.JSON ln -fs app.development.json app.json ln -fs app.production.json app.json expo build:ios -release-channel <environment>
EXPOͰຊ൪ӡ༻Λͯ͠ΈΑ͏ ଟݴޠରԠ
▸ άϩʔόϧʹΞϓϦΛग़͍ͨ͠ ▸ Permission֬ೝ࣌ͷΞϥʔτจݴΛมߋ͍ͨ͠ ▸ ϗʔϜը໘ͰͷΞϓϦද໊ࣔΛݴޠ͝ͱʹมߋ͍ͨ͠ ▸ จݴΛݴޠ͝ͱʹมߋ͍ͨ͠ ▸ ͳͲͳͲ…
ଟݴޠରԠ(1) ▸ Xcode্ͰinfoPlistΛϩʔΧϥΠζͯ͠ઃఆ ▸ Android Studio্Ͱstrings.xmlΛϩʔΧϥΠζͯ͠ઃఆ ௨ৗͷReact Native։ൃͰͲ͏͢Δͷ͔ʁ
▸ 1. app.jsonͷlocalesΛͬͯύʔϛογϣϯμΠΞϩάΛมߋ ▸ ݴޠ͝ͱʹద༻͍ͤͨ͞infoPlistΛॻ͍ͨjsonͷύεΛࢦఆ ଟݴޠରԠ(2) ʙύʔϛογϣϯμΠΞϩάͳͲʙ ExpoڥԼͰͲ͏ͨ͠ΒΑ͍ͷ͔ʁ app.json languages/ja.json
▸ 2. ex-react-native-i18nΛͬͯΞϓϦͷจݴΛϩʔΧϥΠζ ▸ ͪͳΈʹreact-i18next༻Մೳ ଟݴޠରԠ(3) ʙΞϓϦจݴͷϩʔΧϥΠζʙ ExpoڥԼͰͲ͏ͨ͠ΒΑ͍ͷ͔ʁ src/i18n/ja.json src/i18n/en.json
src/i18n/index.js src/screens/HomeScreen.js
EXPOͰຊ൪ӡ༻Λͯ͠ΈΑ͏ ΤϥʔτϥοΩϯά
▸ ΞϓϦ͕Ϋϥογϡͨ͠ݪҼΛ୳Γ͍ͨ ▸ ωΠςΟϒίʔυ͕ݪҼͳͷ͔ʁ ▸ JSͰॻ͍ͨίʔυ͕ݪҼͳͷ͔ʁ ΤϥʔτϥοΩϯά(1) ▸ react-native-fabric(Crashlytics)Λ͏ ▸
react-native-sentryΛ͏ ௨ৗͷReact Native։ൃͰͲ͏͢Δͷ͔ʁ
▸ ωΠςΟϒίʔυ෦ExpoͰแׅͯ͠ΔͷͰແࢹ ▸ sentry-expoΛͬͯJS෦ͷΤϥʔτϥοΩϯάΛߦ͏ ΤϥʔτϥοΩϯά(2) ExpoڥԼͰͲ͏ͨ͠ΒΑ͍ͷ͔ʁ App.js app.json
EXPOͰຊ൪ӡ༻Λͯ͠ΈΑ͏ CodePushతͳػೳͷ͍ํ
▸ ΞϓϦετΞʹਃ͠ͳͯ͘ΞοϓσʔτΛ͢Δ͜ͱ͕Մೳ ▸ https://www.appcenter.ms CODEPUSHతͳػೳͷ͍ํ(1)
▸ σϑΥϧτͰONʹͳ͍ͬͯΔͷͰઃఆෆཁ ▸ app.jsonͷupdatesͱ͍͏߲Λฤू͢Δ͜ͱͰOFFʹͰ͖Δ ▸ publish͢Δ͜ͱͰελϯυΞϩʔϯΞϓϦ͕Ξοϓσʔτ͞ΕΔ CODEPUSHతͳػೳͷ͍ํ(2) ExpoڥԼͰͲ͏ͨ͠ΒΑ͍ͷ͔ʁ EXPO.HOST exp
publish —release-channel development exp publish —release-channel production development͕ߋ৽͞ΕΔ production͕ߋ৽͞ΕΔ ࠷ॳʹελϯυΞϩʔϯΞϓϦΛϏϧυͯ͠ ࣗͨͪʹ͓ͯ͘͠ͱ࣮ػ֬ೝ͕؆୯ʹ
·ͱΊ ▸ ڥͷସ ▸ -release-channelΛ͏ ▸ app.jsonΛγϯϘϦοΫϦϯΫͰΓସ͑ ▸ ଟݴޠରԠ ▸
γεςϜ෦app.jsonͷlocalesΛ༻ ▸ ΞϓϦจݴex-react-native-i18nΛ༻ ▸ ΤϥʔτϥοΩϯά ▸ JS෦ͷΈߦ͑Α͘sentryͷτϥοΩϯάίʔυΛsentry-expoͰຒΊࠐΉ ▸ CodePushతͳػೳσϑΥϧτͰON ▸ ࠷ॳʹελϯυΞϩʔϯΞϓϦΛ ▸ exp publishͰਵ࣌өͤ͞Δͱ࣮ػ֬ೝ͕؆୯ʹ
༨ஊ μϯαʔ͚ͷಈըϓϥοτϑΥʔϜΞϓϦ࡞ͬͯ·͢ͷͰ ڵຯ͋Δํ͠·͠ΐ͏ @ggtmtmgg͞Μͱ@AkiraTameto͞ΜͱҰॹʹ ExpoຊΛٕज़ॻల(10/8 ͏-71)Ͱग़͠·͢ ࠓճൃදͨ͠༰͋Γ·͢͠ೱ͍༰ͷ༧ఆͰ͢