Adding AdMob ads to react native

Installing admob and expo dev client for creating custom builds

expo install expo-dev-client
expo install react-native-google-mobile-ads

Add the below at app.json at last before one "}" and change the ids

"react-native-google-mobile-ads": {
  "android_app_id": "ca-app-pub-3940256099942544~3347511713",
  "ios_app_id": "ca-app-pub-3940256099942544~1458002511"
}

npm install -g eas-cli

The below will create custom build

eas build -p ios --profile development
OR
eas build -p android --profile development

Download it and open

adding banner add

import { StatusBar } from 'expo-status-bar';
import { StyleSheet, Button, Text, View } from 'react-native';
import { BannerAd, BannerAdSize, TestIds, InterstitialAd, AdEventType, RewardedInterstitialAd, RewardedAdEventType } from 'react-native-google-mobile-ads';
import { useState, useEffect } from 'react';


export default function App() {
  return (

    <>

    <BannerAd 
        // unitId="ca-app-pub-48093340#0648907/1419436991"
        unitId={TestIds.BANNER}
        size={BannerAdSize.LEADERBOARD}

        requestOptions={{
          requestNonPersonalizedAdsOnly: true
        }}

      />
      </>

  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
});

Video Source

https://www.youtube.com/watch?v=rX9z-UnDk24&t=64s

Git Hub rep

https://github.com/chelseafarley/expo-react-native-google-mobile-ads-demo/blob/main/App.js