AdMob Integration

Important: Add monetization to your app only after you’ve published it to the app stores. Implementing ads too early in your development process can lead to account issues with Google AdMob.

When to Add AdMob

The BuildWithAI boilerplate comes with AdMob integration ready to be enabled, but we recommend following this timeline:
  1. First develop and test your core app functionality
  2. Publish your app to App Store and Google Play
  3. Then set up AdMob and implement monetization
This approach ensures your account remains in good standing with ad networks and provides a better user experience.

Setup Process Overview

1

Create AdMob Account

Sign up for an AdMob account at admob.google.com if you don’t already have one.
2

Register Your App in AdMob

In the AdMob console:
  • Click “Apps” in the left sidebar, then “Add app”
  • Select platform (iOS or Android)
  • When asked “Is the app listed on a supported app store?” select “Yes”
  • Enter your app’s store information
3

Get App IDs for Configuration

After registering your app:
  1. In the AdMob console, go to “Apps” in the sidebar
  2. Click on your app to view its details
  3. Find and copy these essential IDs:
    • iOS App ID: Starts with ca-app-pub- (needed for app.json)
    • Android App ID: Starts with ca-app-pub- (needed for app.json)
These IDs will be used in your app.json configuration, as described in the implementation instructions.

Implementation

Follow the implementation instructions in the integrations/admob/README.md file included in your boilerplate codebase. This file contains all necessary steps for setting up AdMob in your application.

Creating and Configuring Ad Units

When testing your app, always use test ad units. Using production ad units during development can lead to account suspension.
After your app is published to the app stores:
  1. In AdMob console, click “Add ad unit”
  2. Configure your ad unit:
    • Select ad format (Banner, Interstitial, etc.)
    • Name your ad unit (e.g., “Main Screen Banner”)
    • Leave partner bidding unchecked for simplicity
  3. Click “Create ad unit” and copy the generated ad unit ID
Once you have created your ad units:
  1. Go to the Expo dashboard: expo.dev
  2. Navigate to your project’s environment variables: https://expo.dev/accounts/[account]/projects/[project]/environment-variables/new
  3. Add the following variables (production only):
EXPO_PUBLIC_ADMOB_BANNER_ANDROID=ca-app-pub-xxxxxxxxxxxxxxxx/xxxxxxxxxx
EXPO_PUBLIC_ADMOB_BANNER_IOS=ca-app-pub-xxxxxxxxxxxxxxxx/xxxxxxxxxx
Only enable these variables for Production builds. Make sure “Preview” and “Development” environments are unchecked.

Testing Your Configuration

  1. Test with Development Build: Open your development build and navigate to screens with ads
  2. Verify Test Ads: Ensure test ad units are displaying correctly
  3. Check Console: Look for any AdMob-related errors in the console
  4. Test Different Ad Formats: Verify banner, interstitial, and other ad types work properly

Additional Resources