Bilişim dünyasına kaliteli, özgün ve Türkçe içerikler kazandırmayı hedefleyen bir platform..

React Native Push Notification için kullanacağımız paketin adı react-native-push-notification. Öncelikle kurulum yapalım.

Kurulum

npm install --save react-native-push-notification

Firebase Oturum Açma

Google hesabınızı kullanarak Firebase'de oturum açın. Firebase'i Android uygulamanıza eklemeden önce, Android uygulamanıza bağlanmak için bir Firebase projesi oluşturmanız gerekir.

1. Oturum Açın
2. Proje Oluşturun
3. Proje Adını girin ve Firebase şartlarını kabul edin sonra devam edin
4. Firebase projeniz için Google Analytics tercihinizi yapın ve projenizi oluşturun.

Firebase'i uygulamanıza ekleyin

Firebase'i uygulamanıza ekleyerek başlayın. Bunun için proje sayfanızda yer alan Android, ios, web ya da unity gibi seçenekler çıkacak buradan android'i seçin

Uygulamanızı Kaydedin

Uygulamanızı kaydetmek için AndroidManifest.xml sayfasından proje adınızı bulun ve ilgili alana girin.

<manifest xmlns:android="http://schemas.android.com/apk/res/android" package="com.your_project_name">

Yapılandırma dosyasını indirin

Firebase'in sizin için ürettiği google-services.json dosyasını indirin ve proje dizininizde app klasörü içine kaydedin.

Android'de Firebase'in Kimlik bilgilerini Kullanması İçin İzin

/android/build.gradle dosyası içinde aşağıdaki değişiklikleri yapacağız:

buildscript {
  dependencies {
    // ... other dependencies
    classpath 'com.google.gms:google-services:4.3.3'
    // Add me --- /\
  }
}

Daha sonra /android/app/build.gradle sayfasında başka bir değişiklik daha yapacağız:

apply plugin: 'com.android.application'
apply plugin: 'com.google.gms.google-services' // <- Add this line


dependencies {
  ...
  implementation 'com.google.firebase:firebase-analytics:17.3.0'

  ...
}

Gerekli diğer ayarları android/app/src/main/AndroidManifest.xml sayfasına ekleyelim

<uses-permission android:name="android.permission.VIBRATE" />
    <uses-permission android:name="android.permission.RECEIVE_BOOT_COMPLETED"/>

    <application ....>
        <!-- Change the value to true to enable pop-up for in foreground on receiving remote notifications (for prevent duplicating while showing local notifications set this to false) -->
        <meta-data  android:name="com.dieam.reactnativepushnotification.notification_foreground"
                    android:value="false"/>
        <!-- Change the resource name to your App's accent color - or any other color you want -->
        <meta-data  android:name="com.dieam.reactnativepushnotification.notification_color"
                    android:resource="@color/white"/> <!-- or @android:color/{name} to use a standard color -->

        <receiver android:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationActions" />
        <receiver android:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationPublisher" />
        <receiver android:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationBootEventReceiver">
            <intent-filter>
                <action android:name="android.intent.action.BOOT_COMPLETED" />
                <action android:name="android.intent.action.QUICKBOOT_POWERON" />
                <action android:name="com.htc.intent.action.QUICKBOOT_POWERON"/>
            </intent-filter>
        </receiver>

        <service
            android:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationListenerService"
            android:exported="false" >
            <intent-filter>
                <action android:name="com.google.firebase.MESSAGING_EVENT" />
            </intent-filter>
        </service>

android/app/src/main/res/values/colors.xml sayfasına aşağıdaki kodları ekleyelim. Eğer bu sayfa yoksa oluşturmalıyız.

<resources>
    <color name="white">#FFF</color>
</resources>

FireBase Kurulumu

npm install --save @react-native-firebase/app

Aşağıdaki paketi de yüklemelisiniz.

@react-native-firebase/messaging

Remote Notification'lar cihazlarda çalıştığı halde emülatör üzerinde henüz çalışmıyor: Link