Using AdMob in React Native [see my comment below for instructions]

AdMobBanner.h

#ifndef AdMobBanner_h
#define AdMobBanner_h

@import GoogleMobileAds;

@interface AdMobBanner : GADBannerView

@property NSArray *testDevices;

@end

#endif

AdMobBanner.js

import React, {
  Component,
  StyleSheet,
  PropTypes,
  requireNativeComponent
} from 'react-native';

const styles = StyleSheet.create({
  base: {
    alignSelf: 'stretch',
    height: 50
  }
});

export default class AdMobBanner extends PureComponent {
  static propTypes = {
    adUnitID: PropTypes.string,
    testDevices: PropTypes.arrayOf(PropTypes.string)
  }

  render() {
    const { style, ...props } = this.props;
    return <NativeAdMobBanner {...props} style={[styles.base, style]} />;
  }
}

const NativeAdMobBanner = requireNativeComponent('AdMobBanner', AdMobBanner);

AdMobBanner.m

#import "AdMobBanner.h"

@implementation AdMobBanner

- (void) didMoveToWindow {
  [super didMoveToWindow];

  if (self.window) {
    self.rootViewController = self.window.rootViewController;

    GADRequest *request = [GADRequest request];
    request.testDevices = self.testDevices;
    [self loadRequest:request];
  }
}

@end

AdMobBannerManager.h

#ifndef AdMobBannerManager_h
#define AdMobBannerManager_h

#import "RCTViewManager.h"

@interface AdMobBannerManager : RCTViewManager
@end

#endif

AdMobBannerManager.m

#import "AdMobBannerManager.h"
#import "AdMobBanner.h"

@implementation AdMobBannerManager

RCT_EXPORT_MODULE()

- (UIView *) view {
  return [[AdMobBanner alloc] initWithAdSize:kGADAdSizeSmartBannerPortrait];
}

RCT_EXPORT_VIEW_PROPERTY(adUnitID, NSString)
RCT_EXPORT_VIEW_PROPERTY(testDevices, NSArray)

@end

So there's this sample repo already showing you how to add AdMob into your react native app.

But I found some issues using it. First, you can't call AdMob.showBannerOnBottomOfTheView in componentDidMount because the rootViewController wouldn't still be ready, and the AdMob needs it to display the ad. But you can fix this by putting a timeout before you call showBannerOnBottomOfTheView, but this is plain ugly.
Secondly, the ad banner is attached to the root view, so once you've added it, it shows in all your scenes. So if you don't want it to show in one scene, you would call removeBannerFromTheView. Then add it back when the scene changes.
And lastly, I wanted it to work like a component, this feels more natural in the react environment. So I would just add <AdMobBanner /> into my view and poof! it shows in my view, and when that view is removed and so is the ad.

So I took some time to learn the very basics of objective c and, finally, here's the result.

Usage:

1. Add the AdMob SDK to your xcode project. See here for instructions. (Follow the 'Adding the SDK to your Xcode project' section only)
2. Copy and add AdMobBanner.h, AdMobBanner.m, AdMobBannerManager.h, AdMobBannerManager.m to your xcode project.
3. Copy the AdMobBanner.js to your react native codes directory.

Sample app:

import React, { Component, StyleSheet, View, Text } from 'react-native';
import AdMobBanner from './AdMobBanner';

const styles = StyleSheet.create({
  base: { flex: 1 },
  body: { flex: 1, justifyContent: 'center', alignItems: 'center' }
});

export default class AwesomeAdApp extends Component {
  render() {
    return (
      <View style={styles.base}>
        <View style={styles.body}>
          <Text>Do you see the bottom banner ad? It's awesome!</Text>
        </View>
        <AdMobBanner adUnitID="MY_ADMOB_BANNER_KEY" />
      </View>
    );
  }
}