Gatsby Cloud Docs

Getting started with Gatsby Cloud and Fastly

Table of Contents

Gatsby Cloud is a performant platform for building your Gatsby site. Even better, it integrates with Content Delivery Networks (CDNs) like Fastly so you can build and deploy your site seamlessly.

Creating your Gatsby Site

You can set up Gatsby Cloud to autoprovision a new Gatsby site. Alternatively, you can add an existing site to Gatsby Cloud by selecting that GitHub repository during set up.

Setting Up a Hosting Integration

Once your site is available inside Gatsby Cloud you can “view details” and navigate to the “Site Settings” tab.

Inside Site Settings there is an “Integrations” link. Select this menu item and scroll down to the section titled “Hosting Integrations”.

This is where you’ll see the Fastly logo. Click the “Connect” button to the right of that logo.

Creating a Deployment Target

Gatsby Cloud autoconfigures Fastly for you, all it needs is an API Token!

In order to generate the token you need to create a Fastly account. Once authenticated, navigate to your “Account”. Under your “Personal Profile” select “Personal API Tokens” and press the “Create Token” button. The default settings of “All Services” and “Global API access” should be appropriate for most users. Once the token is created be sure to copy it down as Fastly will not provide it to you again.

On the “Fastly Integration” screen you’ll be prompted for three pieces of information. Other than the API Token, these items do not need to be pre-configured in Fastly. Gatsby Cloud will create and configure the deployment target for you.

  • API Token: This is what you previously created inside Fastly.
  • Service Name: Choose whichever name you like so long as it does not conflict with existing Fastly services under your account.
  • Hostname: This should match your intended domain name.

Wait for your build to complete. If you navigate to your Fastly dashboard you should see the new service. Note that you may need to refresh the page first. Your service should now be configured with a Host and Domain and it will be Active.

Navigate to your new Fastly service by clicking on the “version” linked from the dashboard. On this screen it will list your domains, notice the “Test domain” button. Click on this to view your site. If you’re ready to route traffic to your site configure your DNS settings in Fastly.

Setting up HTTPS

Note that this requires a paid Fastly account.

You may also want to configure HTTPS for your site. You can follow the instructions provided by Fastly in order to set this up. This step requires Fastly to verify your ownership of the domain and may take up to an hour.

Once the certificate is generated you’ll need to configure your DNS records to serve HTTPS traffic.

HTTPS Configuration is considered separate from your Service configuration and therefore is not subject to the overwrite rules.

Finishing Up

And that’s it! Your site is now set up to build and deploy. Gatsby Cloud will handle everything for you.

Note that you can only have one hosting integration. If you choose to configure another provider, that will override your existing Fastly integration.

FAQ

I created a new Fastly service using the Gatsby Cloud Hosting Integration setup, why don’t I see it in my Fastly account?

Fastly limits users to 10 services. If your Gatsby Cloud integration sends you over that limit it will not appear in Fastly.

I want to configure additional settings inside Fastly, can I do that?

At this time the configuration is reset each time your site is built. Additional custom configurations inside Fastly will be overridden.