profile
viewpoint
If you are wondering where the data of this site comes from, please visit https://api.github.com/users/jxnblk/events. GitMemory does not store any data, but only uses NGINX to cache data for a period of time. The idea behind GitMemory is simply to give users a better reading experience.
Brent Jackson jxnblk @gatsbyjs New York City https://jxnblk.com Building @system-ui @styled-system, @rebassjs, MDX Deck

c8r/x0 1703

Document & develop React components without breaking a sweat

cxs-css/cxs 1169

fast af css-in-js in 0.7kb

johno/immutable-css 380

A css linter for immutable selectors

c8r/lab 348

React UI component design tool

johno/digital-garden 215

🌻[WIP] Gatsby Theme to build your own digital garden 🌻🥀🌸

jxnblk/axs 214

Stupid simple style components for React

c8r/micro-react 163

Create microservice apps with React components

c8r/iso 157

Build pages and prototypes with Lab UI components. No configuration or build setup required.

jxnblk/Ashley 108

A Readable & Responsive Theme for Tumblr

broccolini/dark-mode 42

Prototype for dark mode with a GitHub profile

push eventgatsbyjs/gatsby

jxnblk

commit sha 0444916524048c37c12ba857b9af45e14cbaaaec

chore(docs): fix typo

view details

push time in 7 days

push eventgatsbyjs/gatsby

Brent Jackson

commit sha 3746065db3bc0436bf649d298b5b2354a10c14ca

Update docs/docs/graphql-reference.md Co-authored-by: Florian Kissling <21834+fk@users.noreply.github.com>

view details

push time in 7 days

push eventgatsbyjs/gatsby

Brent Jackson

commit sha b91903ec9d88856c5af07ae235e65807fbff724d

Update docs/docs/graphql-reference.md Co-authored-by: Florian Kissling <21834+fk@users.noreply.github.com>

view details

push time in 7 days

PullRequestReviewEvent

Pull request review commentgatsbyjs/gatsby

