ReactNativeでIOSアプリのプッシュ通知を実装する

by masarufuruya

Embed

Start on current slide

Slide 1

Slide 1 text

ReactNativeͰ IOSΞϓϦͷϓογϡ௨஌Λ࣮૷͢Δ

Slide 2

Slide 2 text

ݹՈ େ ; Δ ΍ ·͞Δ ࣗݾ঺հ ϑϦʔϥϯεΤϯδχΞ ͓࢓ࣄ ReactͷϑϩϯτΤϯυ։ൃ͕ଟΊ ࠷ۙ͸React Native΍VRΛֶशத झຯ

Slide 3

Slide 3 text

ʮࠓ೔ͷςʔϚʯ ReactNativeͰ IOSΞϓϦͷϓογϡ௨஌Λ࣮૷͢Δ

Slide 4

Slide 4 text

ϓογϡ௨஌ͷ֓ཁ • Apple Push Notification Service (APNs) • Firebase Cloud Messaging (FCM)

Slide 5

Slide 5 text

ϓογϡ௨஌ͷ֓ཁ • Apple Push Notification Service (APNs) • Firebase Cloud Messaging (FCM) IOS/Android྆ରԠͰ͖ΔFCMΛ࢖͏

Slide 6

Slide 6 text

ϓογϡ௨஌ͷ֓ཁ FCM ࣗલαʔόʔ or Sass ᶃ σόΠετʔΫϯͷऔಘ

Slide 7

Slide 7 text

ϓογϡ௨஌ͷ֓ཁ FCM ࣗલαʔόʔ or Sass ᶄ σόΠετʔΫϯͷొ࿥

Slide 8

Slide 8 text

ϓογϡ௨஌ͷ֓ཁ FCM ࣗલαʔόʔ or Sass ᶅ Πϕϯτͷൃੜ ᶆ ϓογϡͷཁٻ

Slide 9

Slide 9 text

ϓογϡ௨஌ͷ֓ཁ FCM ࣗલαʔόʔ or Sass ᶇ ϓογϡ௨஌ (ϝοηʔδ)

Slide 10

Slide 10 text

ϓογϡ௨஌ͷ֓ཁ ࣗલαʔόʔ or Sass ReactNative ࠓճͷ࿩͸͜͜ͷ෦෼ FCM

Slide 11

Slide 11 text

FCM͔Β௨஌Λड͚औΔ·Ͱͷखॱ 1. ReactNativeϓϩδΣΫτͷ࡞੒ 2. FCMͷ։ൃ؀ڥηοτΞοϓ 3. react-native-fcmͷηοτΞοϓ 4. ௨஌༻ͷReactίϯϙʔωϯτ࣮૷

Slide 12

Slide 12 text

ReactNativeϓϩδΣΫτͷ࡞੒ • react-native init IOSNotification • react-native run-ios ※ىಈ·Ͱ݁ߏ͔͔࣌ؒΔͷͰؾ௕ʹ଴ͪ·͠ΐ͏

Slide 13

Slide 13 text

• XCodeͷBundle Identifier ΛόϯυϧIDཝʹೖྗ FCMͷ։ൃ؀ڥηοτΞοϓ • ReactNativeΞϓϦͱFCM ͕͜ΕͰඥͮ͘

Slide 14

Slide 14 text

FCMͷ։ൃ؀ڥηοτΞοϓ • CocoaPodsΛ࢖͏ • pod ‘Firebase/Messaging’ FCM㲗IOSؒͷ௨৴Λ Մೳʹ͢ΔϥΠϒϥϦ

Slide 15

Slide 15 text

react-native-fcmͷηοτΞοϓ • yarn add react-native-fcm • react-native link react-native-fcm IOS FCM React IOSͰड͚औͬͨFCMͷ௨஌ΛReactʹ౉ͨ͢ΊͷϥΠϒϥϦ link!

Slide 16

Slide 16 text

react-native-fcmͷηοτΞοϓ • ެࣜHPΛࢀߟʹAppDelegateϑΝΠϧͷमਖ਼ • RCTBundleURLProvider.h not found౳ ͷΤϥʔ͕୔ࢁग़Δ͕ແࢹͯ͠ਐΜͰOK

Slide 17

Slide 17 text

௨஌༻ͷReactίϯϙʔωϯτ࣮૷ • FCM.requestPermissions • Ϣʔβʔ΁ͷ௨஌ڐՄϦΫΤετ

Slide 18

Slide 18 text

• Objective-C΍Xcodeͷ஌͕ࣝແ͍ͱਏ͍ • ࣮ػϏϧυ͕ࣦഊ͠·ͬͯ͘ਏ͍ • ࣮ػͰṖͷΫϥογϡ͕සൃͯ͠ਏ͍ • Ͱ΋ɺUIपΓΛReactͰॻ͚Δͷ͸޾ͤ ࠓճτϥΠͯ͠Έͯͷॴײ

Slide 19

Slide 19 text

͝੩ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