How to Set up Push Notifications for the iOS and Android Apps 

With an increase in the number of mobile users, mobile marketing is rising on an exponential level. Business owners from all over the world are taking advantage of mobile marketing to attract audiences and grow business.

And why not, when it is inexpensive and effective as compared to other marketing techniques. It doesn’t matter whether your users are on the Android platform or iOS platform, you can send React Native Push Notifications to both. All you need is to set up push notifications using some simple steps and you are ready to go.

Before moving ahead with steps here are some prerequisites that you must have.

• NodeJS, v8.3, or ulterior.
• React Native

react-native-cli >= 2.0.0

react-native >= 0.59.0

• For the Android platform: Emulator with installed and updated Google play services, Firebase account, Android studio.
• For the iOS platform: Xcode, iOS device, iOS push certificate.

Note: If you are an expo user, you need to eject the app. For this go to the project’s folder and run “expo eject”

Step 1: Create a project

• Simply click on the “new project” and fill in the project’s name.
• Select the required platform from the given options.

• Click on “Create” to continue.

Step 2: Setup Push credentials

Android

• Add firebase credentials
• For this, you have to find out your “server key” and “sender ID”. You can do this by clicking the Settings icon and then “Project settings” followed by the “Cloud Messaging”

• Now go to the service provider’s dashboard in the Settings page and select the “platforms” tab followed by the “android application”.

• Finally, place the server key and click on “Save” to continue.

iOS

• For iOS, you are required to upload a push certificate.
• For this, go to Settings and click on the “iOS application”.
• Now select the “Browse” option and fill in your Push certificate.

Step 3: Add Software Development Kit (SDK)

• Create your React Native application.
• Now you have to add the service provider’s React Native SDK.

npm install react-native-wonderpush –save

• Now link the service provider’s React Native SDK.

react-native link react-native-wonderpush

iOS

• Open xcworkspace file of the project in Xcode

open ios/*.xcworkspace

• Now you have to add device capabilities. You can do this by selecting the app’s main target and then clicking on “+ Capability” under the “Signing and Capabilities”.

• Now add “Background Modes” and “Push Notifications”.

• Do not forget to select “Remote notifications”.

• Create a Notification Service Extension by going through Xcode.

• Now fill “WonderPushNotificationServiceExtension” as the name of your new product or target.

• Once done, Xcode will prompt to activate a new scheme. You are required to click on “Cancel”.

• Now you have to set the “Deployment Target” of m to 0.

• Now edit ios/Podfile and add the following at the bottom.

Step 4: Add the required code

Go to the Settings page and click on the “Platforms” to take note of the Client ID and Client Secret.

Now you have to add the code that will prompt users to subscribe to the service.

Android

• Go to the android studio to configure android SDK from the “android/app/build.gradle” file.

• You have to replace YOUR_CLIENT_ID and YOUR_CLIENT_SECRET with values you found on the “Settings” page.
• Replace YOUR_SENDER_ID with firebase sender ID as presented in step 2.
• Once done, click “sync now” and start building a project.

iOS

• Go to the “AppDelegate” to add code and adapt YOUR_CLIENT_ID and YOUR_CLIENT_SECRET with the values you noted previously.

• The code of Notification Service Extension that was generated in step 3 will be modified by the service provider.
• Now you have to replace the content of swift with the content that is given below.

Finally, use Xcode or Android Studio to build and run the application and get the permission prompt that you have configured

Now you have to wait for some minutes to receive a default welcome notification from the service provider. Once received successfully, you are done.

Conclusion:

Push notifications have become a primary need of every business owner. This is due to the growing market competition and its ability to reach the audience rapidly and effectively. They are available for both iOS and Android apps. What only you need to do is to set them by following the steps that are presented here in this guide. Once you are done with this, it just takes a single click from your device to instantly reach an audience throughout the world.

Author Bio:

Wonderpush, brings you an opportunity to grow your business. It provides you with React Native push notification services at an economical price.