gatsbyjs · Mar 14, 2022 · Mar 15, 2022 · Mar 15, 2022 · Mar 15, 2022 · Mar 16, 2022
Showing 515 changed files with 22,389 additions and 10,427 deletions.
diff --git a/.circleci/config.yml b/.circleci/config.yml
@@ -350,9 +350,6 @@ jobs:
       - run: # Quick upgrade to the v2 (any version, we just need the real set version)
           command: yarn policies set-version berry
           working_directory: /tmp/e2e-tests/gatsby-pnp
-      - run: # TODO: remove pinned version
-          command: yarn set version 3.1.1
-          working_directory: /tmp/e2e-tests/gatsby-pnp
       - run: # Explicitly set nodeLinker to avoid Yarn selecting node_modules due to the Yarn 1.x lockfile
           command: yarn config set nodeLinker pnp
           working_directory: /tmp/e2e-tests/gatsby-pnp

diff --git a/.github/actions/gatsby-site-showcase-validator/README.md b/.github/actions/gatsby-site-showcase-validator/README.md
@@ -1,5 +1,5 @@
 # Gatsby Site Showcase Validator
 
-A simple node script that visits and checks all of the sites in the [Site Showcase](https://www.gatsbyjs.org/showcase/) for Gatsby.
+A simple node script that visits and checks all of the sites in the [Site Showcase](https://www.gatsbyjs.com/showcase/) for Gatsby.
 
 Run locally [using act](https://github.com/nektos/act): `act -a "gatsby-site-showcase-validator"`
diff --git a/README.md b/README.md
@@ -62,41 +62,33 @@
 
 Gatsby helps professional developers efficiently create maintainable, highly-performant, content-rich websites.
 
-- **Go Beyond Static Websites.** Get all the benefits of static websites with none of the
-  limitations. Gatsby sites are fully functional React apps, so you can create high-quality,
-  dynamic web apps, from blogs to e-commerce sites to user dashboards.
+- **Load Data From Anywhere.** Gatsby pulls in data from any data source, whether it’s Markdown files, a headless CMS like Contentful or WordPress, or a REST or GraphQL API. Use source plugins to load your data, then develop using Gatsby’s uniform GraphQL interface.
 
-- **Choose your Rendering Options.** You can choose alternative [rendering options](https://gatsbyjs.com/docs/conceptual/rendering-options/), namely Deferred Static Generation (DSG) and Server-Side Rendering (SSR), in addition to Static Site Generation (SSG) — on a per-page basis. This type of granular control allows you to optimize for performance and productivity without sacrificing one for the other.
+- **Go Beyond Static Websites.** Get all the benefits of static websites with none of the limitations. Gatsby sites are fully functional React apps, so you can create high-quality, dynamic web apps, from blogs to e-commerce sites to user dashboards.
 
-- **Use a Modern Stack for Every Site.** No matter where the data comes from, Gatsby sites are
-  built using React and GraphQL. Build a uniform workflow for you and your team, regardless of
-  whether the data is coming from the same backend.
+- **Choose your Rendering Options.** You can choose alternative [rendering options](https://gatsbyjs.com/docs/conceptual/rendering-options/), namely Deferred Static Generation (DSG) and Server-Side Rendering (SSR), in addition to Static Site Generation (SSG) — on a per-page basis. This type of granular control allows you to optimize for performance and productivity without sacrificing one for the other.
 
-- **Load Data From Anywhere.** Gatsby pulls in data from any data source, whether it’s Markdown
-  files, a headless CMS like Contentful or WordPress, or a REST or GraphQL API. Use source plugins
-  to load your data, then develop using Gatsby’s uniform GraphQL interface.
+- **Performance Is Baked In.** Ace your performance audits by default. Gatsby automates code splitting, image optimization, inlining critical styles, lazy-loading, prefetching resources, and more to ensure your site is fast — no manual tuning required.
 
-- **Performance Is Baked In.** Ace your performance audits by default. Gatsby automates code
-  splitting, image optimization, inlining critical styles, lazy-loading, prefetching resources,
-  and more to ensure your site is fast — no manual tuning required.
+- **Use a Modern Stack for Every Site.** No matter where the data comes from, Gatsby sites are built using React and GraphQL. Build a uniform workflow for you and your team, regardless of whether the data is coming from the same backend.
 
-- **Host at Scale for Pennies.** Gatsby sites don’t require servers, so you can host your entire
-  site on a CDN for a fraction of the cost of a server-rendered site. Many Gatsby sites can be
-  hosted entirely free on [Gatsby Cloud](https://www.gatsbyjs.com/cloud/) and other similar services.
+- **Host at Scale for Pennies.** Gatsby sites don’t require servers, so you can host your entire site on a CDN for a fraction of the cost of a server-rendered site. Many Gatsby sites can be hosted entirely free on [Gatsby Cloud](https://www.gatsbyjs.com/cloud/) and other similar services.
 
 [**Learn how to use Gatsby for your next project.**](https://www.gatsbyjs.com/docs/)
 
-## What’s In This Document
+## 🚀 Ship your first Gatsby site in 5 Minutes
+
+Click the link below to quickly try the workflow of developing, building, and deploying websites with Gatsby and Gatsby Cloud.
+
+[<img src="https://www.gatsbyjs.com/deploynow.svg" alt="Deploy to Gatsby Cloud">](https://www.gatsbyjs.com/dashboard/deploynow?url=https://github.com/gatsbyjs/gatsby-starter-blog&utm_source=github&utm_medium=link&utm_campaign=onboarding&utm_content=oss)
+
+At the end of this process, you'll have
 
-- [Get Up and Running in 5 Minutes](#-get-up-and-running-in-5-minutes)
-- [Learning Gatsby](#-learning-gatsby)
-- [Release Notes](#-release-notes)
-- [Migration Guides](#-migration-guides)
-- [How to Contribute](#-how-to-contribute)
-- [License](#-license)
-- [Thanks to Our Contributors](#-thanks)
+1. a site working on Gatsby Cloud
+2. a new repository that is linked to that new site
+3. as you push changes to your new repository, Gatsby Cloud will automatically rebuild and redeploy your site!
 
-## 🚀 Get Up and Running in 5 Minutes
+## 💻 Get started with Gatsby _locally_ in 5 Minutes
 
 You can get a new Gatsby site up and running on your local dev environment in 5 minutes with these four steps:
 

diff --git a/benchmarks/gabe-csv-markdown/src/components/bio.js b/benchmarks/gabe-csv-markdown/src/components/bio.js
@@ -2,7 +2,7 @@
  * Bio component that queries for data
  * with Gatsby's useStaticQuery component
  *
- * See: https://www.gatsbyjs.org/docs/use-static-query/
+ * See: https://www.gatsbyjs.com/docs/use-static-query/
  */
 
 import React from "react"

diff --git a/benchmarks/gabe-csv-markdown/src/components/layout.js b/benchmarks/gabe-csv-markdown/src/components/layout.js
@@ -62,7 +62,7 @@ class Layout extends React.Component {
         <footer>
           © {new Date().getFullYear()}, Built with
           {` `}
-          <a href="https://www.gatsbyjs.org">Gatsby</a>
+          <a href="https://www.gatsbyjs.com">Gatsby</a>
         </footer>
       </div>
     )

diff --git a/benchmarks/gabe-csv-text/src/components/bio.js b/benchmarks/gabe-csv-text/src/components/bio.js
@@ -2,7 +2,7 @@
  * Bio component that queries for data
  * with Gatsby's useStaticQuery component
  *
- * See: https://www.gatsbyjs.org/docs/use-static-query/
+ * See: https://www.gatsbyjs.com/docs/use-static-query/
  */
 
 import React from "react"

diff --git a/benchmarks/gabe-csv-text/src/components/layout.js b/benchmarks/gabe-csv-text/src/components/layout.js
@@ -62,7 +62,7 @@ class Layout extends React.Component {
         <footer>
           © {new Date().getFullYear()}, Built with
           {` `}
-          <a href="https://www.gatsbyjs.org">Gatsby</a>
+          <a href="https://www.gatsbyjs.com">Gatsby</a>
         </footer>
       </div>
     )

diff --git a/benchmarks/gabe-fs-markdown-images/src/components/bio.js b/benchmarks/gabe-fs-markdown-images/src/components/bio.js
@@ -2,7 +2,7 @@
  * Bio component that queries for data
  * with Gatsby's useStaticQuery component
  *
- * See: https://www.gatsbyjs.org/docs/use-static-query/
+ * See: https://www.gatsbyjs.com/docs/use-static-query/
  */
 
 import React from "react"

diff --git a/benchmarks/gabe-fs-markdown-images/src/components/layout.js b/benchmarks/gabe-fs-markdown-images/src/components/layout.js
@@ -62,7 +62,7 @@ class Layout extends React.Component {
         <footer>
           © {new Date().getFullYear()}, Built with
           {` `}
-          <a href="https://www.gatsbyjs.org">Gatsby</a>
+          <a href="https://www.gatsbyjs.com">Gatsby</a>
         </footer>
       </div>
     )

diff --git a/benchmarks/gabe-fs-markdown-route-api/src/components/bio.js b/benchmarks/gabe-fs-markdown-route-api/src/components/bio.js
@@ -2,7 +2,7 @@
  * Bio component that queries for data
  * with Gatsby's useStaticQuery component
  *
- * See: https://www.gatsbyjs.org/docs/use-static-query/
+ * See: https://www.gatsbyjs.com/docs/use-static-query/
  */
 
 import React from "react"

diff --git a/benchmarks/gabe-fs-markdown-route-api/src/components/layout.js b/benchmarks/gabe-fs-markdown-route-api/src/components/layout.js
@@ -62,7 +62,7 @@ class Layout extends React.Component {
         <footer>
           © {new Date().getFullYear()}, Built with
           {` `}
-          <a href="https://www.gatsbyjs.org">Gatsby</a>
+          <a href="https://www.gatsbyjs.com">Gatsby</a>
         </footer>
       </div>
     )

diff --git a/benchmarks/gabe-fs-markdown/src/components/bio.js b/benchmarks/gabe-fs-markdown/src/components/bio.js
@@ -2,7 +2,7 @@
  * Bio component that queries for data
  * with Gatsby's useStaticQuery component
  *
- * See: https://www.gatsbyjs.org/docs/use-static-query/
+ * See: https://www.gatsbyjs.com/docs/use-static-query/
  */
 
 import React from "react"

diff --git a/benchmarks/gabe-fs-markdown/src/components/layout.js b/benchmarks/gabe-fs-markdown/src/components/layout.js
@@ -62,7 +62,7 @@ class Layout extends React.Component {
         <footer>
           © {new Date().getFullYear()}, Built with
           {` `}
-          <a href="https://www.gatsbyjs.org">Gatsby</a>
+          <a href="https://www.gatsbyjs.com">Gatsby</a>
         </footer>
       </div>
     )

diff --git a/benchmarks/gabe-fs-mdx/src/components/layout.js b/benchmarks/gabe-fs-mdx/src/components/layout.js
@@ -62,7 +62,7 @@ class Layout extends React.Component {
         <footer>
           © {new Date().getFullYear()}, Built with
           {` `}
-          <a href="https://www.gatsbyjs.org">Gatsby</a>
+          <a href="https://www.gatsbyjs.com">Gatsby</a>
         </footer>
       </div>
     )

diff --git a/benchmarks/gabe-fs-text/src/components/bio.js b/benchmarks/gabe-fs-text/src/components/bio.js
@@ -2,7 +2,7 @@
  * Bio component that queries for data
  * with Gatsby's useStaticQuery component
  *
- * See: https://www.gatsbyjs.org/docs/use-static-query/
+ * See: https://www.gatsbyjs.com/docs/use-static-query/
  */
 
 import React from "react"

diff --git a/benchmarks/gabe-fs-text/src/components/layout.js b/benchmarks/gabe-fs-text/src/components/layout.js
@@ -62,7 +62,7 @@ class Layout extends React.Component {
         <footer>
           © {new Date().getFullYear()}, Built with
           {` `}
-          <a href="https://www.gatsbyjs.org">Gatsby</a>
+          <a href="https://www.gatsbyjs.com">Gatsby</a>
         </footer>
       </div>
     )

diff --git a/benchmarks/gabe-json-text/src/components/bio.js b/benchmarks/gabe-json-text/src/components/bio.js
@@ -2,7 +2,7 @@
  * Bio component that queries for data
  * with Gatsby's useStaticQuery component
  *
- * See: https://www.gatsbyjs.org/docs/use-static-query/
+ * See: https://www.gatsbyjs.com/docs/use-static-query/
  */
 
 import React from "react"

diff --git a/benchmarks/gabe-json-text/src/components/layout.js b/benchmarks/gabe-json-text/src/components/layout.js
@@ -62,7 +62,7 @@ class Layout extends React.Component {
         <footer>
           © {new Date().getFullYear()}, Built with
           {` `}
-          <a href="https://www.gatsbyjs.org">Gatsby</a>
+          <a href="https://www.gatsbyjs.com">Gatsby</a>
         </footer>
       </div>
     )

diff --git a/benchmarks/gabe-yaml-text/src/components/bio.js b/benchmarks/gabe-yaml-text/src/components/bio.js
@@ -2,7 +2,7 @@
  * Bio component that queries for data
  * with Gatsby's useStaticQuery component
  *
- * See: https://www.gatsbyjs.org/docs/use-static-query/
+ * See: https://www.gatsbyjs.com/docs/use-static-query/
  */
 
 import React from "react"

diff --git a/benchmarks/gabe-yaml-text/src/components/layout.js b/benchmarks/gabe-yaml-text/src/components/layout.js
@@ -62,7 +62,7 @@ class Layout extends React.Component {
         <footer>
           © {new Date().getFullYear()}, Built with
           {` `}
-          <a href="https://www.gatsbyjs.org">Gatsby</a>
+          <a href="https://www.gatsbyjs.com">Gatsby</a>
         </footer>
       </div>
     )

diff --git a/benchmarks/image-processing/gatsby-browser.js b/benchmarks/image-processing/gatsby-browser.js
@@ -1,7 +1,7 @@
 /**
  * Implement Gatsby's Browser APIs in this file.
  *
- * See: https://www.gatsbyjs.org/docs/browser-apis/
+ * See: https://www.gatsbyjs.com/docs/browser-apis/
  */
 
 // You can delete this file if you're not using it
diff --git a/benchmarks/image-processing/gatsby-ssr.js b/benchmarks/image-processing/gatsby-ssr.js
@@ -1,7 +1,7 @@
 /**
  * Implement Gatsby's SSR (Server Side Rendering) APIs in this file.
  *
- * See: https://www.gatsbyjs.org/docs/ssr-apis/
+ * See: https://www.gatsbyjs.com/docs/ssr-apis/
  */
 
 // You can delete this file if you're not using it
diff --git a/benchmarks/image-processing/src/components/image.js b/benchmarks/image-processing/src/components/image.js
@@ -10,7 +10,7 @@ import Img from "gatsby-image"
  *
  * For more information, see the docs:
  * - `gatsby-image`: https://gatsby.dev/gatsby-image
- * - `useStaticQuery`: https://www.gatsbyjs.org/docs/use-static-query/
+ * - `useStaticQuery`: https://www.gatsbyjs.com/docs/use-static-query/
  */
 
 const Image = () => {

diff --git a/benchmarks/image-processing/src/components/layout.js b/benchmarks/image-processing/src/components/layout.js
@@ -2,7 +2,7 @@
  * Layout component that queries for data
  * with Gatsby's useStaticQuery component
  *
- * See: https://www.gatsbyjs.org/docs/use-static-query/
+ * See: https://www.gatsbyjs.com/docs/use-static-query/
  */
 
 import React from "react"
@@ -38,7 +38,7 @@ const Layout = ({ children }) => {
         <footer>
           © {new Date().getFullYear()}, Built with
           {` `}
-          <a href="https://www.gatsbyjs.org">Gatsby</a>
+          <a href="https://www.gatsbyjs.com">Gatsby</a>
         </footer>
       </div>
     </>

diff --git a/benchmarks/image-processing/src/components/seo.js b/benchmarks/image-processing/src/components/seo.js
@@ -2,7 +2,7 @@
  * SEO component that queries for data with
  *  Gatsby's useStaticQuery React hook
  *
- * See: https://www.gatsbyjs.org/docs/use-static-query/
+ * See: https://www.gatsbyjs.com/docs/use-static-query/
  */
 
 import React from "react"

diff --git a/benchmarks/markdown_id/src/components/bio.js b/benchmarks/markdown_id/src/components/bio.js
@@ -2,7 +2,7 @@
  * Bio component that queries for data
  * with Gatsby's useStaticQuery component
  *
- * See: https://www.gatsbyjs.org/docs/use-static-query/
+ * See: https://www.gatsbyjs.com/docs/use-static-query/
  */
 
 import React from "react"

diff --git a/benchmarks/markdown_id/src/components/layout.js b/benchmarks/markdown_id/src/components/layout.js
@@ -65,7 +65,7 @@ class Layout extends React.Component {
         <footer>
           © {new Date().getFullYear()}, Built with
           {` `}
-          <a href="https://www.gatsbyjs.org">Gatsby</a>
+          <a href="https://www.gatsbyjs.com">Gatsby</a>
         </footer>
       </div>
     )

diff --git a/benchmarks/markdown_id/src/components/seo.js b/benchmarks/markdown_id/src/components/seo.js
@@ -2,7 +2,7 @@
  * SEO component that queries for data with
  *  Gatsby's useStaticQuery React hook
  *
- * See: https://www.gatsbyjs.org/docs/use-static-query/
+ * See: https://www.gatsbyjs.com/docs/use-static-query/
  */
 
 import React from "react"

diff --git a/benchmarks/markdown_slug/src/components/bio.js b/benchmarks/markdown_slug/src/components/bio.js
@@ -2,7 +2,7 @@
  * Bio component that queries for data
  * with Gatsby's useStaticQuery component
  *
- * See: https://www.gatsbyjs.org/docs/use-static-query/
+ * See: https://www.gatsbyjs.com/docs/use-static-query/
  */
 
 import React from "react"

diff --git a/benchmarks/markdown_slug/src/components/layout.js b/benchmarks/markdown_slug/src/components/layout.js
@@ -65,7 +65,7 @@ class Layout extends React.Component {
         <footer>
           © {new Date().getFullYear()}, Built with
           {` `}
-          <a href="https://www.gatsbyjs.org">Gatsby</a>
+          <a href="https://www.gatsbyjs.com">Gatsby</a>
         </footer>
       </div>
     )

diff --git a/benchmarks/markdown_slug/src/components/seo.js b/benchmarks/markdown_slug/src/components/seo.js
@@ -2,7 +2,7 @@
  * SEO component that queries for data with
  *  Gatsby's useStaticQuery React hook
  *
- * See: https://www.gatsbyjs.org/docs/use-static-query/
+ * See: https://www.gatsbyjs.com/docs/use-static-query/
  */
 
 import React from "react"

diff --git a/benchmarks/source-agilitycms/gatsby-config.js b/benchmarks/source-agilitycms/gatsby-config.js
@@ -13,7 +13,7 @@ const agilityConfig = {
 /**
  * Configure your Gatsby site with this file.
  *
- * See: https://www.gatsbyjs.org/docs/gatsby-config/
+ * See: https://www.gatsbyjs.com/docs/gatsby-config/
  */
 
 module.exports = {

diff --git a/benchmarks/source-strapi/gatsby-browser.js b/benchmarks/source-strapi/gatsby-browser.js
@@ -1,7 +1,7 @@
 /**
  * Implement Gatsby's Browser APIs in this file.
  *
- * See: https://www.gatsbyjs.org/docs/browser-apis/
+ * See: https://www.gatsbyjs.com/docs/browser-apis/
  */
 
 // You can delete this file if you're not using it
diff --git a/deprecated-packages/gatsby-image/README.md b/deprecated-packages/gatsby-image/README.md
@@ -269,7 +269,7 @@ format, use the `withWebp` fragments. If the browser doesn't support WebP,
 `gatsby-image` will fall back to the default image format.
 
 For more information about these options, please see the
-[Gatsby Image API](https://www.gatsbyjs.org/docs/gatsby-image/#image-query-fragments).
+[Gatsby Image API](https://www.gatsbyjs.com/docs/gatsby-image/#image-query-fragments).
 
 _Please see the
 [gatsby-plugin-sharp](/plugins/gatsby-plugin-sharp/#tracedsvg)

diff --git a/deprecated-packages/gatsby-image/src/index.js b/deprecated-packages/gatsby-image/src/index.js
@@ -192,7 +192,7 @@ function groupByMedia(imageVariants) {
 
   if (without.length > 1 && process.env.NODE_ENV !== `production`) {
     console.warn(
-      `We've found ${without.length} sources without a media property. They might be ignored by the browser, see: https://www.gatsbyjs.org/packages/gatsby-image/#art-directing-multiple-images`
+      `We've found ${without.length} sources without a media property. They might be ignored by the browser, see: https://www.gatsbyjs.com/plugins/gatsby-image/#art-directing-multiple-images`
     )
   }
 

diff --git a/deprecated-packages/gatsby-plugin-create-client-paths/README.md b/deprecated-packages/gatsby-plugin-create-client-paths/README.md
@@ -4,7 +4,7 @@
 
 Use this plugin to simplify creating a “hybrid” Gatsby app with both statically rendered pages as well as "client-paths". These paths exist on the client only and do not correspond to index.html files in an app's built assets.
 
-For more information refer to [client-only routes & user authentication](https://www.gatsbyjs.org/docs/client-only-routes-and-user-authentication/).
+For more information refer to [client-only routes & user authentication](https://www.gatsbyjs.com/docs/client-only-routes-and-user-authentication/).
 
 ## Migration
 

diff --git a/deprecated-packages/gatsby-recipes/CONTRIBUTING.md b/deprecated-packages/gatsby-recipes/CONTRIBUTING.md
@@ -88,7 +88,7 @@ This example will be used throughout this document as an illustration tool.
 
 ## Setting up a development environment
 
-First [follow the instructions on setting up a local Gatsby dev environment](https://www.gatsbyjs.org/contributing/setting-up-your-local-dev-environment/).
+First [follow the instructions on setting up a local Gatsby dev environment](https://www.gatsbyjs.com/contributing/setting-up-your-local-dev-environment/).
 
 ### Running the unit tests
 
@@ -108,7 +108,7 @@ yarn jest packages/gatsby-recipes --testPathPattern "providers" --watch
 
 ### Using gatsby-dev-cli
 
-You can create test recipes that you run in a test site. You’ll need to [use `gatsby-dev-cli` for this.](https://www.gatsbyjs.org/contributing/setting-up-your-local-dev-environment/#gatsby-functional-changes).
+You can create test recipes that you run in a test site. You’ll need to [use `gatsby-dev-cli` for this.](https://www.gatsbyjs.com/contributing/setting-up-your-local-dev-environment/#gatsby-functional-changes).
 
 One note, as you’ll be testing changes to the Gatsby CLI — instead of running the global gatsby-cli package (i.e. what you’d run by typing `gatsby`, you’ll want to run the version copied over by `gatsby-dev-cli` by running `./node_modules/.bin/gatsby`.