Docs: fix GraphQL Reference

 title: GraphQL Query Options Reference  ## Intro -This page will walk you through a series of GraphQL queries, each designed to demonstrate a particular feature of GraphQL. You'll be querying the _real_ schema used on [graphql-reference example](https://github.com/gatsbyjs/gatsby/tree/master/examples/graphql-reference) so feel free to experiment and poke around the innards of the site! You can also open the [CodeSandbox version](https://codesandbox.io/s/github/gatsbyjs/gatsby/tree/master/examples/graphql-reference) ([Direct link to GraphiQL](<https://graphql-reference-1124782374.gtsb.io/___graphql?query=%7B%0A%20%20site%20%7B%0A%20%20%20%20siteMetadata%20%7B%0A%20%20%20%20%20%20title%0A%20%20%20%20%20%20description%0A%20%20%20%20%7D%0A%20%20%7D%0A%20%20books%3A%20allMarkdownRemark(filter%3A%20%7Bfrontmatter%3A%20%7Btitle%3A%20%7Bne%3A%20%22%22%7D%7D%7D)%20%7B%0A%20%20%20%20totalCount%0A%20%20%20%20edges%20%7B%0A%20%20%20%20%20%20node%20%7B%0A%20%20%20%20%20%20%20%20frontmatter%20%7B%0A%20%20%20%20%20%20%20%20%20%20title%0A%20%20%20%20%20%20%20%20%20%20date(fromNow%3A%20true)%0A%20%20%20%20%20%20%20%20%20%20author%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20id%0A%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%20%20%7D%0A%20%20authors%3A%20allAuthorYaml%20%7B%0A%20%20%20%20totalCount%0A%20%20%20%20edges%20%7B%0A%20%20%20%20%20%20node%20%7B%0A%20%20%20%20%20%20%20%20id%0A%20%20%20%20%20%20%20%20bio%0A%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%20%20%7D%0A%7D%0A>)) of it.+This page will walk you through a series of GraphQL queries, each designed to demonstrate a particular feature of GraphQL.+These examples will work on the _real_ schema used on [graphql-reference example](https://github.com/gatsbyjs/gatsby/tree/master/examples/graphql-reference).+You can run this example locally to experiment and poke around the innards of the site!+You can also open the [CodeSandbox version](https://codesandbox.io/s/github/gatsbyjs/gatsby/tree/master/examples/graphql-reference) of it. -You'll be using GraphiQL, an interactive editor you can also use [while building your Gatsby site](/docs/tutorial/part-five/#introducing-graphiql).+For more information, read about [why Gatsby uses GraphQL](/docs/why-gatsby-uses-graphql/) and [how to use GraphiQL][] in any Gatsby site. -For more information, read about [why Gatsby uses GraphQL](/docs/why-gatsby-uses-graphql/).+[how to use graphiql]: https://www.gatsbyjs.com/docs/tutorial/part-4/#use-graphiql-to-explore-the-data-layer-and-write-graphql-queries  ## Basic query -Start with the basics, pulling up the site `title` from your `gatsby-config.js`'s `siteMetadata`. Here the query is on the left and the results are on the right.+Start with the basics, pulling up the site `title` from your `gatsby-config.js`'s `siteMetadata`. -<iframe-  title="A basic query"-  src="https://graphql-reference-1124782374.gtsb.io/___graphql?query=%7B%0A%20%20site%20%7B%0A%20%20%20%20siteMetadata%20%7B%0A%20%20%20%20%20%20title%0A%20%20%20%20%7D%0A%20%20%7D%0A%7D%0A&explorerIsOpen=false"-  width="600"-  height="400"-  loading="lazy"-></iframe>+```graphql+{+  site {+    siteMetadata {+      title+    }+  }+}+``` -Try editing the query to include the `description` from `siteMetadata`. When typing in the query editor you can use `Ctrl + Space` to see autocomplete options and `Ctrl + Enter` to run the current query.+In the GraphiQL editor, try editing the query to include the `description` from `siteMetadata`. When typing in the query editor you can use `Ctrl + Space` to see autocomplete options and `Ctrl + Enter` to run the current query.  ## A longer query  Gatsby structures its content as collections of `nodes`, which are connected to each other with `edges`. In this query you ask for the total count of plugins in this Gatsby site, along with specific information about each one. -<iframe-  title="A longer query"-  src="https://graphql-reference-1124782374.gtsb.io/___graphql?query=%7B%0A%20%20allSitePlugin%20%7B%0A%20%20%20%20totalCount%0A%20%20%20%20edges%20%7B%0A%20%20%20%20%20%20node%20%7B%0A%20%20%20%20%20%20%20%20name%0A%20%20%20%20%20%20%20%20version%0A%20%20%20%20%20%20%20%20packageJson%20%7B%0A%20%20%20%20%20%20%20%20%20%20description%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%20%20%7D%0A%7D%0A&explorerIsOpen=false"-  width="600"-  height="400"-  loading="lazy"-></iframe>+```graphql+{+  allSitePlugin {+    totalCount+    edges {+      node {+        name+        version+        packageJson {+          description+        }+      }+    }+  }+}+``` -Try using the editor's autocomplete (`Ctrl + Space`) to get extended details from the `packageJson` nodes.+In the GraphiQL editor, try using the editor's autocomplete (`Ctrl + Space`) to get extended details from the `packageJson` nodes.  If you're using Gatsby version `2.2.0` or later, you can remove `edges` and `node` from your query and replace it with `nodes`. The query will still work and the returned object will reflect the `nodes` structure. -<iframe-  title="A longer query with nodes"-  src="https://graphql-reference-1124782374.gtsb.io/___graphql?query=%7B%0A%20%20allSitePlugin%20%7B%0A%20%20%20%20totalCount%0A%20%20%20%20nodes%20%7B%0A%20%20%20%20%20%20%20%20name%0A%20%20%20%20%20%20%20%20version%0A%20%20%20%20%20%20%20%20packageJson%20%7B%0A%20%20%20%20%20%20%20%20%20%20description%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%20%20%7D%0A%7D&explorerIsOpen=false"-  width="600"-  height="400"-></iframe>+```graphql+{+  allSitePlugin {+    totalCount+    nodes {+      name+      version+      packageJson {+        description+      }+    }+  }+}+```  ## Limit  There are several ways to reduce the number of results from a query. Here `totalCount` tells you there's 8 results, but `limit` is used to show only the first three. -<iframe-  title="Using limit"-  src="https://graphql-reference-1124782374.gtsb.io/___graphql?query=%7B%0A%20%20allMarkdownRemark(limit%3A%203)%20%7B%0A%20%20%20%20totalCount%0A%20%20%20%20edges%20%7B%0A%20%20%20%20%20%20node%20%7B%0A%20%20%20%20%20%20%20%20frontmatter%20%7B%0A%20%20%20%20%20%20%20%20%20%20title%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%20%20%7D%0A%7D%0A&explorerIsOpen=false"-  width="600"-  height="400"-  loading="lazy"-></iframe>+```graphql+{+  allMarkdownRemark(limit: 3) {+    totalCount+    edges {+      node {+        frontmatter {+          title+        }+      }+    }+  }+}+```  ## Skip  Skip over a number of results. In this query `skip` is used to omit the first 3 results. -<iframe-  title="Using skip"-  src="https://graphql-reference-1124782374.gtsb.io/___graphql?query=%7B%0A%20%20allMarkdownRemark(skip%3A%203)%20%7B%0A%20%20%20%20totalCount%0A%20%20%20%20edges%20%7B%0A%20%20%20%20%20%20node%20%7B%0A%20%20%20%20%20%20%20%20frontmatter%20%7B%0A%20%20%20%20%20%20%20%20%20%20title%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%20%20%7D%0A%7D%0A&explorerIsOpen=false"-  width="600"-  height="400"-  loading="lazy"-></iframe>+```graphql+{+  allMarkdownRemark(skip: 3) {+    totalCount+    edges {+      node {+        frontmatter {+          title+        }+      }+    }+  }+}+```  ## Filter  In this query `filter` and the `ne` (not equals) operator is used to show only results that have a title. You can find a good video tutorial on this [here](https://www.youtube.com/watch?v=Lg1bom99uGM). -<iframe-  title="Using a filter"-  src="https://graphql-reference-1124782374.gtsb.io/___graphql?query=%7B%0A%20%20allMarkdownRemark(%0A%20%20%20%20filter%3A%20%7B%0A%20%20%20%20%20%20frontmatter%3A%20%7Btitle%3A%20%7Bne%3A%20%22%22%7D%7D%0A%20%20%20%20%7D%0A%20%20)%20%7B%0A%20%20%20%20totalCount%0A%20%20%20%20edges%20%7B%0A%20%20%20%20%20%20node%20%7B%0A%20%20%20%20%20%20%20%20frontmatter%20%7B%0A%20%20%20%20%20%20%20%20%20%20title%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%20%20%7D%0A%7D%0A&explorerIsOpen=false"-  width="600"-  height="400"-  loading="lazy"-></iframe>+```graphql+{+  allMarkdownRemark(filter: { frontmatter: { title: { ne: "" } } }) {+    totalCount+    edges {+      node {+        frontmatter {+          title+        }+      }+    }+  }+}+```  Gatsby relies on [Sift](https://www.npmjs.com/package/sift) to enable MongoDB-like query syntax for object filtering. This allows Gatsby to support operators like `eq`, `ne`, `in`, `regex` and querying nested fields through the `__` connector.

Pretty sure tis is a typo – good catch!

jxnblk

comment created time in 7 days

PullRequestReviewEvent

Pull request review commentgatsbyjs/gatsby

