Skip to content

Commit

Permalink
chore(docs): migrate cloud docs to dotcom(1) (#36452)
Browse files Browse the repository at this point in the history
* push up site creation & node version docs

* migrate doc for apex and subdomains

* migrate doc for netlify trailing slash

* move webhook/deploy docs to this branch

* migrate doc for outgoing webhooks

* rerun prettier

* migrate doc for platform limits

* format subheaders

* migrate doc for deploying functions on cloud

* fix casing in docs descriptions

* remove we/lesson refs & netlify doc

* Update docs/docs/how-to/cloud/set-node-version.md

Co-authored-by: Lennart <lekoarts@gmail.com>

* Update docs/docs/how-to/cloud/create-site-from-repository.md

Co-authored-by: Lennart <lekoarts@gmail.com>

* rework create site from repo doc

* additional adjustments

* match description & file title

* adjust VCS references

* adjust links/bolding

* final adjustments

* next batch

* additional docs/fixes

* fix linting issues

* Update docs/docs/reference/cloud/platform-limits.md

Co-authored-by: Josh Johnson <jcjohnson77@gmail.com>

* Update docs/docs/reference/cloud/what-is-gatsby-cloud.md

Co-authored-by: Josh Johnson <jcjohnson77@gmail.com>

* Update docs/docs/how-to/cloud/managing-workspace-members.md

Co-authored-by: Josh Johnson <jcjohnson77@gmail.com>

* Update docs/docs/reference/cloud/build-logs.md

Co-authored-by: Josh Johnson <jcjohnson77@gmail.com>

* Update docs/docs/reference/cloud/cms-previews.md

Co-authored-by: Josh Johnson <jcjohnson77@gmail.com>

* Update docs/docs/reference/cloud/hosting-and-data-source-integrations.md

Co-authored-by: Josh Johnson <jcjohnson77@gmail.com>

* Update docs/docs/reference/cloud/quick-connect.md

Co-authored-by: Josh Johnson <jcjohnson77@gmail.com>

Co-authored-by: “Marcus <“mcolelittle”@gmail.com>
Co-authored-by: Lennart <lekoarts@gmail.com>
Co-authored-by: Dustin Schau <DSchau@users.noreply.github.com>
Co-authored-by: Josh Johnson <jcjohnson77@gmail.com>
  • Loading branch information
5 people committed Sep 5, 2022
1 parent 59c1f4f commit bc04e8f
Show file tree
Hide file tree
Showing 37 changed files with 532 additions and 0 deletions.
36 changes: 36 additions & 0 deletions docs/docs/how-to/cloud/create-a-deploy-to-gatsby-cloud-button.md
@@ -0,0 +1,36 @@
---
title: "Create a Deploy to Gatsby Cloud Button"
description: "Learn how to add a deploy button to your Github repository"
---

Gatsby Cloud supports Deploy Buttons which you can use to quickly create new sites from Github repositories.

[![Deploy to Gatsby Cloud](https://www.gatsbyjs.com/deploynow.svg)](https://www.gatsbyjs.com/dashboard/deploynow?url=https://github.com/gatsbyjs/gatsby-starter-blog)

At this time, only public Github repos are supported.

Have a feature request for Deploy Buttons? [Suggest a feature](https://gatsby.canny.io/gatsby-cloud).

### Configure a button

Set the `url` parameter of the link to your public Github repo.

HTML snippet:

```html
<a
href="https://www.gatsbyjs.com/dashboard/deploynow?url=https://github.com/gatsbyjs/gatsby-starter-blog"
target="_blank"
>
<img
src="https://www.gatsbyjs.com/deploynow.svg"
alt="Deploy to Gatsby Cloud"
/>
</a>
```

Markdown:

```markdown
[![Deploy to Gatsby Cloud](https://www.gatsbyjs.com/deploynow.svg)](https://www.gatsbyjs.com/dashboard/deploynow?url=https://github.com/gatsbyjs/gatsby-starter-blog)
```
68 changes: 68 additions & 0 deletions docs/docs/how-to/cloud/deploying-functions-on-gatsby-cloud.md
@@ -0,0 +1,68 @@
---
title: "Deploying Functions on Gatsby Cloud"
description: "Learn how to deploy Gatsby Serverless Functions on Gatsby Cloud"
---

## Introduction

The Gatsby framework now supports general access to serverless functions in local development as well as in Gatsby Cloud. These [express](https://expressjs.com/)-style functions allow Gatsby developers to build out secure, scalable APIs alongside their Gatsby projects.

### Prerequisites

Functions are a Gatsby core feature and are not specific to Gatsby Cloud. To learn more about how to implement functions in the Gatsby framework, check out the [Reference guide](/docs/reference/functions/).

### Routing in Gatsby Cloud

Functions that are included in a Gatsby project and deployed on Gatsby cloud are available at any build URL. This includes any preview URLs (`gstb.io` domain) or hosting URLs (`gatsbyjs.io` or your custom domain).

```javascript:title=src/api/hello-world.js
const sample = (req, res) => {
res.status(200).json({"message": "Hello, World!"})
};

export default sample;
```

### Environment variables

Functions will have access to any environment variables that you’ve added to either the production or preview environments in Gatsby Cloud.

![Gatsby Cloud environment variables settings](../../images/env_vars.png)

```javascript:title=src/api/hello-world.js
const sample = (req, res) => {
let key = process.env.SAMPLE_VAR;
//run code that uses key

res.status(200).json({ message: "Hello, World!" });
};

export default sample;
```

### Setting cache headers for functions

Users can set custom headers to control cache settings to ensure that function invocations are appropriately handled when served to [CDN](/docs/glossary/content-delivery-network/) users. Any cache-header setting that users add to their function will be passed through and respected on the CDN:

```javascript:title=src/api/hello-world.js
const sample = (req, res) => {
res.setHeader(`Cache-Control`, `public, max-age=60`);
res.status(200).json({ message: "Hello, World!" });
};

export default sample;
```

### Accessing logs for functions

You can access function logs by viewing the build details for the CMS Preview, Pull Request Build, or Production build. See the [Build Logs](/docs/reference/cloud/build-logs) article for more information on accessing build details.

![Gatsby Cloud Function Invocations Log](../../images/function-invocation-log.png)

### Tracking invocation counts

Like the bandwidth and request tracking in Gatsby Cloud, users can track their invocation count across all their Gatsby sites on any workspace landing page as well as site-specific usage on any site page.

Additionally, users can view function-specific invocation counts in the function logs of the build details for any build that implements that function. See the [Platform Limits](/docs/reference/cloud/platform-limits) article for information on function invocation limits.

![Invocations Count on the Gatsby Cloud dashboard](../../images/function-invocation-count.png)
65 changes: 65 additions & 0 deletions docs/docs/how-to/cloud/deploying-to-firebase.md
@@ -0,0 +1,65 @@
---
title: "Deploying to Firebase on Gatsby Cloud"
description: "Learn how to deploy your Gatsby Cloud site to Firebase"
---

## Introduction

Gatsby Cloud is a performant platform for building your Gatsby site. Even better, it integrates with Content Delivery Networks (CDNs) like [Firebase](https://firebase.google.com/) so you can build and deploy your site seamlessly.

## Prerequisites

This guide assumes you already:

- Have a Firebase account.
- Have a Gatsby Cloud site created.

You can use either of the following site creation options if you don't have one already:

- [Create a Site from a Template](/docs/how-to/cloud/create-site-from-template)
- [Create a Site from a Repository](/docs/how-to/cloud/create-site-from-repository)

## Setting up a hosting integration

Once your site is available inside Gatsby Cloud, navigate to the "Site Settings" tab.

Inside "Site Settings," select **"Hosting > Hosting integrations."** Here you'll see Firebase listed among the other available hosting providers.

![Select Firebase from hosting integrations](../../images/firebase-hosting.png)

Click **“Connect”** to the right of the Firebase logo, and you’ll be prompted to login into your Firebase account. If you don’t have one, you can create one now.

Once you’re authenticated with Firebase, you’ll be prompted to authorize Gatsby Cloud to interact with Firebase on your behalf. After you’ve completed this step, you’re ready to configure deployment in Gatsby Cloud.

### Connect with a Firebase project

If you don’t already have one, create a Firebase project in your [Firebase console](https://console.firebase.google.com/).

On the “Firebase Integration” screen choose a Firebase project for deployment from the dropdown. Note that you can enter a Firebase site name for projects with multiple sites.

### Configuration with Firebase

Firebase allows you to configure customized hosting behavior such as redirects, headers, cache settings, and which files to deploy. You can define these behaviors in a `firebase.json` file. See [Deploying to Firebase](/docs/how-to/previews-deploys-hosting/deploying-to-firebase/) for the Gatsby recommended caching settings.

In order for Gatsby Cloud to use these settings for your Firebase hosting, you’ll need to make sure that your `firebase.json` file ends up in your `/public` directory when your build is complete.

One way you can accomplish this is by adding the following code to your `gatsby-node.js` file:

```javascript:title=gatsby-node.js
const fs = require("fs");
exports.onPostBuild = () => {
fs.copyFile(`./firebase.json`, `./public/firebase.json`, (err) => {
if (err) {
throw err;
}
});
};
```

Please see the [Firebase Hosting Configuration](https://firebase.google.com/docs/hosting/full-config) documentation for more deployment customization options.

## Finishing Up

And that’s it! Your site is now set up to build and deploy. Gatsby Cloud will handle everything for you. However, if you want to make a change to your domain, you’ll want to do that directly on the Firebase dashboard.

Note that you can only have one hosting integration. If you choose to configure another provider, that will override your existing Firebase integration.
39 changes: 39 additions & 0 deletions docs/docs/how-to/cloud/managing-workspace-members.md
@@ -0,0 +1,39 @@
---
title: "Managing Workspace Members"
description: "Learn how to manage the members and roles in your Gatsby Cloud Workspace"
---

There are four possible roles a user can have on Gatsby Cloud:

1. "Owner" - The person who created the Workspace on Gatsby Cloud is the Owner. An Owner can edit the Workspace, manage billing, and invite/manage Members.
1. "Admin" - An admin can edit the Workspace, manage billing, and invite / manage Members.
1. "Editor" - An Editor can create, view, and modify sites. They cannot manage billing or other Members.
1. "Viewer" - A Viewer can only view sites. They cannot create or modify sites.

## Managing Members in a Workspace

Owners can use the Workspace’s “Members” tab to invite a Member to the Workspace, resend an invitation, cancel an invitation, or delete a Member from the Workspace.

![Gatsby Cloud Workspace Members tab](../../images/workspace-members-tab.png)

## Inviting new Members to your Workspace

To invite a new Member to a Workspace, click the **“Add Members”** button from the “Members” tab in a Workspace.

![Invite members button](../../images/invite-members.png)

Once opened, enter the email address of the person you’d like to invite to your Workspace. Then, choose their role in the Workspace and what sites they should have access to.

![Add members pop-out screen](../../images/add-members-pop-out.png)

Once you invite a new Member to a Workspace, they’ll receive an email with a link to log in or create an account to join the Workspace.

## Managing existing Members

At any time, the Owner or an Admin of a Workspace can manage the Members of a Workspace. There are three options:

1. **"Transfer Ownership"** - This will transfer Ownership of the Workspace to this Member. Once confirmed, the selected Member will become the new Owner and you will become an Editor.
1. **"Modify Member"** - This allows you to change the role or site access for the selected Member.
1. **"Remove Member"** - This will remove the Member from the Workspace. It will not delete their Gatsby Cloud account, but they will no longer be able to access this Workspace.

![Member management dropdown menu](../../images/manage-existing-members.png)
24 changes: 24 additions & 0 deletions docs/docs/how-to/cloud/new-account-signup.md
@@ -0,0 +1,24 @@
---
title: "Signing Up for a New Gatsby Cloud Account"
description: "Learn how to sign up and create a Gatsby Cloud account"
---

## Prerequisites

You will need an account with a version control system (VCS) provider. We currently support Github, GitLab, and Bitbucket.

To sign up for an account, visit our [sign up page](http://gatsbyjs.com/dashboard/signup) and select your authorization method.

![Gatsby Cloud sign up page](../../images/sign-up-page.png)

You will be redirected to your provider's authorization page where you must grant access to the Gatsby Cloud app.

![Gatsby Cloud app permissions](../../images/gatsby-cloud-app-permissions.png)

After clicking **"Authorize"**, you will be prompted to enter your name, email, location, and what brings you to Gatsby Cloud.

![Gatsby Cloud signup details](../../images/gatsby-cloud-signup-details.png)

After selecting **"Complete sign up"** you will see your account dashboard.

![Gatsby Cloud dashboard](../../images/gatsby-cloud-dashboard.png)
8 changes: 8 additions & 0 deletions docs/docs/how-to/cloud/npm-7-peer-dependencies.md
@@ -0,0 +1,8 @@
---
title: "Using npm 7 Peer Dependencies With Gatsby Cloud"
description: "Learn how to handle conflicting peer dependencies on Gatsby Cloud when using npm 7"
---

If you are using [npm](/docs/glossary/npm/) 7, you may encounter conflicting peer dependencies that cause a build failure.

[Adding the environment variable](/docs/reference/cloud/managing-environment-variables) `NPM_CONFIG_LEGACY_PEER_DEPS=true` will force the legacy behavior and use the peer dependency behavior of npm versions 3 - 6. Be aware that, per the [npm docs](https://docs.npmjs.com/cli/v7/using-npm/config#legacy-peer-deps), use of `legacy-peer-deps` is not recommended, as it will not enforce the `peerDependencies` contract that meta-dependencies may rely on.
Binary file added docs/docs/images/add-members-pop-out.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/docs/images/build-log-title-link.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/docs/images/build-sharing-link.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/docs/images/cms-preview.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/docs/images/contentful-quick-connect.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/docs/images/deploy-to-gatsby-cloud.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/docs/images/error-and-warning-logs.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/docs/images/firebase-hosting.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/docs/images/function-invocation-count.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/docs/images/function-invocation-log.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/docs/images/gatsby-cloud-dashboard.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/docs/images/gatsby-cloud-data-sources.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/docs/images/gatsby-cloud-signup-details.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/docs/images/idle-preview.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/docs/images/invite-members.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/docs/images/manage-existing-members.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/docs/images/preview-build-link.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/docs/images/raw-logs.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/docs/images/sample-env-var.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/docs/images/sign-up-page.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/docs/images/structured-logs.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/docs/images/workspace-members-tab.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
42 changes: 42 additions & 0 deletions docs/docs/reference/cloud/build-logs.md
@@ -0,0 +1,42 @@
---
title: "Build Logs"
description: "Learn how to view and understand build logs on Gatsby Cloud"
---

Gatsby Cloud provides a few helpful views of build logs to understand more about what is happening during the build process.

## Viewing build logs

You can view logs by clicking on the "title link" on any Production or Pull Request build card.

![Build log title link](../../images/build-log-title-link.png)

For CMS Preview builds, click the **"View Details"** link on the build card.

![CMS Preview build link](../../images/preview-build-link.png)

Select **"Share"** at the top of the logs page to copy the page link. This is useful for when you need to contact Customer Support.

![Build sharing link](../../images/build-sharing-link.png)

## Structured logs

Structured logs provide an immediate, high-level overview of the status of your build. They include information about how long each build step lasted as well as any warnings or errors. They are shown in the "All Logs" tab. Structure logging is only available on Gatsby version `2.16.0` or later.

![Gatsby Cloud structured build logs](../../images/structured-logs.png)

### Error and warning logs

The Error and Warnings tabs filter the structured logging to only show, errors or warnings, respectively.

![Gatsby Cloud error and warning logs](../../images/error-and-warning-logs.png)

## Raw logs

Raw logs provide the full, unstructured build process output. They are useful for finding more detail about exactly where things went wrong.

![Gatsby Cloud raw build logs](../../images/raw-logs.png)

### Verbose logs

You can get verbose logging by [setting an environment variable](/docs/reference/cloud/managing-environment-variables): `VERBOSE=1`
65 changes: 65 additions & 0 deletions docs/docs/reference/cloud/cms-previews.md
@@ -0,0 +1,65 @@
---
title: "CMS Previews"
description: "Learn how to enable your content editors to preview their CMS content changes from Gatsby Cloud"
---

If your site uses a content management system (CMS), Gatsby Cloud provides a tool to quickly preview content changes and collaborate with content editors. When you add a site to Gatsby Cloud, you will find CMS Previews under the "CMS Preview" tab of the Site Overview.

![CMS Preview tab on Gatsby Cloud](../../images/cms-preview.png)

A "CMS Preview" is a development build of your site that enables you to make changes in your CMS and see those changes take effect in real-time.

Using CMS Previews requires connecting your site to [one of the supported CMSs](/docs/reference/cloud/hosting-and-data-source-integrations). Check out the [Connecting to a Content Management System](https://support.gatsbyjs.com/hc/en-us/sections/360011112314-Connecting-to-a-Content-Management-System) tutorials for more information on how to configure your site for CMS Previews.

## How CMS Previews are triggered

A CMS Preview build may be triggered when any of the following events occur:

- A change in the connected CMS (such as an autosave while typing, save, or publish action).
- A Git commit to the production branch configured in "Site Settings."
- Manually clicking the "Trigger Build" or "Restart Preview" button in the Gatsby Cloud user interface.
- A `POST` request to the Preview Webhook.

## How CMS Previews are built

There are two CMS Preview build approaches; these are the "legacy" preview experience and the new "incremental preview" build.

### Incremental Preview

This is the default preview builder. It is a production build of your site using preview data as specified by your environment variables. The main benefits are:

- Fast updates after initial build.
- All successful preview builds are always available.
- Support for the [preview status indicator](/docs/reference/release-notes/v3.6/#preview-status-indicator) on Gatsby v3 and later.

All other [CMSs integrations for Gatsby Cloud](https://support.gatsbyjs.com/hc/en-us/sections/360011112314-Connecting-to-a-Content-Management-System) support incremental previews. Of these, the following require a specific source plugin version:

- WordPress: `gatsby-source-wordpress ≥ 5.2.3`
- DatoCMS: `gatsby-source-datocms ≥ 2.6.15`
- Sanity: `gatsby-source-sanity ≥ 7.3.2`

Incremental Previews are those noted with the "CLOUD" badge:

![Incremental preview cloud badge](../../images/incremental-preview-cloud-badge.png)

### Legacy Preview

This preview builder is only used where incremental previews are not possible. The build process is similar to `gatsby develop` in local development. It is subject to resource timeouts and the preview will not be available until the next build completes after a timeout occurs.

## Preview extensions

Some CMSs support a preview extension that enables you to view your CMS Preview build without having to leave your CMS. Preview extensions are available for:

- Contentful
- Cosmic
- DatoCMS
- WordPress
- Sanity

Check out the [Preview Extensions](https://support.gatsbyjs.com/hc/en-us/sections/360012244833) tutorials for more information. WordPress preview loader doesn't support password-protected preview instances.

## Disabling Preview

You can disable Preview by visiting "Site Settings > Preview" and unchecking **"Enable CMS Preview builds"**.

If your preview fails to build for 10 consecutive builds, Gatsby Cloud will automatically disable the Preview.
43 changes: 43 additions & 0 deletions docs/docs/reference/cloud/hosting-and-data-source-integrations.md
@@ -0,0 +1,43 @@
---
title: "Hosting and Data Source Integrations"
description: "Learn about the various hosting and CMS platforms available for integration on Gatsby Cloud"
---

Gatsby Cloud provides integrations for many popular hosting and content management platforms that help make development with Gatsby even more efficient.

## Hosting integrations

Hosting integrations simplify deploying your site to the internet. The following hosting services are officially supported and have automated integrations:

- Azure
- Amazon Web Services S3
- Fastly
- Firebase
- Google Storage
- Netlify
- Vercel

When you set up a hosting integration, your site will automatically be deployed to your chosen service any time a Production Build completes successfully.

## Data source ntegrations

Data source integrations make it easy to connect your site to a content management system (CMS). The following CMS providers are officially supported and can be automatically configured with [Quick Connect](/docs/reference/cloud/quick-connect):

- Contentful
- Cosmic
- DatoCMS
- Sanity

The following CMS providers are also officially supported but require manual configuration:

- Agility
- Contentstack
- Drupal
- Flotiq
- Kontent
- Strapi
- WordPress

Depending on the configuration, whenever you make updates in your CMS, you can automatically trigger Production Builds and CMS Previews for your site.

For details on how to set up a hosting or data source integration, see our [How-To Guides](/docs/how-to/cloud/).

0 comments on commit bc04e8f

Please sign in to comment.