chore(doc): fix code block languages (#20372)

* fix code blocks

* revert markdown changes in unordered list

benchmarks/plugin-manifest/README.md

@@ -9,13 +9,13 @@ Benchmarks the current production version of the plugin unless you use `gatsby-d
 
 ```shell
 # In the root of the Gatsby repository
-$ yarn run watch --scope=gatsby-plugin-manifest .
+yarn run watch --scope=gatsby-plugin-manifest .
 ```
 
 ```shell
 # In ./benchmarks/plugin-manifest
 # You'll need 'gatsby-dev' installed and configured globally.
-$ gatsby-dev --packages gatsby-plugin-manifest
+gatsby-dev --packages gatsby-plugin-manifest
 ```
 
 You may now switch branches using `git checkout` and edit code on the current branch. Changes will be compiled into the local `node_modules` for the benchmark.

docs/blog/2017-10-01-migrating-my-blog-from-hexo-to-gatsby/index.md

@@ -60,7 +60,7 @@ where to hold your content, and moved everything else away or removed it.
 
 Here's what that looks like for me:
 
-```
+```text
 .
 ├── content
 │   ├── _drafts
@@ -90,7 +90,7 @@ rm -rf temp-gatsby-files     # Remove the temp directory
 However you get Gatsby initialized in your repository root, afterwards you
 should have a file structure that looks something like this:
 
-```
+```text
 .
 ├── content
 │   └── [ Markdown files ... ]
@@ -110,7 +110,7 @@ should have a file structure that looks something like this:
 
 Now run the Gatsby dev server to make sure everything works:
 
-```
+```bash
 npm run develop
 ```
 
@@ -130,7 +130,7 @@ probably want to customize the header and overall layout.
 
 This is pretty simple. Just modify the primary layout file that was generated:
 
-```
+```text
 src/layouts/index.js
 ```
 
@@ -146,7 +146,7 @@ I talked about in part 1.
 
 Also straightforward, just edit:
 
-```
+```text
 src/pages/index.js
 ```
 
@@ -180,7 +180,7 @@ If you play around with GraphiQL you'll notice there's not that much there.
 Let's fix that. We need to teach Gatsby how to query the file system. Luckily
 this is so common it's been done for you. Install the file system source plugin:
 
-```
+```bash
 npm i --save gatsby-source-filesystem
 ```
 
@@ -229,7 +229,7 @@ Being able to query files is a big win, and if you have a directory of HTML
 files this is all you will need. But if you want to render markdown files as
 HTML you will need another plugin. Let's add that now:
 
-```
+```bash
 npm i --save gatsby-transformer-remark
 ```
 
@@ -268,7 +268,7 @@ This query gives you the full HTML for all your markdown files. If you are using
 frontmatter you can also access that here. I'm assuming you have a `title` field
 in your frontmatter:
 
-```
+```graphql
 query {
   allMarkdownRemark {
     edges {
@@ -460,7 +460,7 @@ export const pageQuery = graphql`
 Many existing Gatsby examples use `path` within each markdown file's frontmatter
 to designate the url. For example:
 
-```md
+```markdown
 ---
 title: My Post
 path: my-post

docs/blog/2017-10-17-building-i18n-with-gatsby/index.md

@@ -124,7 +124,7 @@ we create a JSON file for each component we want to translate.
 For our site we're currently supporting English and Welsh, so our locales folder
 looks like this.
 
-```
+```text
 - src
 	- locales
 		- en

docs/blog/2017-11-06-migrate-hugo-gatsby/index.md

@@ -172,7 +172,7 @@ Steps were:
 Add `gatsby-plugin-typography` and `typography-theme-moraga` (for example) and
 "enable" the plugin in the `gatsby-config.js` file:
 
-```javascript=
+```javascript
 {
   resolve: `gatsby-plugin-typography`,
   options: {
@@ -183,7 +183,7 @@ Add `gatsby-plugin-typography` and `typography-theme-moraga` (for example) and
 
 In `src/utils/typograhy` add:
 
-```javascript=
+```javascript
 import Typography from "typography"
 import theme from "typography-theme-moraga"
 

docs/blog/2017-11-08-migrate-from-jekyll-to-gatsby/index.md

@@ -67,7 +67,7 @@ need to extract the date from the file name.
 
 The slug in my case is generated with this (default in Jekyll) structure:
 
-```
+```text
 https://blog.singuerinc.com/[n-categories]/YYYY/MM/DD/dashed-title/
 
 // Given this data:

docs/blog/2017-12-07-taking-gatsby-for-a-spin/index.md

@@ -51,7 +51,7 @@ Gatsby definitely delivers on speed. The whole PRPL pattern thing seems to work
 
 Data from anywhere with static output. That's sort of the holy grail isn't it? Right now the data I use in this site comes from markdown files, but I can already see that switching to another content source is going to be a breeze with GraphQL. The queries are clean and readable and the Graph*i*QL IDE is the perfect helper. In a way, GraphQL allows you to separate your frontend from the type of data source.
 
-```es6
+```javascript
 export const query = graphql`
   query BlogPostQuery($slug: String!) {
     markdownRemark(fields: { slug: { eq: $slug } }) {

docs/blog/2018-04-11-trying-out-gatsby-at-work-and-co/index.md

@@ -77,7 +77,7 @@ Figuring out how to set this up in GraphQL took some trial and error, but we set
 
 The GraphQL looks like this:
 
-```
+```graphql
 ContentfulContentPage {
   headline
   slug
@@ -127,7 +127,7 @@ Building off of Gatsby’s Contentful example, we were able to easily support dy
 
 This worked so well that at first I was sure we wouldn’t even need to create any pages with static urls, but these wound up coming in handy for development and testing. We settled on a structure like this:
 
-```
+```text
 |-pages/
   |-dev/
     |-article-components.js
@@ -155,7 +155,7 @@ That same validation page also served as a site status page, containing the time
 
 Capturing this information was easy and only took a few additional lines in our `createPages` hook. Netlify exposes a lot of interesting [environment variables](https://www.netlify.com/docs/continuous-deployment/#build-environment-variables) (including some I hope to play with more on a future project, like `WEBHOOK_TITLE`, which can help you deduce the origin of the current build). In order to display these variables on the frontend, we needed to rename them to begin with `GATSBY_`:
 
-```
+```javascript
 exports.createPages = () => {
   ['COMMIT_REF', ‘BRANCH’]].forEach((variableName) => {
     // only variables beginning with GATSBY_ are available client-side
@@ -166,21 +166,21 @@ exports.createPages = () => {
 
 After that, we just added one more variable to store the current time:
 
-```
-process.env.GATSBY_BUILD_TIME = Date.now();
+```javascript
+process.env.GATSBY_BUILD_TIME = Date.now()
 ```
 
 #### Covering our tracks
 
 We filtered out our dev pages in production by adding a simple `onCreatePage` hook to our `gatsby-node` file:
 
-```
+```javascript
 exports.onCreatePage = ({ page, boundActionCreators }) => {
   if (process.env.GATSBY_ENV === ENV.PRODUCTION) {
-    const { deletePage } = boundActionCreators;
-    if (/^\/dev\//.test(page.path)) deletePage(page);
+    const { deletePage } = boundActionCreators
+    if (/^\/dev\//.test(page.path)) deletePage(page)
   }
-};
+}
 ```
 
 ### Staging
@@ -213,21 +213,21 @@ Backing up a second, let’s review why we selected the preview URLs `mystagingu
 
 Here’s why: Contentful’s Content Preview dashboard doesn’t give you that kind of flexibility. To get around this, we opted to build special paths just for the staging environment. Here’s how we set it up in `gatsby-node.js`:
 
-```
+```javascript
 // Always create a page at the regular path
 createPage({
   component: contentPageTemplate,
   context,
-  path: `${language}/${slugs.join('/')}/`,
-});
+  path: `${language}/${slugs.join("/")}/`,
+})
 
 // On staging, recreate the page with a path corresponding to its ID
 if (process.env.GATSBY_ENV === ENV.STAGING) {
   createPage({
     component: contentPageTemplate,
     context,
     path: `${language}/${id}/`,
-  });
+  })
 }
 ```
 
@@ -277,7 +277,7 @@ As I said, I was impressed by the Gatsby team’s quick turnaround time with PR
 
 Of course, this is something developers do all the time. They push their fork to Git and link to it in their project’s `package.json`:
 
-```
+```json
 “dependencies”: {
   "some-library": "git+ssh://git@github.com:workco/some-library.git#cool-feature"
 }

docs/blog/2018-06-08-life-after-layouts/index.md

@@ -121,7 +121,7 @@ For a full list of what's new, check out our [V2 migration guide](/docs/migratin
 
 - You can get started using Gatsby V2 right now by installing our V2 default starter:
 
-  ```
+  ```shell
   gatsby new my-gatsby-v2-site https://github.com/gatsbyjs/gatsby-starter-default
   ```
 

docs/blog/2018-06-18-moving-from-create-react-app-to-gatsby-js/index.md

@@ -40,7 +40,7 @@ Gatsby uses [GraphQL](https://graphql.org/learn/) to share data across pages. Yo
 
 ## Gatsby project folder structure
 
-```shell
+```text
 ├── LICENSE
 ├── README.md
 ├── gatsby-config.js
@@ -66,15 +66,15 @@ There are two types of routes:
 
 Let's assume you have the following static routes in your `create-react-app` project:
 
-```js
+```jsx
 <Route exact path='/' component={Home} />
 <Route path='/blog' component={Blog} />
 <Route path='/contact' component={Contact} />
 ```
 
 Gatsby will create these routes automatically based on files you create in your `pages` folder. The good news is you've already created the React components so it's a matter of copying them to the right place. The exception is the home page which should be named `index.js`.  You will end up with something like this:
 
-```shell
+```text
 ├── LICENSE
 ├── README.md
 ├── gatsby-config.js
@@ -98,13 +98,13 @@ I will take an example of blog posts in this case loaded from Contentful. Every
 
 In a normal React app the route will look something like this.
 
-```js
+```jsx
 <Route path="/blog/:slug" component={BlogPost} />
 ```
 
 And your `BlogPost` component will look something like this:
 
-```js
+```jsx
 // a function that requests a blog post from Contentful's API
 import { getBlogPost } from "./contentful-service"
 import marked from "marked"
@@ -188,7 +188,7 @@ Since you already have the `BlogPost` component from your React project move it
 
 Your Gatsby project will look like this:
 
-```shell
+```text
 ├── LICENSE
 ├── README.md
 ├── gatsby-config.js
@@ -211,7 +211,7 @@ You need to make some slight modifications to your `BlogPost` component.
 
 `src/templates/blog-post.js`:
 
-```js
+```jsx
 import React from "react"
 import { graphql } from "gatsby"
 

docs/blog/2018-1-18-strapi-and-gatsby/index.md

@@ -237,7 +237,7 @@ cd blog
 
 Start the server:
 
-```
+```bash
 gatsby develop
 ```
 
@@ -255,7 +255,7 @@ In this example, we are using Strapi. Obviously, we are going to need a source p
 
 Let's install it:
 
-```
+```bash
 npm install --save gatsby-source-strapi
 ```
 
@@ -330,7 +330,7 @@ _Important links from Video:_
 
 First, we want to display the list of articles. To do so, add the following content in the existing home page file:
 
-```js:title=/blog/src/pages/index.js
+```jsx:title=/blog/src/pages/index.js
 import React from "react"
 import { Link, graphql } from "gatsby"
 import Layout from "../components/layout"
@@ -387,7 +387,7 @@ Gatsby includes a useful GraphiQL interface. It makes GraphQL queries developmen
 
 To add images, we will need to import `Img` from package `gatsby-image` installed by default. Replace the content of `blog/src/pages/index.js` with the following :
 
-```js:title=/blog/src/pages/index.js
+```jsx:title=/blog/src/pages/index.js
 import React from "react"
 import { Link, graphql } from "gatsby"
 import Img from "gatsby-image"
@@ -455,7 +455,7 @@ Let's create the template, containing a specific GraphQL request and defining th
 
 In order to do this, first create a folder called `templates` in your `src` directory. Then within `templates` create a file called `article.js`.
 
-```js:title=/blog/src/templates/article.js
+```jsx:title=/blog/src/templates/article.js
 import React from "react"
 import { Link, graphql } from "gatsby"
 import Img from "gatsby-image"
@@ -502,7 +502,7 @@ That looks fine, but at this point, Gatsby does not know when this template shou
 
 First, we are going to code a new function called `makeRequest` to execute the GraphQL request. Then, we export a function named `createPages` in which we get the list of articles and create a page for each of them. Here is the result:
 
-```js:title=/blog/gatsby-node.js
+```jsx:title=/blog/gatsby-node.js
 const path = require(`path`)
 
 const makeRequest = (graphql, request) =>
@@ -577,7 +577,7 @@ Articles are written by authors. They deserve a dedicated page.
 
 The processes for creating author views and article pages are very similar. First, create a new file in our `templates` folder called, `author.js`. Add the code below to this file.
 
-```js:title=/blog/src/templates/author.js
+```jsx:title=/blog/src/templates/author.js
 import React from "react"
 import { Link, graphql } from "gatsby"
 import Layout from "../components/layout"

docs/blog/2018-1-25-building-a-site-with-react-and-contentful/index.md

@@ -55,7 +55,7 @@ As far as pushing data out to my site goes, I didn't know which API or token I n
 
 Gatsby-config.js file:
 
-```jsx
+```js
 module.exports = {
   siteMetadata: {
     title: `Taking Care of Watson`,