Docs: fix GraphQL Reference

 title: GraphQL Query Options Reference  ## Intro -This page will walk you through a series of GraphQL queries, each designed to demonstrate a particular feature of GraphQL. You'll be querying the _real_ schema used on [graphql-reference example](https://github.com/gatsbyjs/gatsby/tree/master/examples/graphql-reference) so feel free to experiment and poke around the innards of the site! You can also open the [CodeSandbox version](https://codesandbox.io/s/github/gatsbyjs/gatsby/tree/master/examples/graphql-reference) ([Direct link to GraphiQL](<https://graphql-reference-1124782374.gtsb.io/___graphql?query=%7B%0A%20%20site%20%7B%0A%20%20%20%20siteMetadata%20%7B%0A%20%20%20%20%20%20title%0A%20%20%20%20%20%20description%0A%20%20%20%20%7D%0A%20%20%7D%0A%20%20books%3A%20allMarkdownRemark(filter%3A%20%7Bfrontmatter%3A%20%7Btitle%3A%20%7Bne%3A%20%22%22%7D%7D%7D)%20%7B%0A%20%20%20%20totalCount%0A%20%20%20%20edges%20%7B%0A%20%20%20%20%20%20node%20%7B%0A%20%20%20%20%20%20%20%20frontmatter%20%7B%0A%20%20%20%20%20%20%20%20%20%20title%0A%20%20%20%20%20%20%20%20%20%20date(fromNow%3A%20true)%0A%20%20%20%20%20%20%20%20%20%20author%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20id%0A%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%20%20%7D%0A%20%20authors%3A%20allAuthorYaml%20%7B%0A%20%20%20%20totalCount%0A%20%20%20%20edges%20%7B%0A%20%20%20%20%20%20node%20%7B%0A%20%20%20%20%20%20%20%20id%0A%20%20%20%20%20%20%20%20bio%0A%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%20%20%7D%0A%7D%0A>)) of it.+This page will walk you through a series of GraphQL queries, each designed to demonstrate a particular feature of GraphQL.+These examples will work on the _real_ schema used on [graphql-reference example](https://github.com/gatsbyjs/gatsby/tree/master/examples/graphql-reference).+You can run this example locally to experiment and poke around the innards of the site!+You can also open the [CodeSandbox version](https://codesandbox.io/s/github/gatsbyjs/gatsby/tree/master/examples/graphql-reference) of it. -You'll be using GraphiQL, an interactive editor you can also use [while building your Gatsby site](/docs/tutorial/part-five/#introducing-graphiql).+For more information, read about [why Gatsby uses GraphQL](/docs/why-gatsby-uses-graphql/) and [how to use GraphiQL][] in any Gatsby site. -For more information, read about [why Gatsby uses GraphQL](/docs/why-gatsby-uses-graphql/).+[how to use graphiql]: https://www.gatsbyjs.com/docs/tutorial/part-4/#use-graphiql-to-explore-the-data-layer-and-write-graphql-queries  ## Basic query -Start with the basics, pulling up the site `title` from your `gatsby-config.js`'s `siteMetadata`. Here the query is on the left and the results are on the right.+Start with the basics, pulling up the site `title` from your `gatsby-config.js`'s `siteMetadata`. -<iframe-  title="A basic query"-  src="https://graphql-reference-1124782374.gtsb.io/___graphql?query=%7B%0A%20%20site%20%7B%0A%20%20%20%20siteMetadata%20%7B%0A%20%20%20%20%20%20title%0A%20%20%20%20%7D%0A%20%20%7D%0A%7D%0A&explorerIsOpen=false"-  width="600"-  height="400"-  loading="lazy"-></iframe>+```graphql+{+  site {+    siteMetadata {+      title+    }+  }+}+``` -Try editing the query to include the `description` from `siteMetadata`. When typing in the query editor you can use `Ctrl + Space` to see autocomplete options and `Ctrl + Enter` to run the current query.+In the GraphiQL editor, try editing the query to include the `description` from `siteMetadata`. When typing in the query editor you can use `Ctrl + Space` to see autocomplete options and `Ctrl + Enter` to run the current query.  ## A longer query  Gatsby structures its content as collections of `nodes`, which are connected to each other with `edges`. In this query you ask for the total count of plugins in this Gatsby site, along with specific information about each one. -<iframe-  title="A longer query"-  src="https://graphql-reference-1124782374.gtsb.io/___graphql?query=%7B%0A%20%20allSitePlugin%20%7B%0A%20%20%20%20totalCount%0A%20%20%20%20edges%20%7B%0A%20%20%20%20%20%20node%20%7B%0A%20%20%20%20%20%20%20%20name%0A%20%20%20%20%20%20%20%20version%0A%20%20%20%20%20%20%20%20packageJson%20%7B%0A%20%20%20%20%20%20%20%20%20%20description%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%20%20%7D%0A%7D%0A&explorerIsOpen=false"-  width="600"-  height="400"-  loading="lazy"-></iframe>+```graphql+{+  allSitePlugin {+    totalCount+    edges {+      node {+        name+        version+        packageJson {+          description+        }+      }+    }+  }+}+``` -Try using the editor's autocomplete (`Ctrl + Space`) to get extended details from the `packageJson` nodes.+In the GraphiQL editor, try using the editor's autocomplete (`Ctrl + Space`) to get extended details from the `packageJson` nodes.  If you're using Gatsby version `2.2.0` or later, you can remove `edges` and `node` from your query and replace it with `nodes`. The query will still work and the returned object will reflect the `nodes` structure. -<iframe-  title="A longer query with nodes"-  src="https://graphql-reference-1124782374.gtsb.io/___graphql?query=%7B%0A%20%20allSitePlugin%20%7B%0A%20%20%20%20totalCount%0A%20%20%20%20nodes%20%7B%0A%20%20%20%20%20%20%20%20name%0A%20%20%20%20%20%20%20%20version%0A%20%20%20%20%20%20%20%20packageJson%20%7B%0A%20%20%20%20%20%20%20%20%20%20description%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%20%20%7D%0A%7D&explorerIsOpen=false"-  width="600"-  height="400"-></iframe>+```graphql+{+  allSitePlugin {+    totalCount+    nodes {+      name+      version+      packageJson {+        description+      }+    }+  }+}+```  ## Limit  There are several ways to reduce the number of results from a query. Here `totalCount` tells you there's 8 results, but `limit` is used to show only the first three. -<iframe-  title="Using limit"-  src="https://graphql-reference-1124782374.gtsb.io/___graphql?query=%7B%0A%20%20allMarkdownRemark(limit%3A%203)%20%7B%0A%20%20%20%20totalCount%0A%20%20%20%20edges%20%7B%0A%20%20%20%20%20%20node%20%7B%0A%20%20%20%20%20%20%20%20frontmatter%20%7B%0A%20%20%20%20%20%20%20%20%20%20title%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%20%20%7D%0A%7D%0A&explorerIsOpen=false"-  width="600"-  height="400"-  loading="lazy"-></iframe>+```graphql+{+  allMarkdownRemark(limit: 3) {+    totalCount+    edges {+      node {+        frontmatter {+          title+        }+      }+    }+  }+}+```  ## Skip  Skip over a number of results. In this query `skip` is used to omit the first 3 results. -<iframe-  title="Using skip"-  src="https://graphql-reference-1124782374.gtsb.io/___graphql?query=%7B%0A%20%20allMarkdownRemark(skip%3A%203)%20%7B%0A%20%20%20%20totalCount%0A%20%20%20%20edges%20%7B%0A%20%20%20%20%20%20node%20%7B%0A%20%20%20%20%20%20%20%20frontmatter%20%7B%0A%20%20%20%20%20%20%20%20%20%20title%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%20%20%7D%0A%7D%0A&explorerIsOpen=false"-  width="600"-  height="400"-  loading="lazy"-></iframe>+```graphql+{+  allMarkdownRemark(skip: 3) {+    totalCount+    edges {+      node {+        frontmatter {+          title+        }+      }+    }+  }+}+```  ## Filter  In this query `filter` and the `ne` (not equals) operator is used to show only results that have a title. You can find a good video tutorial on this [here](https://www.youtube.com/watch?v=Lg1bom99uGM).

