Adding an Adsense advert to a React app is a little tricky since you can't directly use the code generated for you by Google. However, you can create a component which allows you to show ads with a little bit of work.

Google's code

Google generates Adsense code for you, which looks a bit like this:

<script async src="//"></script>
  <ins class="adsbygoogle"
      (adsbygoogle = window.adsbygoogle || []).push({});

Move load script to HTML page

Firstly, move the first '' script into your HTML document (in this case, index.html):

<!-- index.html -->
  <script async src="//"></script>

Create advert component

Next, create a React component for the advert:

import React from 'react';</p>

export default class Ad extends React.Component {
  componentDidMount () {
    (window.adsbygoogle = window.adsbygoogle || []).push({});

render () {
    return (
      <div className='ad'>
        <ins className='adsbygoogle'
          style={{ display: 'block' }}
          data-ad-format='auto' />

There are a few changes you need to make:

  1. Put the (window.adsbygoogle = window.adsbygoogle || []).push({}); line into the componentDidMount method;
  2. Stick the HTML into the render method;
  3. Change all class attributes into className;
  4. Change style attribute so styles are wrapped with double curly brackets - style={{ display: 'block' }}

From here, you can replace the various attributes with props if needed.