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 Expoで行うアプリの簡単最速運用
Search
Yu Watanabe
February 27, 2019
Programming
0
330
React Native Expoで行うアプリの簡単最速運用
Expoの利点を最大限使うためにcircleciを使いましょう的なお話です。
さらに自分が作ったexpo-qr-notifyというのを使えばもっと開発運用が楽になります的なお話です。
Yu Watanabe
February 27, 2019
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 Programming
See All in Programming
CloudflareのChat Agent Starter Kitで簡単!AIチャットボット構築
syumai
2
500
基礎から学ぶ大画面対応(Learning Large-Screen Support from the Ground Up)
tomoya0x00
0
3.2k
チームのテスト力を鍛える
goyoki
3
680
請來的 AI Agent 同事們在寫程式時,怎麼用 pytest 去除各種幻想與盲點
keitheis
0
120
🔨 小さなビルドシステムを作る
momeemt
4
690
AIと私たちの学習の変化を考える - Claude Codeの学習モードを例に
azukiazusa1
10
4.3k
Namespace and Its Future
tagomoris
6
700
アプリの "かわいい" を支えるアニメーションツールRiveについて
uetyo
0
270
AIでLINEスタンプを作ってみた
eycjur
1
230
もうちょっといいRubyプロファイラを作りたい (2025)
osyoyu
1
450
意外と簡単!?フロントエンドでパスキー認証を実現する WebAuthn
teamlab
PRO
2
770
知っているようで知らない"rails new"の世界 / The World of "rails new" You Think You Know but Don't
luccafort
PRO
1
180
Featured
See All Featured
GitHub's CSS Performance
jonrohan
1032
460k
Writing Fast Ruby
sferik
628
62k
Documentation Writing (for coders)
carmenintech
74
5k
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
46
7.6k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
8
530
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
285
13k
Done Done
chrislema
185
16k
Being A Developer After 40
akosma
90
590k
Reflections from 52 weeks, 52 projects
jeffersonlam
352
21k
Measuring & Analyzing Core Web Vitals
bluesmoon
9
580
The Power of CSS Pseudo Elements
geoffreycrofte
77
6k
Transcript
2019/02/27 ΘͨͳΏ͏ REACT NATIVE EXPOͰߦ͏ΞϓϦͷ؆୯࠷ӡ༻
▸ ࣗݾհ ▸ React Native Expoͱ ▸ ExpoΛ͏ϝϦοτ/σϝϦοτ ▸ ։ൃӡ༻Λૉૣ͘؆୯ʹߦ͏ͨΊʹ
▸ circleciͷಋೖ ▸ expo-qr-notifyͷಋೖ ▸ ·ͱΊ ֓ཁ
ࣗݾհ(1) ΘͨͳΏ͏ ▸ ॴଐ ▸ גࣜձࣾg&h ▸ Web / ΞϓϦΛझຯͰެ։
▸ ࣄ༰ ▸ αʔό / ϑϩϯτ / ΞϓϦ / Web ▸ ΞΧϯτ ▸ Twitter : @hmktsu ▸ Github : @watanabeyu ࣮ફExpo͍ͬͯ͏ຊΛڞஶͰ201812݄ʹग़൛
ࣗݾհ(2) ▸ https://www.gandh.jp ▸ 3໊(ΤϯδχΞࣗҰਓ)Ͱฏۉྸ30ͷγχΞձࣾ ▸ ετϦʔτΧϧνϟʔ × ITͳαʔϏεΛӡӦ ▸
ݱࡏͷϝΠϯࣄۀɿhttps://www.weddyweddy.net ▸ μϯαʔ͚ͷϓϥοτϑΥʔϜܥSNSΞϓϦ ▸ ͪ͜ΒͰνϣΠεͨ͠གྷΓ͍͢30ඵఔͷۂͰགྷͬͯಈըΛΞοϓ
REACT NATIVE EXPOͰߦ͏ΞϓϦͷ؆୯࠷ӡ༻ React Native Expoͱ
REACT NATIVE EXPOͱ(1) ▸ React NativeΛݶΓͳ͘web։ൃʹ͚ۙͮΔͨΊͷͷ ▸ XcodeAndroid Studio͕ෆཁ ▸
JavaScriptͷΈͰ࡞Δ͜ͱ͕Մೳ
REACT NATIVE EXPOͱ(2) ▸ σόοάʹExpo Clientͱ͍͏ΞϓϦΛ֤ετΞ͔Βμϯϩʔυ ▸ ಉҰωοτϫʔΫ / ಉҰϩάΠϯΞΧϯτͰ࣮ߦՄೳ
▸ ΄ͱΜͲͷͰγʔϜϨεʹσόοΫՄೳ
REACT NATIVE EXPOͱ(3) ▸ Expo SnackͰWebϒϥβ্Ͱࢼ͢͜ͱ͕Մೳ ▸ ExpoΞΧϯτʹಉظͰ͖Δ ▸ γϛϡϨʔλଐͯ͠ΔͷͰϒϥβͷΈͰ։ൃ͕Մೳ
REACT NATIVE EXPOͱ(4) ▸ ओཁͳػೳʹରԠ ▸ Χϝϥ ▸ ԻಈըΛ࠶ੜը(Ի)ͨ͠ΓɺϝσΟΞϥΠϒϥϦͷΞΫηε ▸
֤छηϯαʔܥ ▸ ͳͲͳͲ ΄΅΄΅ͷΞϓϦ։ൃʹඞཁͳػೳʹରԠ
REACT NATIVE EXPOͱ(5) ▸ CodePushͷΑ͏ͳOTAΞοϓσʔτʹඪ४ରԠ ▸ configڥ͝ͱʹ؆୯ʹઃఆՄೳ ▸ app.jsonrelease-channelΛϏϧυຖʹมߋՄೳ ▸
ΞϓϦΛϏϧυ͢Δࡍͷূ໌ॻؔ࿈ΛExpoͰཧͯ͘͠ΕΔ EXPO.HOST —config app.development.json release-channel=development -config app.production.json —release-channel=production ɾiOS Distribution ɾAPNs iOS ɾiOS Development ɾAndroid KeyStore
REACT NATIVE EXPOͰߦ͏ΞϓϦͷ؆୯࠷ӡ༻ ExpoΛ͏ϝϦοτ/σϝϦοτ
EXPOΛ͏ϝϦοτ/σϝϦοτ(1) ʙϝϦοτʙ ▸ JSͷΈͳͷͰWebग़ͷΤϯδχΞ͕৮Γ͍͢ ▸ ͍͍ͪͪϏϧυ͢Δඞཁ͕ͳ͍ͷͰσόοά͕؆୯ ▸ ExpoଆͰίϯϙʔωϯτΛ։ൃͯ͘͠ΕͯΔͷͰϝϯςφϯε͕ෆඞཁ ▸ ΄΅΄΅ͷωΠςΟϒػೳʹରԠͯ͠Δ
▸ ίϯϑΟάͳͲϏϧυ͢ΔࡍʹjsonϑΝΠϧΛࢦఆ͢Δ͚ͩ ▸ OTAΞοϓσʔτରԠͳͷͰਃෆཁͰߋ৽Մೳ ▸ ূ໌ॻؔ࿈ͷཧΛߦͬͯ͘ΕΔ ▸ React NativeຊମͷΞοϓσʔτΛͯ͘͠ΕΔ
EXPOΛ͏ϝϦοτ/σϝϦοτ(2) ʙσϝϦοτʙ ▸ npmύοέʔδ͕JSͷΈͰॻ͔Ε͍ͯΔͷͰͳ͍ͱ͑ͳ͍ ▸ ExpoͰऔΓࠐΜͰ͍ΔSDKͰͳ͍ͱ͑ͳ͍ ▸ adjustReproͳͲ ▸ firebaseWeb
SDKͳͷͰϑϧػೳ͕͑ͳ͍ ▸ ExpoͰ༻ҙ͍ͯ͠ͳ͍ػೳ͕͑ͳ͍ ▸ BluetoothͳͲ ▸ Expoͷશͯͷίϯϙʔωϯτ͕όϯυϧʹؚ·Εͯ͠·͏ ▸ ৹ࠪ࣌ͷࠂؔ࿈ͷνΣοΫ ▸ ϑΝΠϧͷංେԽ ▸ ͍͟σλον͢ΔͱͳΔͱ͔ͳΓࠊ͕ॏ͘ͳͬͯ͠·͏ ▸ React NativeຊମͷΞοϓσʔτ͕͘ͳͬͯ͠·͏
EXPOΛ͏ϝϦοτ/σϝϦοτ(3) ʙEXPOͷ͍ॴʙ ▸ ExpoͰ༻ҙ͞Ε͍ͯΔͷͷΈͰ݁Ͱ͖Δ ▸ ࠂͳͲϏδωεతͳཁ݅ͷҙࢥܾఆ͕Ͱ͖Δ͔Ͳ͏͔ ▸ εϐʔυΛ༏ઌͯ͠ϓϩτλΠϐϯάఔͷؾ࣋ͪΛ࣋ͭ ▸ ͨͬͨΒνʔϜਓ૿ͯ͠ωΠςΟϒΛ࡞ΔΑ͏ʹ͢Δ
ҰਓͰ։ൃ͢Δ͙Β͍ͷؾ࣋ͪͩͱΑ͍͔
REACT NATIVE EXPOͰߦ͏ΞϓϦͷ؆୯࠷ӡ༻ ։ൃӡ༻Λૉૣ͘؆୯ʹߦ͏ͨΊʹ
REACT NATIVE EXPOͰߦ͏ΞϓϦͷ؆୯࠷ӡ༻ ࣮ػ֬ೝͷखؒΛ͔͚ͳ͍Α͏ʹ͍ͨ͠ OTAΞοϓσʔτΛޮΑ͍͍ͨ͘
REACT NATIVE EXPOͰߦ͏ΞϓϦͷ؆୯࠷ӡ༻ circleciͷಋೖ
CIRCLECIͷಋೖ(1) git push git merge dev prod develop master expo
publish expo publish ֤branchʹϚʔδ͞ΕͨΒ OTAΞοϓσʔτ͞ΕΔ
CIRCLECIͷಋೖ(2) https://gist.github.com/watanabeyu/69c42b79800baa8691ac0447866a2252 ExpoͷΞΧϯτ໊/ύεϫʔυCI্ʹอଘ
CIRCLECIͷಋೖ(3) https://gist.github.com/watanabeyu/69c42b79800baa8691ac0447866a2252 release-channel͓ΑͼconfigΛࢦఆ
CIRCLECIͷಋೖ(4) https://gist.github.com/watanabeyu/69c42b79800baa8691ac0447866a2252
CIRCLECIͷಋೖ(5) ͏গ͠ศརʹͳΒͳ͍͔ʁ PRຖʹExpoΫϥΠΞϯτͰΞϓϦͷ֬ೝ͕Ͱ͖Δͱศར
REACT NATIVE EXPOͰߦ͏ΞϓϦͷ؆୯࠷ӡ༻ expo-qr-notifyͷಋೖ
EXPO-QR-NOTIFYͷಋೖ(1) git push git merge dev prod dev prod expo
publish expo publish publish࣌ʹ slackͱgithubʹ ௨ͯ͠΄͍͠ feature/xxx git merge
EXPO-QR-NOTIFYͷಋೖ(2) expo publish࣌ʹίϚϯυ࣮ߦͰ͖ΔͷΛར༻ͨ͠ύοέʔδ https://github.com/watanabeyu/expo-qr-notify/tree/master/example
EXPO-QR-NOTIFYͷಋೖ(3)
EXPO-QR-NOTIFYͷಋೖ(4)
EXPO-QR-NOTIFYͷಋೖ(5) release-channelΛcircleciͷڥมͰࢦఆ
EXPO-QR-NOTIFYͷಋೖ(6)
·ͱΊ ▸ Expo։ൃ͢Δ্ͰϝϦοτ͕ଟ͍͠σϝϦοτଟ͍ ▸ ཁ݅ʹͯ·Δͱͱͯ؆୯ ▸ ϓϩτλΠϐϯάతͳײ͙֮Β͍ͷํ͕Α͍ ▸ ։ൃ͓Αͼӡ༻Λগ͠Ͱૉૣ͘؆୯ʹ͢ΔͨΊʹ ▸
circleciΛಋೖ͢ΔͱϒϥϯνຖʹOTAΞοϓσʔτͰ͖Δ ▸ expo-qr-notifyΛಋೖ͢Δ͜ͱͰ։ൃ࣌ʹPRຖʹ֬ೝͰ͖Δ
͓ΘΓ