Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

chore(docs): check titles, headlines & text + change some NOTE to Note #18654

Merged
merged 5 commits into from
Oct 15, 2019
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 5 additions & 5 deletions docs/docs/mdx/markdown-syntax.md
Original file line number Diff line number Diff line change
Expand Up @@ -92,7 +92,7 @@ How unordered lists are rendered in HTML:
1. Two
1. Three

## Links and Images
## Links and images

### Link

Expand Down Expand Up @@ -145,14 +145,14 @@ This pattern is appropriate for [decorative or repetitive images](https://www.w3
>
> more quotes

## Code Comments
## Code comments

### Inline

- Enclose the text in backticks \`code\`
- Inline `code` looks like this sentence

### Code Blocks
### Code blocks

- Indent a block by four spaces

Expand Down Expand Up @@ -180,7 +180,7 @@ This pattern is appropriate for [decorative or repetitive images](https://www.w3
---
```

## Frontmatter + MDX Example
## Frontmatter + MDX example

```
---
Expand All @@ -196,7 +196,7 @@ The chart is rendered inside our MDX document.
<Chart description={description} />
```

## Helpful Resources
## Helpful resources

- https://daringfireball.net/projects/markdown/syntax
- https://www.markdownguide.org/basic-syntax
2 changes: 1 addition & 1 deletion docs/docs/mdx/plugins.md
Original file line number Diff line number Diff line change
Expand Up @@ -58,7 +58,7 @@ by Gatsby image processing.
![my image](./my-awesome-image.png)
```

## remark plugins
## Remark plugins

You can use [remark plugins](https://github.com/remarkjs/remark/blob/master/doc/plugins.md)
directly if there are transformations you'd like to make on your
Expand Down
24 changes: 12 additions & 12 deletions docs/docs/mdx/programmatically-creating-pages.md
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ You'll need to use `gatsby-source-filesystem` and tell it to source
"posts" from a folder called `content/posts` located in the project's
root.

> **NOTE**: `gatsby-plugin-mdx` uses `.mdx` by default as a file extension to
> **Note**: `gatsby-plugin-mdx` uses `.mdx` by default as a file extension to
> recognize which files to use. You can also [use `.md` as a file
> extension](/packages/gatsby-plugin-mdx#extensions) if you want.

Expand All @@ -49,7 +49,7 @@ You can read about
[`gatsby-source-filesystem`](/packages/gatsby-source-filesystem)
if you'd like to learn more.

## Add MDX Files
## Add MDX files

Before you can write any GraphQL queries and programmatically create
pages, you need to add some content.
Expand All @@ -64,28 +64,28 @@ mkdir -p content/posts
touch content/posts/blog-{1,2}.mdx
```

> **NOTE**:
> **Note**:
> `mkdir -p path/to/a/directory` will create every folder in the path if
> it does not exist.
>
> _`touch <filename>` will create an empty file named `<filename>`. The
> `touch <filename>` will create an empty file named `<filename>`. The
> brackets (`{}`) are [an
> expansion](https://twitter.com/kentcdodds/status/1083399683932868609?s=19)
> which means you can create multiple files in one command._
> which means you can create multiple files in one command.

Open up each of the files you just created and add some content.

```md:title=blog-1.mdx
---
title: "Blog Post 1"
title: Blog Post 1
---

Trying out MDX
```

```md:title=blog-2.mdx
---
title: "Blog Post 2"
title: Blog Post 2
---

Gatsby is the best
Expand Down Expand Up @@ -138,15 +138,15 @@ paths to usable URLs.

[`onCreateNode`](https://www.gatsbyjs.org/docs/node-apis/#onCreateNode)
is a Gatsby lifecycle method that gets called whenever a new node is
created. In this case only `Mdx` nodes are touched.
created. In this case only `MDX` nodes are touched.

## Create pages from sourced MDX files

In order to create pages from the sourced MDX files, you need
to construct a query that finds all MDX nodes and pulls out
the `slug` field added earlier.

> **NOTE**: You can open up a GraphiQL console for query testing
> **Note**: You can open up a GraphiQL console for query testing
> in your browser at <http://localhost:8000/___graphql>

```graphql
Expand Down Expand Up @@ -219,7 +219,7 @@ API.

## Make a template for your posts

Make a file called `posts-page-layout.js` in `src/components`. This component
You can create a file called `posts-page-layout.js` in `src/components` - this component
will be rendered as the template for all posts. There's a component,
`MDXRenderer` which is used by `gatsby-plugin-mdx` that will be used to render any
programmatically accessed MDX content.
Expand Down Expand Up @@ -294,10 +294,10 @@ That's it, you're done. Run `gatsby develop` and enjoy your new MDX
powers.

Now you have all the pieces you need to programmatically create pages
with Gatsby and `gatsby-plugin-mdx`. Check out our other guides to find out
with Gatsby and `gatsby-plugin-mdx`. You can check out our other guides to find out
more about all of the cool stuff you can do with `gatsby-plugin-mdx`.

## Bonus: Make a Blog Index
## Bonus: Make a blog index

```javascript:title=src/pages/index.js
import React from "react"
Expand Down
10 changes: 5 additions & 5 deletions docs/docs/mdx/writing-pages.md
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,7 @@ query {
}
```

> **Note:** To query `Mdx` content, it must be included in the node system using a
> **Note:** To query `MDX` content, it must be included in the node system using a
> source like the `gatsby-source-filesystem` plugin first. Instructions for sourcing
> content from somewhere like your `/src/pages` directory can be found on the [plugin's README](/packages/gatsby-source-filesystem/).

Expand Down Expand Up @@ -94,12 +94,12 @@ file might look something like this:

### Why Gatsby?

Gatsby delivers faster, more secure sites and apps from a variety of data
Gatsby delivers faster, more secure sites and apps from a variety of data
sources

### Where do I start?

The documentation offers guides for all different skill levels, you can
The documentation offers guides for all different skill levels, you can
find more info at the Gatsby's [Quick Start page](https://www.gatsbyjs.org/docs/quick-start)

<!-- This default export overrides the default layout ensuring -->
Expand Down Expand Up @@ -152,7 +152,7 @@ export const metadata = {
path: "/world",
};

# Hello, <span children={metadata.name} />
# Hello, <span children={metadata.name} />

The span above will read: "Hello, World".

Expand Down Expand Up @@ -210,7 +210,7 @@ const PurpleBorder = ({ children }) => (
export default PurpleBorder
```

## GraphQL Queries
## GraphQL queries

You can fetch data to use in your MDX file by exporting a `pageQuery`
in the same way you would for a `.js` page. The queried data is passed
Expand Down