Add AdMob to React-Native App

One of the most important parts when finalizing an application is the monetization part, for my case I started a react-native application to manipulate and get familiar with the framework, so I decided to make a IOS application of news from developers and designers.

And when I wanted to integrate AdMob I did not really find a clean article that speaks about the subject but several information scatter here and there.
so I decided that I would do one for other developers who would be in the same situation I was in.

To integrate AdMob is easy enough you just have to follow some steps and make sure you do not forget.


First, you need to create an AdMob account: Here

On Application side :

to be able to use the advertising components it is necessary that:
You make sure GoogleMobileAds.framework is included in the xcodeproject

download GoogleMobileAds.

Then the next step is to include the GoogleMobileAds module in appDelegate.m like this:

Then you have to install react-native-admob:

npm i — save react-native-admob@next

yarn add react-native-admob@next

The implementation of react-native-admob is quite simple, for my part I created a component ‘AdvertisementBanner’ in which I import AdMobBanner:

Usage

And that’s it :), Normally the banner of advertising must appear in your page, if by my misfortune that does not happen it is necessary to repeat the announced steps.

The application with which I gave the example is open-source you could find it on :

Github and AppStore