Tweet
Tweet

Slide 1

Slide 1 text

2019/02/27 Θͨͳ΂Ώ͏ REACT NATIVE EXPOͰߦ͏ΞϓϦͷ؆୯࠷଎ӡ༻

Slide 2

Slide 2 text

▸ ࣗݾ঺հ ▸ React Native Expoͱ͸ ▸ ExpoΛ࢖͏ϝϦοτ/σϝϦοτ ▸ ։ൃӡ༻Λૉૣ͘؆୯ʹߦ͏ͨΊʹ ▸ circleciͷಋೖ ▸ expo-qr-notifyͷಋೖ ▸ ·ͱΊ ֓ཁ

Slide 3

Slide 3 text

ࣗݾ঺հ(1) Θͨͳ΂Ώ͏ ▸ ॴଐ ▸ גࣜձࣾg&h ▸ Web / ΞϓϦΛझຯͰެ։ ▸ ࢓ࣄ಺༰ ▸ αʔό / ϑϩϯτ / ΞϓϦ / Web ▸ ΞΧ΢ϯτ ▸ Twitter : @hmktsu ▸ Github : @watanabeyu ࣮ફExpo͍ͬͯ͏ຊΛڞஶͰ2018೥12݄ʹग़൛

Slide 4

Slide 4 text

ࣗݾ঺հ(2) ▸ https://www.gandh.jp ▸ 3໊(ΤϯδχΞ͸ࣗ෼Ұਓ)Ͱฏۉ೥ྸ30൒͹ͷγχΞձࣾ ▸ ετϦʔτΧϧνϟʔ × ITͳαʔϏεΛӡӦ ▸ ݱࡏͷϝΠϯࣄۀɿhttps://www.weddyweddy.net ▸ μϯαʔ޲͚ͷϓϥοτϑΥʔϜܥSNSΞϓϦ ▸ ͪ͜ΒͰνϣΠεͨ͠གྷΓ΍͍͢30ඵఔ౓ͷۂͰགྷͬͯಈըΛΞοϓ

Slide 5

Slide 5 text

REACT NATIVE EXPOͰߦ͏ΞϓϦͷ؆୯࠷଎ӡ༻ React Native Expoͱ͸

Slide 6

Slide 6 text

REACT NATIVE EXPOͱ͸(1) ▸ React NativeΛݶΓͳ͘web։ൃʹ͚ۙͮΔͨΊͷ΋ͷ ▸ Xcode΍Android Studio͕ෆཁ ▸ JavaScriptͷΈͰ࡞Δ͜ͱ͕Մೳ

Slide 7

Slide 7 text

REACT NATIVE EXPOͱ͸(2) ▸ σόοάʹ͸Expo Clientͱ͍͏ΞϓϦΛ֤ετΞ͔Βμ΢ϯϩʔυ ▸ ಉҰωοτϫʔΫ / ಉҰϩάΠϯΞΧ΢ϯτͰ࣮ߦՄೳ ▸ ΄ͱΜͲͷ୺຤ͰγʔϜϨεʹσόοΫՄೳ

Slide 8

Slide 8 text

REACT NATIVE EXPOͱ͸(3) ▸ Expo SnackͰWebϒϥ΢β্Ͱࢼ͢͜ͱ͕Մೳ ▸ ExpoΞΧ΢ϯτʹಉظͰ͖Δ ▸ γϛϡϨʔλ΋෇ଐͯ͠ΔͷͰϒϥ΢βͷΈͰ։ൃ͕Մೳ

Slide 9

Slide 9 text

REACT NATIVE EXPOͱ͸(4) ▸ ओཁͳػೳʹରԠ ▸ Χϝϥ ▸ Ի΍ಈըΛ࠶ੜ࿥ը(࿥Ի)ͨ͠ΓɺϝσΟΞϥΠϒϥϦ΁ͷΞΫηε ▸ ֤छηϯαʔܥ ▸ ͳͲͳͲ ΄΅΄΅ͷΞϓϦ։ൃʹඞཁͳػೳʹରԠ

