After working on mobile app development for the past year, I can summarize that some of the Firebase features such as In-App Messaging, Push notifications, Remote Config are a must-have in any mobile app. Even if you don’t use them right away, I think it’s wiser to plug them in so that you don’t have to make frequent deployments. I haven’t used Remote Config yet, just learned about the feature, and already feel, “Gosh! Wish I had known that before” 🙂

USE CASE

I always wondered about how Twitter notifies me of new tweets or Gmail notifies about a new email via the notifications that sit in the notification tray. I am glad I found the opportunity to learn and implement them. Below I share the steps to implement the feature. As always, it was straightforward on android but intricate on iOS.

Android Configurations:

1. Complete “Set up Firebase and the FCM SDK” from the url https://firebase.google.com/docs/cloud-messaging/android/client
2. Add the below lines of code in “androidmanifest.xml”

3. Add the below line in “pubspec.yaml”, make sure you check for the latest plugin version on pub.dev.

firebase_messaging: ^6.0.13

Note:

You cannot test the notifications feature on your simulator/emulator.

iOS Configurations:

The important thing with iOS configuration was to follow each of the steps below including changing swift code on XCode (Step 7, which I totally didn’t expect to do)

1. Generate a “Certificate Signing Request (CSR)” file

• Open “Keychain Access” and click on the menu Keychain Access -> Certificate Assistant -> Request a Certificate from a Certificate Authority
• In the dialog that appears, enter the email-id, choose the option “Saved to disk” and click on “Continue” to save your CSR file into a folder.

2. Register your app id on Apple Developer Account

• Log in to your apple developer account and register your app id (even if the app is a demo app).
• Make sure you select “Push Notifications” while completing the registration.
• Once complete, you will be directed back to the developer resources list page https://developer.apple.com/account/resources/identifiers/list

Apple Developer account -> Certificates, Identifiers & Profiles -> Click on Identifiers -> click on “+” to register your app

3. Create and download iOS certificate

• Click on “Identifiers” and select the identifier/application that you just created.
• Scroll down to “Push Notifications” and click on the button “Configure” next to it.
• On the dialog that appears, you will have an option to create a “Development SSL Certificate” or “Production SSL Certificate”. Click on the appropriate button.
• In the “Create a new certificate” screen that follows, you will have to upload the certificate signing request from step 1. Click on “Choose File” and upload the CSR file that you downloaded in step 1.
• Once the certificate is successfully created, click on the “Download” button to download the certificate to your local drive.

4. Generate .p12 private key

• Locate the certificate you downloaded in step 3 and double click on the certificate to install the same.
• Go back to KeyChain Access, select your certificate. The name of the certificate will be “Apple Development IOS Push Services: <app bundle id>”
• Expand your certificate by clicking on the small “down” arrow next to the certificate name.
• You will see your team name or developer name row with the value “Private Key” under the “Kind” column. Right-click on that row and click on “Export” to save your private key (file with .p12 extension)
• You will be asked to enter a password to protect your private key. Complete the process.
• Remember the location where you saved the file.

5. Add the .p12 file to your firebase iOS app

• Assuming you have added your iOS app on Firebase and added “GoogleService-Info.plist” under the “Runner” folder on XCode. If not, here is the firebase documentation to achieve the same.
• Log into your firebase project -> iOS app -> Settings -> Cloud Messaging
• Scroll down, you will find “iOS app Configuration”. Click on “Upload” under “APNs Certificates”.
• Upload the “p.12” file that you just saved in the previous step.

Since this is a demo app, it’s ok to create and upload the development certificate, but you would create and upload a production certificate for a production app.

5. Podfile changes

• Go to your “ios” folder in finder and open your “Podfile” in the TextEdit app.
• Add the following lines of code to your pod file and save. Of course, please look up for the latest versions.

• Open a terminal window, cd to your ios folder, and execute the command “pod install”.

6. Enable Push Notifications on your project

• On VS Code, right click on the “ios” folder and open your project in XCode.
• Click on the tab “Signing & Capabilities”, click on “+ capability” and add “Push Notifications” to your project/app.

7. “Firebase_messaging” package related changes

• This is a very important step, I didn’t expect to change a swift file as part of configuring push notifications in iOS and learned it the hard way.
• While in XCode, there are some plugin-specific changes that have to be done for iOS.
• Under the “runner” directory, you will find the file “AppDelegate.swift”, click on it to open in the right panel.
• Add the below code

Flutter configurations

• Flutter has a “firebase_messaging” package that will help your app receive the notifications from the firebase.
• Add this library to pubspec.yaml and you can start using Firebase API.

Testing notifications

• At this point, you can test your notifications using the Cloud Messaging Firebase console.
• Remember, you can test notifications only on a real device not on emulator or simulator.
• But I wrote a simple flutter app to capture the device token and a cloud function to send a custom notification to the app. I would love to share that with you but in a different article. Stayed tuned for that!

Conclusion

iOS configuration is always a tough cookie. Especially with Push Notifications, you are relying on your notification server such as Firebase to contact the Apple Notification server that in turn reaches out to your iOS device with the message.

But thanks to all the people who have posted their questions/articles on various resources, I was able to get push notifications working on iOS.

Please don’t forget to “clap” ? to help your fellow programmers find this article easily.