I read this as: "the [modifier] operator" – i.e. "filter" is not an operator

jxnblk

comment created time in 7 days

PR opened gatsbyjs/gatsby

Reviewers
Docs: fix GraphQL Reference

Description

This replaces the GraphiQL iframes in the GraphQL Reference section with static code blocks. The current setup, using Gatsby Preview will stop working once the new Preview experience is fully rolled out.

I made some light copy edits to avoid language related to the interactive iframes and am looking for proofreading and editing suggestions.

Related Issues

Reported internally [ch32387]

+561 -176

0 comment

1 changed file

pr created time in 7 days

create barnchgatsbyjs/gatsby

branch : docs-fix-gql-reference

created branch time in 7 days

PullRequestReviewEvent

Pull request review commentgatsbyjs/gatsby

docs(tutorial): add part 6

+---+title: "Part 6: Create Pages Programmatically"+---++import { Announcement, Notification } from 'gatsby-interface'+import Collapsible from '@components/collapsible'+import { MdInfo } from 'react-icons/md'++<Notification+  Icon={MdInfo}+  tone="WARNING"+  variant="SECONDARY"+  content={+    <div>+      <p>+        <strong>Note:</strong> We{"'"}re still working on updating this Tutorial to use Gatsby v3.+        The first few parts of the new Tutorial have been released here, and subsequent parts+        will be added as we finish them.+      </p>+      <p style={{ marginBottom: 0 }}>+        If you{"'"}re looking for a full experience in the meantime, you can check out the (slightly outdated){" "}+        <a href="https://v2.gatsbyjs.com/docs/tutorial/">+          <strong>Gatsby v2 Tutorial</strong>+        </a>+        .+      </p>+    </div>+  }+/>++## Introduction++In [Part 5](/docs/tutorial/part-5/), you added all of your blog posts to your Blog page. But that means that your Blog page will get longer and longer as you add more posts to your site. It would be better if each post lived on its own page, and then your Blog page could link out to all the different posts.++So far, the way you've created new pages for your Gatsby site is by creating a new file in the `src/pages` directory and hard-coding the page's contents in JSX. But manually creating a new page for each post would be quite repetitive, especially since each page has the same structure: render the frontmatter and contents of an MDX file.++In this part of the Tutorial, you'll learn how to create new pages dynamically using Gatsby's Filesystem Route API.++By the end of this part of the Tutorial, you will be able to:++- Use Gatsby's Filesystem Route API to dynamically create new pages for your blog posts.+- Add a query variable to a page query.++## Create new routes dynamically with Gatsby's File System Route API++When you build your Gatsby site, Gatsby creates a new route for each page component in your `src/pages` directory. So far, you've only been building one page per file: the `index.js` file creates the Home page, the `about.js` file creates the About page, and the `blog.js` file creates the Blog page.++But you can also use one page component to create multiple pages. Instead of hard-coding all the contents, you'll create a template to outline the basic structure of your page, and then Gatsby can dynamically add in the specific data for each page at build time. To do that, you'll use Gatsby's **File System Route API**, which lets you create routes dynamically by naming your page files with a special syntax.++<Collapsible+  summary={<h3>Key Gatsby Concept: File System Route API</h3>}+>++Gatsby's [File System Route API](/docs/reference/routing/file-system-route-api/) defines a special syntax for naming the files in your `src/pages` directory, which lets you dynamically create new pages for your site based on a **collection** of nodes in the data layer.++For example, imagine your site had a bunch of `Product` nodes in the data layer. You could use the File System Route API to create one product page template component. Then, when you built your site, Gatsby would combine that page template with the data for each `Product` node and generate a new page for each product. And if you decided you needed to make changes to your product page, you'd only have to edit the template component, and Gatsby would update all your product pages the next time it rebuilt the site.++To create a collection route:++1. Decide what type of node you want to create pages from.+2. Choose which field on that node to use in the route (the URL) for your pages.+3. Create a new page component in your `src/pages` directory using the following naming convention: `{nodeType.field}.js`.+    * Don't forget to include the curly braces (`{}`) in your filenames to indicate the dynamic part of the route! ++For example, if you wanted to create a separate page for each `Product` node, and you wanted to use the product's `name` field in the URL, you'd create a new file at `src/pages/{Product.name}.js`. Then Gatsby would create those pages at routes like `/water-bottle` or `/sweatshirt` or `/notebook`.++</Collapsible>++In this part of the Tutorial, you'll use Gatsby's File System Route API to dynamically create new pages for each of your blog posts.++According to the API, you need to decide on two things before creating a collection route:++* Which *type* of node to create pages from.+* Which *field* from that node type to use in the URL.++Since your blog posts are written in MDX, you'll use MDX as the node type to create pages from. But which field on the MDX nodes should you use?++`gatsby-plugin-mdx` automatically adds a `slug` field to each MDX node, which contains a string of the filename for the `.mdx` file (with the `.mdx` extension removed). You can see the `slug` field's value for each MDX node in GraphiQL. If you run the following query:++```graphql+{+  allMdx {+    nodes {+      slug+    }+  }+}+```++...you should get back something like the result below:++```json+{+  "data": {+    "allMdx": {+      "nodes": [+        {+          "slug": "my-first-post"+        },+        {+          "slug": "yet-another-post"+        },+        {+          "slug": "another-post"+        }+      ]+    }+  },+  "extensions": {}+}+```++That looks like a good format for a URL!++<Announcement style={{marginBottom: "1.5rem"}}>++**Note:** In this case, the `slug` field is a good choice because it's human readable, which means the URLs for your blog posts will be easier for users to understand. But you can use any field in your routes, even if it contains special characters or whitespace, as Gatsby will ["slugify"](/docs/reference/routing/file-system-route-api/#routing-and-linking) every route. For example, `I ♥ Dogs` will be converted to `i-love-dogs`.++</Announcement>++### Task: Create blog post page template++Now that you know what node type and field to use, you can plug them into the File System Routes naming convention. To create new pages from the `slug` field of your MDX nodes, you should make a new file at `src/pages/{mdx.slug}.js`.++The diagram below shows the different routes that Gatsby will create when it builds your site:++![A diagram showing how files in the "src/pages" directory get turned into routes for the site. Extended description below.](./file-system-routes.png)++<Collapsible+  summary={<em>Expand for detailed description</em>}+>++When you build your site, Gatsby looks at the page components in your `src/pages` directory and creates new pages for your site.++* `src/pages/index.js` lives at the `/` route.+* `src/pages/blog.js` lives at the `/blog` route.+* `src/pages/{mdx.slug}.js` gets turned into multiple routes - one for each MDX node in the data layer.+    * Gatsby uses the MDX node with slug `my-first-post` to build a page that lives at the `/my-first-post` route.+    * Gatsby uses the MDX node with slug `another-post` to build a page that lives at the `/another-post` route.+    * Gatsby uses the MDX node with slug `yet-another-post` to build a page that lives at the `/yet-another-post` route.++</Collapsible>++1. Create a new file in your `src/pages` directory called `{mdx.slug}.js`. This will be the file for your blog post page template.++2. Create a basic page component in your new `{mdx.slug}.js` file. For now, add in the `Layout` component, but hard code the page title and page contents. (You'll make those dynamic later on.)+    ```js:title=src/pages/{mdx.slug}.js+    import * as React from 'react'+    import Layout from '../components/layout'++    const BlogPost = () => {+      return (+        <Layout pageTitle="Super Cool Blog Posts">+          <p>My blog post contents will go here (eventually).</p>+        </Layout>+      )+    }++    export default BlogPost+    ```++3. In a web browser, go to `localhost:8000/my-first-post` and you should see your hard-coded content. You can update your URL with the slugs for your other posts to check that identical pages were created for them too.++![A screenshot of the blog post template page in a web browser. The page title says, "Super Cool Blog Posts," and the post contents have a paragraph element that says, "My blog post contents will go here (eventually)."](./post-page-template-hardcoded.png)++<Announcement style={{marginBottom: "1.5rem"}}>++**Pro Tip:** Not sure which pages were created? Check out the 404 page when you run `gatsby develop`. (You can get to it by trying to access the URL for a page that doesn't exist.) The bottom of the page lists the routes for all the pages Gatsby created for your site.++(If you're making changes to your routes, you'll have to stop and restart your local development server for the list of pages on the 404 page to update.)++![A screenshot of the development 404 page in a web browser. The URL is "localhost:8000/fake-route" and the 404 page shows an error message followed by a list of links to existing pages.](./404-page-with-routes.png)++</Announcement>++### Task: Update route to include a `/blog` path parameter++So far, all of your pages have been created off the root domain of your site (`localhost:8000`). But it would be better (both for search engine optimization and for general organization) if you grouped all your blog posts under a `/blog` path parameter. That way, the URLs for all your blog posts would start with `localhost:8000/blog/`.++Since Gatsby builds page routes based on the folder structure inside the `src/pages` directory, you can add new path parameters to a page by creating subdirectories inside of `src/pages`.++The following diagram shows an overview of the updates you'll have to make in order to add a `/blog` path parameter to the routes for your blog posts. The process is also outlined in more detail below.++![A diagram showing a new folder structure for the page components, along with the corresponding routes that get generated. Extended description below.](./file-system-routes-with-blog-subdirectory.png)++<Collapsible+  summary={<em>Expand for detailed description</em>}+>++When Gatsby builds the pages for your site, it creates routes based on the folder structure of the `src/pages` directory. So if your `src/pages` directory contains subdirectories with page components, the name of the subdirectory will get added as a path parameter for those pages.++* `src/pages/index.js` still lives at the `/` route.+* `src/pages/blog/index.js` lives at the `/blog` route.+* `src/pages/blog/{mdx.slug}.js` gets turned into multiple routes - one for each MDX node in the data layer.+    * Gatsby uses the MDX node with slug `my-first-post` to build a page that lives at the `blog/my-first-post route`.+    * Gatsby uses the MDX node with slug `another-post` to build a page that lives at the `blog/another-post route`.+    * Gatsby uses the MDX node with slug `yet-another-post` to build a page that lives at the `blog/yet-another-post route`.++</Collapsible>++1. Create a new folder in your `src/pages` directory, and call it `blog`.++2. Move the `src/pages/{mdx.slug}.js` file into the new `blog` subdirectory. Update the import for your `Layout` component to reflect the new folder structure:+    ```js:title=src/pages/blog/{mdx.slug}.js+    import * as React from 'react'+    import Layout from '../../components/layout' // highlight-line++    // ...+    ```++3. Once your local development server rebuilds your site, check in a web browser that the paths to your blog posts have updated.+    * For example, you should now have a page at `localhost:8000/blog/my-first-post`, and trying to access `localhost:8000/my-first-post` (without the `blog` path parameter) should send you to the 404 page.++<Announcement style={{marginBottom: "1.5rem"}}>++**Pro Tip:** Gatsby caches information about your site as it builds it, to make subsequent builds faster. But sometimes, when you make changes to your site, you'll need to empty the cache for your changes to show up.++If you're seeing unexpected behavior (like maybe your local development server isn't picking up your new changes), you can run `gatsby clean` from the command line to delete the cache and start fresh on your next build.++Don't have the Gatsby CLI globally installed? Try running `npx gatsby clean` instead.++</Announcement>++4. For organization, it would be nice to keep all your blog-related pages together. Move the `src/pages/blog.js` file into your new `src/pages/blog` directory as well.+    * Rename the file from `blog.js` to `index.js`. (Otherwise your blog page will move to `localhost:8000/blog/blog`).+    * You'll also need to update the import for the `Layout` component to reflect the new folder structure:+        ```js:title=src/pages/blog/index.js+        import * as React from 'react'+        import { graphql } from 'gatsby'+        import { MDXRenderer } from 'gatsby-plugin-mdx'+        import Layout from '../../components/layout' // highlight-line++        // ...+        ```+    * You may need to stop and restart your local development server for the changes to be picked up.++5. In a web browser, check that your Blog page still shows up at `localhost:8000/blog`.++Nice work! You've now used Gatsby's File System Route API to create pages from nodes in the data layer.+++## Render post contents in the blog post page template++Now that you've got all the pages for your posts set up, it's time to pull in the actual post contents. You learned in [Part 4](/docs/tutorial/part-4/) that you can pull data into your components using GraphQL queries. But how can you tell Gatsby which MDX node from the data layer to pull into each page? To do that, you'll need to learn about another key GraphQL concept: **query variables**.++<Collapsible+  summary={<h3>Key GraphQL Concept: Query Variables</h3>}+>++In GraphQL, query variables are a way to send extra data along with your request. With query variables, you can write dynamic queries that return different data based on the values you pass in.++Let's take a look at an example in GraphiQL. In [Part 5](/docs/tutorial/part-5/), you learned about passing arguments to fields to change the data you get back in the response. For example, you could use the query below to request data for the MDX node that has a `slug` field equal to `"another-post"`:++```graphql+query MyQuery {+  mdx(slug: {eq: "another-post"}) {+    frontmatter {+      title+    }+  }+}+```++...which would return the following response:++```json+{+  "data": {+    "mdx": {+      "frontmatter": {+        "title": "Another Post"+      }+    }+  },+  "extensions": {}+}+```++In this case, your `slug` value is hard coded into your GraphQL query. But what happens if you want to swap out a different value on a different page? That's where query variables come in.++GraphiQL has a collapsible "Query Variables" section at the bottom of the Query Editor pane. If you click on it, a new text area appears, where you can add key-value pairs for data that you want to pass into your query. These key-value pairs should be written in JSON. For example, adding the object below to the Query Variables section passes your request a query variable called `slug` with a value of `another-post`:++```json+{+	"slug": "another-post"+}+```++To use the query variable inside your query, do the following:++1. **Define your query variable.** It should include the variable name (with a `$` in front of it) and its GraphQL data type.+2. **Use the query variable in your query.** (You'll need to add a `$` before the variable name.)++For example, here's how you would update the previous query to use query variables instead of a field argument:++```graphql+query MyQuery($slug: String) {+  mdx(slug: {eq: $slug}) {+    frontmatter {+      title+    }+  }+}+```++Running this new query should return the same response as the previous one without query variables. But now, you can swap out the value of your `slug` variable with a different value, like `"my-first-post"`, and your response will send back the correct node.++The diagram below shows how the query, query variables, and response all fit together in the GraphiQL interface:++![A screenshot of GraphiQL in a web browser. The Query Editor pane in the middle shows the request with query variables. The Query Variables pane below shows a JSON object with a single key-value pair for the `slug`. The Result Window shows the single MDX node returned in the response.](./graphiql-with-query-variables.png)++<Announcement>++**Note:** In Gatsby, query variables can *only* be used inside of page queries. (You can't use them with the `useStaticQuery` hook.)++</Announcement>++</Collapsible>++When you use Gatsby's File System Route API, it automatically adds some props into the page template component for each page:++* The `id` for the data layer node it used to create the page.+* The field you used to create the dynamic part of the route. (In this case, the `slug` field.)++Under the hood, Gatsby makes both of these values available to use as query variables in your page queries.++<Announcement style={{marginBottom: "1.5rem"}}>++**Want to take a closer look?**++1. Add a `console.log` statement to print out the props for your `BlogPost` page component in `src/pages/blog/{mdx.slug}.js`.+2. In a web browser, go to `localhost:8000/blog/my-first-post` and open the developer tools. In the console tab, you should see an object similar to the one below:+    ```js+    Object {+      // ...+      pageContext: Object { +        id: "11b3a825-30c5-551d-a713-dd748e7d554a"+        slug: "my-first-post"+      }+      // ...+    }+    ```++The keys in the `pageContext` object get added when you create a page using the File System Route API. These are also the keys that are available for you to use as query variables in your page query for the blog post page template.++</Announcement>++1. Start by using GraphiQL to create a page query for your blog post page template.+    * Since each page only needs data for a single MDX node, use the `mdx` field.+    * The fastest way to look up nodes is using the `id` field, so use the `id` query variable instead of `slug`.+    ```graphql+    query MyQuery($id: String) {+      mdx(id: {eq: $id}) {+        frontmatter {+          title+          date(formatString: "MMMM D, YYYY")+        }+        body+      }+    }+    ```++<Announcement style={{marginBottom: "1.5rem"}}>++**Tip:** If you want to test out your query in GraphiQL, you'll need to add an `id` key to the Query Variables section. You can copy one of the `id` values from running an `allMdx` query in GraphiQL.++The JSON object in the Query Variables section should look something like this (using your own `id` as copying the one below won't work):++```json+{+	"id": "11b3a825-30c5-551d-a713-dd748e7d554a"+}+```++</Announcement>++2. Add your page query to the blog post page template. Don't forget to import the `graphql` tag!+    ```js:title=src/pages/blog/{mdx.slug}.js+    import * as React from 'react'+    import { graphql } from 'gatsby' // highlight-line+    import Layout from '../../components/layout'++    const BlogPost = () => {+      return (+        <Layout pageTitle="Super Cool Blog Posts">+          <p>My blog post contents will go here (eventually).</p>+        </Layout>+      )+    }++    // highlight-start+    export const query = graphql`+      query MyQuery($id: String) {+        mdx(id: {eq: $id}) {+          frontmatter {+            title+            date(formatString: "MMMM D, YYYY")+          }+          body+        }+      }+    `+    // highlight-end++    export default BlogPost+    ```++3. In [Part 4](/docs/tutorial/part-4/), you learned that Gatsby passes in the results from your page query into your page component as a `data` prop. You can update your `BlogPost` component to use the `data` prop and render the contents of your blog post. (Remember to import `MDXRenderer` so that you can render the body of your post!)+    ```js:title=src/pages/blog/{mdx.slug}.js+    import * as React from 'react'+    import { graphql } from 'gatsby'+    import { MDXRenderer } from 'gatsby-plugin-mdx' // highlight-line+    import Layout from '../../components/layout'++    const BlogPost = ({ data }) => { // highlight-line+      return (+        {/* highlight-start */}+        <Layout pageTitle={data.mdx.frontmatter.title}>+          <p>{data.mdx.frontmatter.date}</p>+          <MDXRenderer>+            {data.mdx.body}+          </MDXRenderer>+        {/* highlight-end */}+        </Layout>+      )+    }++    export const query = graphql`+      query MyQuery($id: String) {+        mdx(id: {eq: $id}) {+          frontmatter {+            title+            date(formatString: "MMMM D, YYYY")+          }+          body+        }+      }+    `++    export default BlogPost+    ```++4. In your web browser, go to one of your blog post pages (like `localhost:8000/blog/my-first-post`). You should see the contents of your blog post rendered in their own page!+    * Try checking the routes for your other posts, to make sure all your pages are rendering the post contents correctly.++![A screenshot of the "my-first-post" blog page in a web browser. The post's title, date, and body contents are rendered.](./my-first-post.png)++## Update Blog page to link to each post++So far, you've used the File System Route API and GraphQL query variables to create separate pages for each of your blog posts.++The last step of Part 6 is to clean up your Blog page. Instead of rendering the full contents of your blog posts, the Blog page should link out to the new post pages you just created.++1. In your `src/pages/blog/index.js` file, remove the `body` field from your JSX and your page query. You can also get rid of the `MDXRenderer` component.+    ```js:title=src/pages/blog/index.js+    import * as React from 'react'+    import { graphql } from 'gatsby'+    import Layout from '../../components/layout'++    const BlogPage = ({ data }) => {+      return (+        <Layout pageTitle="My Blog Posts">+          {+            data.allMdx.nodes.map(node => (+              <article key={node.id}>+                <h2>{node.frontmatter.title}</h2>+                <p>Posted: {node.frontmatter.date}</p>+              </article>+            ))+          }+        </Layout>+      )+    }+    +    export const query = graphql`+      query {+        allMdx(sort: {fields: frontmatter___date, order: DESC}) {+          nodes {+            frontmatter {+              date(formatString: "MMMM D, YYYY")+              title+            }+            id+          }+        }+      }+    `++    export default BlogPage+    ```++2. Add the `slug` field to your page query, and use it to turn the post title into a link to the post page.