Slide 10

Slide 10 text

REACT NATIVE EXPOͱ͸(5) ▸ CodePushͷΑ͏ͳOTAΞοϓσʔτʹඪ४ରԠ ▸ config΋؀ڥ͝ͱʹ؆୯ʹઃఆՄೳ ▸ app.json΍release-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

Slide 11

Slide 11 text

REACT NATIVE EXPOͰߦ͏ΞϓϦͷ؆୯࠷଎ӡ༻ ExpoΛ࢖͏ϝϦοτ/σϝϦοτ

Slide 12

Slide 12 text

EXPOΛ࢖͏ϝϦοτ/σϝϦοτ(1) ʙϝϦοτʙ ▸ JSͷΈͳͷͰWebग़਎ͷΤϯδχΞ͕৮Γ΍͍͢ ▸ ͍͍ͪͪϏϧυ͢Δඞཁ͕ͳ͍ͷͰσόοά͕؆୯ ▸ ExpoଆͰίϯϙʔωϯτΛ։ൃͯ͘͠ΕͯΔͷͰϝϯςφϯε͕ෆඞཁ ▸ ΄΅΄΅ͷωΠςΟϒػೳʹରԠͯ͠Δ ▸ ίϯϑΟάͳͲ΋Ϗϧυ͢ΔࡍʹjsonϑΝΠϧΛࢦఆ͢Δ͚ͩ ▸ OTAΞοϓσʔτରԠͳͷͰਃ੥ෆཁͰߋ৽Մೳ ▸ ূ໌ॻؔ࿈ͷ؅ཧΛߦͬͯ͘ΕΔ ▸ React NativeຊମͷΞοϓσʔτΛͯ͘͠ΕΔ

Slide 13

Slide 13 text

EXPOΛ࢖͏ϝϦοτ/σϝϦοτ(2) ʙσϝϦοτʙ ▸ npmύοέʔδ͕JSͷΈͰॻ͔Ε͍ͯΔ΋ͷͰͳ͍ͱ࢖͑ͳ͍ ▸ ExpoͰऔΓࠐΜͰ͍ΔSDKͰͳ͍ͱ࢖͑ͳ͍ ▸ adjust΍ReproͳͲ ▸ firebase͸Web SDKͳͷͰϑϧػೳ͕࢖͑ͳ͍ ▸ ExpoͰ༻ҙ͍ͯ͠ͳ͍ػೳ͕࢖͑ͳ͍ ▸ BluetoothͳͲ ▸ Expoͷશͯͷίϯϙʔωϯτ͕όϯυϧʹؚ·Εͯ͠·͏ ▸ ৹ࠪ࣌ͷ޿ࠂؔ࿈ͷνΣοΫ ▸ ϑΝΠϧͷංେԽ ▸ ͍͟σλον͢ΔͱͳΔͱ͔ͳΓࠊ͕ॏ͘ͳͬͯ͠·͏ ▸ React NativeຊମͷΞοϓσʔτ͕஗͘ͳͬͯ͠·͏

Slide 14

Slide 14 text

EXPOΛ࢖͏ϝϦοτ/σϝϦοτ(3) ʙEXPOͷ࢖͍ॴʙ ▸ ExpoͰ༻ҙ͞Ε͍ͯΔ΋ͷͷΈͰ׬݁Ͱ͖Δ ▸ ޿ࠂͳͲϏδωεతͳཁ݅ͷҙࢥܾఆ͕Ͱ͖Δ͔Ͳ͏͔ ▸ εϐʔυΛ༏ઌͯ͠ϓϩτλΠϐϯάఔ౓ͷؾ࣋ͪΛ࣋ͭ ▸ ౰ͨͬͨΒνʔϜਓ਺૿΍ͯ͠ωΠςΟϒΛ࡞ΔΑ͏ʹ͢Δ ҰਓͰ։ൃ͢Δ͙Β͍ͷؾ࣋ͪͩͱΑ͍͔΋

Slide 15

Slide 15 text

