Push Notification in React Native | Android

My requirements were simple I needed to incorporate Local notifications that I could schedule to to appear at a later time for Android. I also needed these notifications to still display even if the app was closed. After some research I found that react-native-push-notification was my best bet. However, I found that this was a bit tricky to get up and running, but at long last I was successful. My struggle is your lucky day.

Preview

Libraries used

• React Native

A framework for building native apps with React.

• React-Native-Push-Notification

A NPM library for React Native Local and Remote Notifications for iOS and Android

Running the project

• Clone this project

git clone https://github.com/tpmabdulkareem/Push-Notification-App.git

• Install NodeJS on your computer.

• Install yarn on your computer

Yarn is a dependency manager built by facebook and google. It is a more efficient and reliable (thanks to yarn.lock) alternative of npm.

• Launch yarn command in a terminal opened in the project folder.

This command will look into the package.json file and install all the dependencies listed here.

• Install react-native-cli globally on your computer

yarn global add react-native-cli

Android steps

• Launch a virtual android device (through Android Studio for instance)

If you have never installed any android virtual device, follow those instructions

• Then, run the project in executing on your project folder:

react-native run-android

Troubleshooting

Note: Each time you pull commits from others, run the yarn command to install dependencies that may have been introduced.

react-native is not recognized as an internal or external command

• If your terminal is telling you react-native is not known, try to install it globally with npm: npm install -g react-native-cli and re-run the above command.

'adb' is not recognized as an internal or external command

If you have a build error with this message on Windows, it means that you must add the Android sdk platform tools to your environment PATH.

How to add an environment variable on your computer.

My value on windows: C:\Users\Manuel\AppData\Local\Android\sdk\platform-tools

failed to find target with hash string 'android-23'

React Native needs this to be installed in order to work, and the default target installed by Android Studio is the 24th. To solve this issue, open android studio and click on SDK Manager Icon:

Then click on the line with API Level of value 23 and apply.

failed to find Build Tools revision XX.X.X

It seems you are missing the build tools at specific revision XX.X.X, so you need to install them. Go to Android Studio SDK Settings (see images above) and click on the SDK Tools snippet.

Then, click on Show Package Details and look for Android SDK Build Tools XX.X.X. Then check if it is installed. If not, install it and this issue should be solved then.

Execution failed for task ':app:dexDebug'

Go into the android project's folder in your terminal and run

Windows

gradlew clean

Linux & Mac

./gradlew clean

Then delete the build folder, go back to the project's root folder and try again, this error should be solved.

Note: If it doesn't work as expected, try checking you have not forgotten any of the steps above. If not, please open an issue and describe your problem.