In this hands-on lab, we will learn how to use Terraform to create a VPC and public subnet.

From Google Cloud console's main navigation, choose IAM & Admin > Service Accounts.

In the roles dropdown, select Project > Owner.

Log in to the Host Instance and Ensure Terraform Is Installed

From Google Cloud navigation, choose Compute Engine > VM instances.

Input the path to communicate with Terraform into the /etc/profile file:

echo "PATH='$PATH:/downloads/'" >> /etc/profile

Run the following in order to be able to call Terraform:

Create a Service Account Key within the Instance

Click on the link given, allow the cloud_user email to retrieve the key, and copy and paste the key into your terminal.

gcloud iam service-accounts keys create /downloads/instance.json --iam-account <SERVICE_ACCOUNT>

  credentials = file("/downloads/instance.json")

resource "google_compute_network" "vpc_network" {

resource "google_compute_subnetwork" "public-subnetwork" {

  network       = google_compute_network.vpc_network.name

Save and exit the file by pressing Escape followed by :wq.

Use terraform init , terraform validate , terraform plan, and then terraform apply.

Creating a virtual private network and subnetworks is the foundation of using resources or any infrastructure within GCP

Using Terraform to Create a New VPC and Public Subnet in GCP

When you have a blog or website which can earn money from Google AdSense (Google has approved) and it was build with ReactJS. How to add Google AdSense to your React application? For this question, today we'll share you about the way to do that.

Step 1:Get your Google AdSense script code and add it into your HTML file, place the code inside the head tag like this:

Step 2:Create Google Adsense Component to re-use in wherever you want:

import React, { Component } from 'react';
import PropTypes from 'prop-types';

const googleAdId = 'ca-pub-yourGoogleAdId';

class GoogleAd extends Component {
  googleInit = null;

  componentDidMount() {
    const { timeout } = this.props;
    this.googleInit = setTimeout(() => {
      if (typeof window !== 'undefined')
        (window.adsbygoogle = window.adsbygoogle || []).push({});
    }, timeout);
  }

  componentWillUnmount() {
    if (this.googleInit) clearTimeout(this.googleInit);
  }

  render() {
    const { classNames, slot } = this.props;
    return (
      <div className={classNames}>
        <ins
          className="adsbygoogle"
          style={{ display: 'block' }}
          data-ad-client={googleAdId}
          data-ad-slot={slot}
          data-ad-format="auto"
          data-full-width-responsive="true"
        ></ins>
      </div>
    );
  }
}

GoogleAd.propTypes = {
  classNames: PropTypes.string,
  slot: PropTypes.string,
  timeout: PropTypes.number,
};

GoogleAd.defaultProps = {
  classNames: '',
  timeout: 200,
};

export default GoogleAd;

the Component above, we use 3 props to handle your Google Adsense:  - classNames: String => To add custom class name to style your Google Ads - slot: String => To insert data-ad-slot that you get from Google AdSense - timeout: Number (default is 200 milliseconds) => To time delay for your Ads after the page rendered (optional)

Step 3:Add the GoogleAd component into your site where you'd like to display:

import React, { Component } from 'react';
import GoogleAd from 'components/GoogleAd';

class YourPage extends Component {
  render() {
    return (
      <div>
      	<GoogleAd slot="989038934" classNames="page-top" />
      	<div>Page Content...</div>
        <GoogleAd slot="394738798" timeout={1000} classNames="page-bottom" />
      	<div>Page Content...</div>
      </div>
    );
  }
}

export default YourPage;

google

Trending Blogposts on google

Using Terraform to Create a New VPC and Public Subnet in GCP

Popular Discussions on google

closedHow can i link google adsense with react js website?

8

1

0

PRODUCTS

QUICK LINKS

LEGAL

google

Trending Blogposts on google

Using Terraform to Create a New VPC and Public Subnet in GCP

Popular Discussions on google

closedHow can i link google adsense with react js website?

8

1

0