Skip to content

Add a site

Last reviewed: 12 days ago

In this tutorial, you will go through step-by-step instructions to bring an existing site to Cloudflare using Pulumi Infrastructure as Code (IaC) so that you can become familiar with the resource management lifecycle. In particular, you will create a Zone and a DNS record to resolve your newly added site. This tutorial adopts the IaC principle to complete the steps listed in the Add site tutorial.

Ensure you have:

  • A Cloudflare account and API Token with permission to edit the resources in this tutorial. If you need to, sign up for a Cloudflare account before continuing. Your token must have:
    • Zone-Zone-Edit permission
    • Zone-DNS-Edit permission
    • include-All zones from an account-<your account> zone resource
  • A Pulumi Cloud account. You can sign up for an always-free, individual tier.
  • The Pulumi CLI is installed on your machine.
  • A Pulumi-supported programming language is configured. (TypeScript, JavaScript, Python, Go, .NET, Java, or use YAML)
  • A domain name. You may use example.com to complete the tutorial.

a. Create a directory

Use a new and empty directory for this tutorial.

Terminal window
$ mkdir addsite-cloudflare
$ cd addsite-cloudflare

b. Login

At the prompt, press Enter to log into your Pulumi Cloud account via the browser. Alternatively, you may provide a Pulumi Cloud access token.

Terminal window
$ pulumi login

c. Create a program

To create a program, select your language of choice and run the pulumi command:

Terminal window
$ pulumi new javascript --name addsite-cloudflare --yes
# wait a few seconds while the project is initialized

d. Save your settings

You will need:

  • Your Cloudflare account ID.
  • A valid Cloudflare API token.
  • A domain. For instance, example.com.
Terminal window
# Define an ESC Environment name
$ E=my-dev-env
# Create a new Pulumi ESC Environment
$ pulumi config env init --env $E --yes --stack dev
# Replace API_TOKEN with your Cloudflare API Token
$ pulumi env set $E --secret pulumiConfig.cloudflare:apiToken API_TOKEN
# Replace abc123 with your Cloudflare Account ID
$ pulumi env set $E --plaintext pulumiConfig.accountId abc123
# Replace example.com with your registered domain, or leave as is
$ pulumi env set $E --plaintext pulumiConfig.domain example.com
# Review your ESC Environment
$ pulumi env open $E
{
"pulumiConfig": {
"accountId": "111222333",
"cloudflare:apiToken": "abc123abc123",
"domain": "example.com"
}
}

e. Create a stack

To instantiate your dev stack, run:

Terminal window
$ pulumi up --yes --stack dev
# wait a few seconds for the stack to be instantiated.

At this point, you have not defined any resources so you’ll have an empty stack.

You will now add the Pulumi Cloudflare package and a Cloudflare Zone resource to your Pulumi program.

a. Install dependencies

Terminal window
$ npm install @pulumi/cloudflare
added 1 package ...

b. Modify the program

Replace the contents of your entrypoint file with the following:

"use strict";
const pulumi = require("@pulumi/pulumi");
const cloudflare = require("@pulumi/cloudflare");
const config = new pulumi.Config();
const accountId = config.require("accountId");
const domain = config.require("domain");
// Create a Cloudflare resource (Zone)
const zone = new cloudflare.Zone("my-zone", {
zone: domain,
accountId: accountId,
plan: "free",
jumpStart: true,
});
// Export the zone ID
exports.zoneId = zone.id;

c. Apply the changes

Terminal window
$ pulumi up --yes --stack dev
# wait a few seconds while the changes take effect

d. (Optional) Review the zone

Review the value of zoneId to confirm the Zone creation.

Terminal window
$ pulumi stack output zoneId
d8fcb6d731fe1c2d75e2e8d6ad63fad5

Once you have added a domain to Cloudflare, that domain will receive two assigned authoritative nameservers.

a. Update the program

Towards the end of your entrypoint file, below the zoneId variable, add the following:

exports.nameservers = zone.nameServers;
exports.status = zone.status;

b. Apply the changes

Terminal window
$ pulumi up --yes --stack dev

c. Obtain the nameservers

Review the value of nameservers to retrieve the assigned nameservers:

Terminal window
$ pulumi stack output --stack dev

d. Update your registrar

Update the nameservers at your registrar to activate Cloudflare services for your domain. Instructions are registrar-specific. You may be able to find guidance under this consolidated list of common registrars.

e. Check your domain status

Once successfully registered, your domain status will change to active.

Terminal window
$ pulumi stack output

You will now add a DNS record to your domain.

a. Modify your program

Below is the final version of how your Pulumi program entrypoint file should look. Replace the contents of your entrypoint file with the following:

"use strict";
const pulumi = require("@pulumi/pulumi");
const cloudflare = require("@pulumi/cloudflare");
const config = new pulumi.Config();
const accountId = config.require("accountId");
const domain = config.require("domain");
// Create a Cloudflare resource (Zone)
const zone = new cloudflare.Zone("my-zone", {
zone: domain,
accountId: accountId,
plan: "free",
jumpStart: true,
});
// Export the zone ID
exports.zoneId = zone.id;
exports.nameservers = zone.nameServers;
exports.status = zone.status;
const record = new cloudflare.Record("my-record", {
zoneId: zone.id,
name: domain,
value: "192.0.2.1",
type: "A",
proxied: true,
});

b. Apply the changes

Terminal window
$ pulumi up --yes --stack dev

You will run two nslookup commands against the Cloudflare-assigned nameservers.

To test your site, run:

Terminal window
$ DOMAIN=$(pulumi config get domain)
$ NS1=$(pulumi stack output nameservers | jq '.[0]' -r)
$ NS2=$(pulumi stack output nameservers | jq '.[1]' -r)
$ nslookup $DOMAIN $NS1
$ nslookup $DOMAIN $NS2

For .NET use Nameservers as the Output.

Confirm your response returns the IP address(es) for your site.

In this last step, you will remove the resources and stack used throughout the tutorial.

a. Delete the resources

Terminal window
$ pulumi destroy --yes

b. Remove the stack

Terminal window
$ pulumi stack rm dev

You have incrementally defined Cloudflare resources needed to add a site to Cloudflare. After each new resource, you apply the changes to your dev stack via the pulumi up command. You declare the resources in your programming language of choice and let Pulumi handle the rest.

Follow the Hello World tutorial to deploy a serverless app with Pulumi.