React Native Firebase Entegrasyonu – Ekleme (Integration)

Mobil uygulama geliştirirken en büyük gereksinimlerden biri de sunucu hizmetidir. Günümüzde bu hizmeti en güzel sağlayanlardan biri de Google tarafından yürütülen Firebase olduğunu söyleyebiliriz.

React Native ile geliştirmekte olduğumuz uygulamada Firebase kullanabilmek için entegrasyon gerçekleştirmemiz gerekiyor. Bu işlem aslında zor olmadığı gibi bazen ciddi karmaşık hale gelebiliyor. Bunda Android ve IOS platformların etkisi olduğu gibi çalıştığımız bilgisayarın bile etkileri olabiliyor. Biraz cache ile alakalı denebilir. Fakat neticede gerekli adımlar takip edildiğinde sorunsuz çalışan bir React Native – Firebase ilişkisi görebiliriz.

Firebase için öncelikle https://console.firebase.google.com  adresine gidilerek kayıt işlemleri gerçekleştirilmelidir. Daha sonra proje oluşturuyoruz.

Firebase Proje Oluşturma

Projemizi oluşturduktan sonra Android ve IOS platformalarına Firebase ekliyoruz. Uygulama ekle ya da + ikonundan bunu gerçekleştirebiliriz. Oradaki adımları (4 adım) tamamlıyoruz.

Firebase projemizi oluşturduktan sonra sıra geldi React Native uygulamamıza. Öncelikle react-native-firebase kütüphanesini install ediyoruz.

npm install --save react-native-firebase

Kütüphanemizi kurduk. Çoğu kişinin zorlandığı ya da olayların karmaşıklaştığı kısma geldik. Kurmuş olduğumuz kütüphaneyi projemize bağlayarak kurulum büyük ölçüde tamamlamış olacağız. Sonrasında ise Android ve IOS için ayrı ayrı işlemler yapmak durumundayız. Önce bağlama işini gerçekleştirelim.

react-native link react-native-firebase

Android

Altta anlatılan ve eklenilmesi söylenen satırların belirtilen dosyalarda olmadığından emin olun. Buradaki komutlar EĞER YOKSA yapılması gerekmektedir.

Firebase’ de Android uygulama eklerken indirdiğiniz google-services.json ya da benzeri isimli dosyayı android/app klasörüne eklemiş olmanız gerekiyor. Eklemedi iseniz ekleyiniz. Android uygulamanızın proje build.gradle dosyasına gidip eğer bağlama işleminde eklenmedi ise alttaki satırları dependencies alanına ekleyiniz.

classpath 'com.android.tools.build:gradle:3.2.0'

classpath 'com.google.gms:google-services:4.0.1'

Yine bu dosya içerisindeki repositories alanına alttaki satırı ekliyoruz.

google()

allprojects -> repositories -> maven alanına alttaki satırı ekliyoruz.

url "$rootDir/../node_modules/react-native/android"
Proje build.gradle Dosyası

Şimdi ise uygulama yani app klasörünün altındaki build.gradle dosyasını açıyoruz. Dosyanın en altına alttaki satırı ekliyoruz.

apply plugin: 'com.google.gms.google-services'

Daha sonra dependencies alanına alttaki satırları ekliyoruz.

implementation project(':react-native-firebase')
implementation "com.google.android.gms:play-services-base:16.0.1"
implementation "com.google.firebase:firebase-core:16.0.6"
Android Uygulama build.gradle Dosyası (1)
Android Uygulama build.gradle Dosyası (2)

Evet, sırada ise MainApplication.java dosyasını açıp Firebase modülünü import ediyoruz.

import io.invertase.firebase.RNFirebasePackage;

Son olarak modüllerin döndürüldüğü getPackages() fonksiyonunun içerisinde alttaki satırı ekliyoruz.
new RNFirebasePackage(),
MainApplication.java Dosyası (1)
MainApplication.java Dosyası (2)
Android uygulamamız Firebase projemiz ile bağlanmış durumdadır.

IOS

Altta anlatılan ve eklenilmesi söylenen satırların belirtilen dosyalarda olmadığından emin olun. Buradaki komutlar EĞER YOKSA yapılması gerekmektedir.

Firebase’ de IOS uygulama oluşturduğunuzda indirmiş olduğunuz GoogleService-Info.plist ya da benzer isimli dosyayı IOS projenizin altına koymuş olmanız gerekmektedir. AppDelegate.m dosyamızı açıyoruz ve Firebase import ediyoruz. Başlangıç fonksiyonun adını değiştiriyoruz ve içeriğine herhangi bir satıra alttaki satırı ekliyoruz.

[FIRApp configure];
React Native Firebase AppDelegate.m Ayarları

Şimdi ise projenin ios klasörüne gidip önce pod update diyerek güncellemeleri kontrol ediyoruz ve sonrasında Pod file oluşturuyoruz. Oluşturduğumuz dosyayı open Podfile komutu ile açıp içerisine alttaki satırı ekliyoruz.

pod 'Firebase/Core', '~> 5.15.0'

Dosyayı kaydedip kapattıktan sonra pod install komutu ile kütüphanemizi kurmuş oluyoruz. Artık bu andan itibaren Xcode ile projemizi açarken projeAdi.xcproj yerine projeAdi.xcworkspace projesini açıyoruz. Ve IOS uygulamamız da Firebase ile bağlantı sağlamış duruma gelmiştir.

Bir sonraki yazılarda Firebase ile mesajlaşma ve bildirim alma / gönderme konuları üzerine yazılar yazılacaktır.