REACT NATIVE EXPOͰߦ͏ΞϓϦͷ؆୯࠷଎ӡ༻ ։ൃӡ༻Λૉૣ͘؆୯ʹߦ͏ͨΊʹ

Slide 16

Slide 16 text

REACT NATIVE EXPOͰߦ͏ΞϓϦͷ؆୯࠷଎ӡ༻ ࣮ػ֬ೝͷखؒΛ͔͚ͳ͍Α͏ʹ͍ͨ͠ OTAΞοϓσʔτΛޮ཰Α͘࢖͍͍ͨ

Slide 17

Slide 17 text

REACT NATIVE EXPOͰߦ͏ΞϓϦͷ؆୯࠷଎ӡ༻ circleciͷಋೖ

Slide 18

Slide 18 text

CIRCLECIͷಋೖ(1) git push git merge dev prod develop master expo publish expo publish ֤branchʹϚʔδ͞ΕͨΒ OTAΞοϓσʔτ͞ΕΔ

Slide 19

Slide 19 text

CIRCLECIͷಋೖ(2) https://gist.github.com/watanabeyu/69c42b79800baa8691ac0447866a2252 ExpoͷΞΧ΢ϯτ໊/ύεϫʔυ͸CI্ʹอଘ

Slide 20

Slide 20 text

CIRCLECIͷಋೖ(3) https://gist.github.com/watanabeyu/69c42b79800baa8691ac0447866a2252 release-channel͓ΑͼconfigΛࢦఆ

Slide 21

Slide 21 text

CIRCLECIͷಋೖ(4) https://gist.github.com/watanabeyu/69c42b79800baa8691ac0447866a2252

Slide 22

Slide 22 text

CIRCLECIͷಋೖ(5) ΋͏গ͠ศརʹͳΒͳ͍͔ʁ PRຖʹExpoΫϥΠΞϯτͰΞϓϦͷ֬ೝ͕Ͱ͖Δͱศར

Slide 23

Slide 23 text

REACT NATIVE EXPOͰߦ͏ΞϓϦͷ؆୯࠷଎ӡ༻ expo-qr-notifyͷಋೖ

Slide 24

Slide 24 text

EXPO-QR-NOTIFYͷಋೖ(1) git push git merge dev prod dev prod expo publish expo publish publish࣌ʹ slackͱgithubʹ ௨஌ͯ͠΄͍͠ feature/xxx git merge

Slide 25

Slide 25 text

EXPO-QR-NOTIFYͷಋೖ(2) expo publish࣌ʹίϚϯυ࣮ߦͰ͖ΔͷΛར༻ͨ͠ύοέʔδ https://github.com/watanabeyu/expo-qr-notify/tree/master/example

Slide 26

Slide 26 text

EXPO-QR-NOTIFYͷಋೖ(3)

Slide 27

Slide 27 text

EXPO-QR-NOTIFYͷಋೖ(4)

Slide 28

Slide 28 text

EXPO-QR-NOTIFYͷಋೖ(5) release-channelΛcircleciͷ؀ڥม਺Ͱࢦఆ

Slide 29

Slide 29 text

EXPO-QR-NOTIFYͷಋೖ(6)

Slide 30

Slide 30 text

·ͱΊ ▸ Expo͸։ൃ͢Δ্ͰϝϦοτ͕ଟ͍͠σϝϦοτ΋ଟ͍ ▸ ཁ݅ʹ౰ͯ͸·Δͱͱͯ΋؆୯ ▸ ϓϩτλΠϐϯάతͳײ͙֮Β͍ͷํ͕Α͍ ▸ ։ൃ͓Αͼӡ༻Λগ͠Ͱ΋ૉૣ͘؆୯ʹ͢ΔͨΊʹ͸ ▸ circleciΛಋೖ͢ΔͱϒϥϯνຖʹOTAΞοϓσʔτͰ͖Δ ▸ expo-qr-notifyΛಋೖ͢Δ͜ͱͰ։ൃ࣌ʹPRຖʹ֬ೝͰ͖Δ

Slide 31

Slide 31 text

͓ΘΓ