We could mention the gatsbyPath API in something like a callout, couldn’t we? Either way, that seems like it shouldn’t block this PR

meganesu

comment created time in 9 days

PullRequestReviewEvent

Pull request review commentgatsbyjs/gatsby

docs(tutorial): add part 6

+---+title: "Part 6: Create Pages Programmatically"+---++import { Announcement, Notification } from 'gatsby-interface'+import Collapsible from '@components/collapsible'+import { MdInfo } from 'react-icons/md'++<Notification+  Icon={MdInfo}+  tone="WARNING"+  variant="SECONDARY"+  content={+    <div>+      <p>+        <strong>Note:</strong> We{"'"}re still working on updating this Tutorial to use Gatsby v3.

I think you should be able to use UTF-8 apostrophes in places like this:

        <strong>Note:</strong> We’re still working on updating this Tutorial to use Gatsby v3.
meganesu

comment created time in 9 days

Pull request review commentgatsbyjs/gatsby

docs(tutorial): add part 6

+---+title: "Part 6: Create Pages Programmatically"+---++import { Announcement, Notification } from 'gatsby-interface'+import Collapsible from '@components/collapsible'+import { MdInfo } from 'react-icons/md'++<Notification+  Icon={MdInfo}+  tone="WARNING"+  variant="SECONDARY"+  content={+    <div>+      <p>+        <strong>Note:</strong> We{"'"}re still working on updating this Tutorial to use Gatsby v3.+        The first few parts of the new Tutorial have been released here, and subsequent parts+        will be added as we finish them.+      </p>+      <p style={{ marginBottom: 0 }}>+        If you{"'"}re looking for a full experience in the meantime, you can check out the (slightly outdated){" "}+        <a href="https://v2.gatsbyjs.com/docs/tutorial/">+          <strong>Gatsby v2 Tutorial</strong>+        </a>+        .+      </p>+    </div>+  }+/>++## Introduction++In Part 5, you added all of your blog posts to your Blog page. But that means that your Blog page will get longer and longer as you add more posts to your site. It would be better if each post lived on its own page, and then your Blog page could link out to all the different posts.++So far, the way you've created new pages for your Gatsby site is by creating a new file in the `src/pages` directory and hard-coding the page's contents in JSX. But manually creating a new page for each post would be quite repetitive, especially since each page has the same structure: render the frontmatter and contents of an MDX file.++In this part of the Tutorial, you'll learn how to create new pages dynamically using Gatsby's filesystem route API.++By the end of this part of the Tutorial, you will be able to:++- Use Gatsby's filesystem route API to dynamically create new pages for your blog posts.+- Add a query variable to a page query.++## Create new routes dynamically with Gatsby's File System Route API++When you build your Gatsby site, Gatsby creates a new route for each page component in your `src/pages` directory. So far, you've only been building one page per file: the `index.js` file creates the Home page, the `about.js` file creates the About page, and the `blog.js` file creates the Blog page.++But you can also use one page component to create multiple pages. Instead of hard-coding all the contents, you'll create a template to outline the basic structure of your page, and then Gatsby can dynamically add in the specific data for each page at build time. To do that, you'll use Gatsby's **file system route API**, which lets you create routes dynamically by naming your page files with a special syntax.++<Collapsible+  summary={<h3>Key Gatsby Concept: File System Route API</h3>}+>++Gatsby's file system route API defines a special syntax for naming the files in your `src/pages` directory, which lets you dynamically create new pages for your site based on a **collection** of nodes in the data layer.++For example, imagine your site had a bunch of `Product` nodes in the data layer. You could use the file system route API to create one product page template component. Then, when you built your site, Gatsby would combine that page template with the data for each `Product` node and generate a new page for each product. And if you decided you needed to make changes to your product page, you'd only have to edit the template component, and Gatsby would update all your product pages the next time it rebuilt the site.++To create a collection route:++1. Decide what type of node you want to create pages from.+2. Choose which field on that node to use in the route (the URL) for your pages.+3. Create a new page component in your `src/pages` directory using the following naming convention: `{nodeType.field}.js`.+    * Don't forget to include the curly braces (`{}`) in your filenames to indicate the dynamic part of the route! ++For example, if you wanted to create a separate page for each `Product` node, and you wanted to use the product's `name` field in the URL, you'd create a new file at `src/pages/{Product.name}.js`. Then Gatsby would create those pages at routes like `/water-bottle` or `/sweatshirt` or `/notebook`.++</Collapsible>++In this part of the Tutorial, you'll use Gatsby's file system route API to dynamically create new pages for each of your blog posts.++According to the file system route API, you need to decide on two things before creating a collection route:++* Which *type* of node to create pages from.+* Which *field* from that node type to use in the URL.++Since your blog posts are written in MDX, you'll use MDX as the node type to create pages from. But which field on the MDX nodes should you use?++`gatsby-plugin-mdx` automatically adds a `slug` field to each MDX node, which contains a string of the filename for the `.mdx` file (with the `.mdx` extension removed). You can see the `slug` field's value for each MDX node in GraphiQL. If you run the following query:++```graphql+{+  allMdx {+    nodes {+      slug+    }+  }+}+```++...you should get back something like the result below:++```json+{+  "data": {+    "allMdx": {+      "nodes": [+        {+          "slug": "my-first-post"+        },+        {+          "slug": "yet-another-post"+        },+        {+          "slug": "another-post"+        }+      ]+    }+  },+  "extensions": {}+}+```++That looks like a good format for a URL!++<Announcement style={{marginBottom: "1.5rem"}}>++**Note:** In this case, the `slug` field is a good choice because it's human readable, which means the URLs for your blog posts will be easier for users to understand. But you can use any field in your routes!++</Announcement>++### Task: Create blog post page template++Now that you know what node type and field to use, you can plug them into the file system routes naming convention. To create new pages from the `slug` field of your MDX nodes, you should make a new file at `src/pages/{mdx.slug}.js`.++The diagram below shows the different routes that Gatsby will create when it builds your site:++![A diagram showing how files in the "src/pages" directory get turned into routes for the site. Extended description below.](./file-system-routes.png)++<Collapsible+  summary={<em>Expand for detailed description</em>}+>++When you build your site, Gatsby looks at the page components in your `src/pages` directory and creates new pages for your site.++* `src/pages/index.js` lives at the `/` route.+* `src/pages/blog.js` lives at the `/blog` route.+* `src/pages/{mdx.slug}.js` gets turned into multiple routes - one for each MDX node in the data layer.

❤️ the before/after for this Tutorial step is so much simpler!

meganesu

comment created time in 9 days

Pull request review commentgatsbyjs/gatsby

docs(tutorial): add part 6

+---+title: "Part 6: Create Pages Programmatically"+---++import { Announcement, Notification } from 'gatsby-interface'+import Collapsible from '@components/collapsible'+import { MdInfo } from 'react-icons/md'++<Notification

Also – just realizing this – if this is the same component/content across all the steps, this could be pulled out into its own component, right?

meganesu

comment created time in 9 days

PullRequestReviewEvent
PullRequestReviewEvent

PR opened gatsbyjs/gatsby

Reviewers
chore(docs) remove UTM parameter from Tutorial links

Description

Since the Tutorial is part of the gatsbyjs.com domain, we shouldn't use UTM parameters for internal links. This removes the URL parameters from pages in the Tutorial.

Related Issues

Reported internally

+15 -15

0 comment

5 changed files

pr created time in a month

create barnchgatsbyjs/gatsby

branch : docs-remove-utm-param

created branch time in a month

delete branch gatsbyjs/gatsby-starter-shopify

delete branch : demo-only-hero

delete time in a month

push eventgatsbyjs/gatsby-starter-shopify

Brent Jackson

commit sha f045cd4fccb9a9a35b3f42c371e47792b96bd31e

Add conditional logic to hide deploy button when not deployed as the demo site (#32)

view details

push time in a month

PullRequestReviewEvent

Pull request review commentgatsbyjs/gatsby-starter-shopify

Hide deploy button for use outside of the demo site

 export const query = graphql`     }   } `+function Hero (props) {+  return (+    <div className={container}>+      <h1 className={intro}>Welcome to the GatsbyJS + Shopify Demo Store.</h1>+      {!!process.env.GATSBY_DEMO_STORE && (

The React docs still suggest this is valid: https://reactjs.org/docs/conditional-rendering.html#inline-if-with-logical--operator

jxnblk

comment created time in a month

Pull request review commentgatsbyjs/gatsby-starter-shopify

Hide deploy button for use outside of the demo site

 export const query = graphql`     }   } `+function Hero (props) {+  return (+    <div className={container}>+      <h1 className={intro}>Welcome to the GatsbyJS + Shopify Demo Store.</h1>+      {!!process.env.GATSBY_DEMO_STORE && (

The !! will return false, which shouldn't be rendered in React, right?

jxnblk

comment created time in a month

PullRequestReviewEvent

create barnchgatsbyjs/gatsby-starter-shopify

branch : demo-only-hero

created branch time in a month

push eventgatsbyjs/gatsby-starter-shopify

Kyle Jones

commit sha 36cf72d8cf9ad2a138c5a6e079b5052a7c583cf9

Fixing redirect - currently pointing to archived repo (#30)

view details

push time in a month

PR merged gatsbyjs/gatsby-starter-shopify

Broken Link in Readme

Closes #29

Fixing redirect - currently pointing to archived repo

+1 -1

1 comment

1 changed file

Kerl1310

pr closed time in a month