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
320
npm packageとリリースとモノレポ
watanabeyu
0
64
react-native-ffmpegを使って動画をいじくりmawasou
watanabeyu
0
920
react-native-unimodulesを用いてのApp内課金実装
watanabeyu
0
1.1k
gandhの紹介です
watanabeyu
0
35
XcodeやAndroid Studioを弄らないアイコン管理
watanabeyu
2
650
Firebaseオンリー + React Nativeでアプリを作ると果たして簡単になるのか?
watanabeyu
4
1.2k
react-native-unimodulesのススメ
watanabeyu
1
6.5k
JavaScript製npmパッケージをTypeScriptで書き直した話
watanabeyu
0
1.1k
Other Decks in Programming
See All in Programming
TypeScriptでDXを上げろ! Hono編
yusukebe
4
930
プロダクトという一杯を作る - プロダクトチームが味の責任を持つまでの煮込み奮闘記
hiliteeternal
0
370
ソフトウェア設計とAI技術の活用
masuda220
PRO
25
7.3k
202507_ADKで始めるエージェント開発の基本 〜デモを通じて紹介〜(奥田りさ)The Basics of Agent Development with ADK — A Demo-Focused Introduction
risatube
PRO
6
1.4k
リッチエディターを安全に開発・運用するために
unachang113
1
350
DatadogのArchived LogsをSnowflakeで高速に検索する方法(Archive Searchでオワコンにならないことを祈って) / How to search Datadog Archived Logs quickly with Snowflake (hoping Datadog Archive Search doesn’t make this obsolete)
civitaspo
0
110
MCPで実現できる、Webサービス利用体験について
syumai
7
2.4k
AWS Summit Japan 2024と2025の比較/はじめてのKiro、今あなたは岐路に立つ
satoshi256kbyte
1
260
Scale out your Claude Code ~自社専用Agentで10xする開発プロセス~
yukukotani
5
890
Dart 参戦!!静的型付き言語界の隠れた実力者
kno3a87
0
160
Vibe coding コードレビュー
kinopeee
0
410
構文解析器入門
ydah
7
2k
Featured
See All Featured
Navigating Team Friction
lara
188
15k
Balancing Empowerment & Direction
lara
1
530
Visualization
eitanlees
146
16k
GraphQLの誤解/rethinking-graphql
sonatard
71
11k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
126
53k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
8
420
What’s in a name? Adding method to the madness
productmarketing
PRO
23
3.6k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
161
15k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
229
22k
The Art of Programming - Codeland 2020
erikaheidi
54
13k
Being A Developer After 40
akosma
90
590k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
8
870
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ຖʹ֬ೝͰ͖Δ
͓ΘΓ