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

Fixed minor Typos and grammatical errors #9353

Merged
merged 6 commits into from
Dec 12, 2018
Merged
Show file tree
Hide file tree
Changes from 1 commit
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
4 changes: 2 additions & 2 deletions docs/docs/add-a-manifest-file.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,11 +8,11 @@ But first, what exactly _are_ PWAs?

They are regular websites that take advantage of modern browser functionality to augment the web experience with app-like features and benefits. Check out [Google's overview](https://developers.google.com/web/progressive-web-apps/) of what defines a PWA experience and the [Progressive web apps (PWAs) doc](/docs/progressive-web-app/) to learn how a Gatsby site is a progressive web app.

Inclusion of a web app manifest is one of the three generally accepted [baseline requirements for a PWA](https://alistapart.com/article/yes-that-web-project-should-be-a-pwa#section1).
The Inclusion of a web app manifest is one of the three generally accepted [baseline requirements for a PWA](https://alistapart.com/article/yes-that-web-project-should-be-a-pwa#section1).
zaffnet marked this conversation as resolved.
Show resolved Hide resolved

Quoting [Google](https://developers.google.com/web/fundamentals/web-app-manifest/):

> The web app manifest is a simple JSON file that tells the browser about your web application and how it should behave when 'installed' on the users mobile device or desktop.
> The web app manifest is a simple JSON file that tells the browser about your web application and how it should behave when 'installed' on the user's mobile device or desktop.

[Gatsby's manifest plugin](/packages/gatsby-plugin-manifest/) configures Gatsby to create a `manifest.webmanifest` file on every site build.

Expand Down
2 changes: 1 addition & 1 deletion docs/docs/add-a-service-worker.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ title: Add a Service Worker

### What is a service worker

A service worker is a script that your browser runs in the background, separate from a web page, opening the door to features that don't need a web page or user interaction.They increase your site availability in spotty connections, and are essential to making a nice user experience.
A service worker is a script that your browser runs in the background, separate from a web page, opening the door to features that don't need a web page or user interaction. They increase your site availability in spotty connections and are essential to making a nice user experience.
zaffnet marked this conversation as resolved.
Show resolved Hide resolved

It supports features like push notifications and background sync.

Expand Down
2 changes: 1 addition & 1 deletion docs/docs/adding-analytics.md
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@ You can find this tracking ID later by going to `Admin > Tracking Info > Trackin

Now, it's time to configure Gatsby to send page views to your Google Analytics account.

We are going to use `gatsby-plugin-google-analytics`. For other analytics options (including Google Analytics gtag.js ang Google Tag Manager), check [other Gatsby analytics plugins](#other-gatsby-analytics-plugins).
We are going to use `gatsby-plugin-google-analytics`. For other analytics options (including Google Analytics gtag.js and Google Tag Manager), check [other Gatsby analytics plugins](#other-gatsby-analytics-plugins).

```bash
npm install --save gatsby-plugin-google-analytics
Expand Down
4 changes: 2 additions & 2 deletions docs/docs/adding-images-fonts-files.md
Original file line number Diff line number Diff line change
Expand Up @@ -121,11 +121,11 @@ instead. This mechanism provides a number of benefits:
- Result filenames include content hashes so you don’t need to worry about
browsers caching their old versions.

However there is an **escape hatch** that you can use to add an asset outside of
However, there is an **escape hatch** that you can use to add an asset outside of
the module system.

If you put a file into the `static` folder, it will **not** be processed by
Webpack. Instead it will be copied into the public folder untouched. E.g. if you
Webpack. Instead, it will be copied into the public folder untouched. E.g. if you
add a file named `sun.jpg` to the static folder, it'll be copied to
`public/sun.jpg`. To reference assets in the `static` folder, you'll need to
[import a helper function from `gatsby` named `withPrefix`](/docs/gatsby-link/#prefixed-paths-helper).
Expand Down
2 changes: 1 addition & 1 deletion docs/docs/adding-markdown-pages.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ title: Adding Markdown Pages
Gatsby can use markdown files to create pages in your site.
You add plugins to read and understand folders with markdown files and from them create pages automatically.

Here's the steps Gatsby follows for making this happen.
Here are the steps Gatsby follows for making this happen.
zaffnet marked this conversation as resolved.
Show resolved Hide resolved

1. Read files into Gatsby from the filesystem
2. Transform markdown to HTML and frontmatter to data
Expand Down
2 changes: 1 addition & 1 deletion docs/docs/adding-tags-and-categories-to-blog-posts.md
Original file line number Diff line number Diff line change
Expand Up @@ -42,7 +42,7 @@ If `gatsby develop` is running, restart it so Gatsby can pick up the new fields.

## Write a query to get all tags for your posts

Now these fields are available in the data layer. To use field data, query it using `graphql`. All fields are available to query inside `frontmatter`
Now, these fields are available in the data layer. To use field data, query it using `graphql`. All fields are available to query inside `frontmatter`

Try running in Graph<em>i</em>QL (`localhost:8000/___graphql`) the following query

Expand Down
4 changes: 2 additions & 2 deletions docs/docs/api-proxy.md
Original file line number Diff line number Diff line change
Expand Up @@ -26,8 +26,8 @@ the right place in production.

## Advanced proxying

Sometimes you need more granular/flexible access to the develop server.
Gatsby exposes the [Express.js](https://expressjs.com/) develop server to your site's `gatsby-config.js` where you
Sometimes you need more granular/flexible access to the development server.
zaffnet marked this conversation as resolved.
Show resolved Hide resolved
Gatsby exposes the [Express.js](https://expressjs.com/) development server to your site's `gatsby-config.js` where you
can add Express middleware as needed.

```javascript:title=gatsby-config.js
Expand Down
6 changes: 3 additions & 3 deletions docs/docs/api-specification.md
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,7 @@ highlighting to code blocks.
Transformer plugins are decoupled from source plugins. Transformer plugins look
at the media type of new nodes created by source plugins to decide if they can
transform it or not. Which means that a markdown transformer plugin can
transform markdown from any source without any other configuration e.g. from
transform markdown from any source without any other configuration e.g. from a
file, a code comment, or external service like Trello which supports markdown
in some of its data fields.

Expand Down Expand Up @@ -97,15 +97,15 @@ fin
Once the initial bootstrap is finished, we start `webpack-dev-server` and an express server for serving files for the development server, and for a production build, we start building the CSS then JavaScript then HTML with webpack.

During these processes there are various extension points where plugins can
intervene. All major processes have a `onPre` and `onPost` e.g. `onPreBootstrap`
intervene. All major processes have an `onPre` and `onPost` e.g. `onPreBootstrap`
and `onPostBootstrap` or `onPreBuild` or `onPostBuild`. During bootstrap,
plugins can respond at various stages to APIs like `onCreatePages`,
`onCreateBabelConfig`, and `onSourceNodes`.

At each extension point, Gatsby identifies the plugins which implement the API
and calls them in serial following their order in the site's `gatsby-config.js`.

In addition to extension APIs in node, plugins can also implement extension APIs
In addition to extension APIs in a node, plugins can also implement extension APIs
zaffnet marked this conversation as resolved.
Show resolved Hide resolved
in the server rendering process and the browser e.g. `onClientEntry` or
`onRouteUpdate`

Expand Down
2 changes: 1 addition & 1 deletion docs/docs/babel.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ support for writing modern JavaScript — while still supporting older browsers.
## How to specify which browsers to support

Gatsby supports by default the last two versions of major browsers, IE 9+, as well as
any browser that still as 1%+ browser share.
any browser that still has 1%+ browser share.

This means we automatically compile your JavaScript to ensure it works on older browsers.
We also automatically add polyfills as needed — no more shipping code which mysteriously
Expand Down
2 changes: 1 addition & 1 deletion docs/docs/behind-the-scenes-terminology.md
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,7 @@ It is also used by [gatsby-plugin-netlify](/packages/gatsby-plugin-netlify/?=net

### jsonName

The logical name for the page's query json result. The name is constructed during [createPage](https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby/src/redux/actions.js#L229) using a kebabHash of page path. E.g. For above page path, it is:
The logical name for the page's query json result. The name is constructed during [createPage](https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby/src/redux/actions.js#L229) using a kebabHash of page path. E.g. For the above page path, it is:

`blog-2018-07-17-announcing-gatsby-preview-995`

Expand Down
2 changes: 1 addition & 1 deletion docs/docs/building-with-components.md
Original file line number Diff line number Diff line change
Expand Up @@ -118,7 +118,7 @@ export const pageQuery = graphql`
`src/html.jsx` is responsible for everything other than where Gatsby lives in
the `<body />`.

In this file you can modify the `<head>` metadata, general structure of the
In this file, you can modify the `<head>` metadata and the general structure of the
zaffnet marked this conversation as resolved.
Show resolved Hide resolved
document and add external links.

Typically you should omit this from your site as the default html.js file will
Expand Down
8 changes: 4 additions & 4 deletions docs/docs/centralizing-your-sites-navigation.md
Original file line number Diff line number Diff line change
Expand Up @@ -42,11 +42,11 @@ module.exports = {

### Viewing the `siteMetadata` in GraphQL

GraphQL can be used to query for information contained in the `siteMetadata` object located in your project's `gatsby-config.js`. In order to test this out you can start the `default-starter-project` in development mode by running `npm run develop`.
GraphQL can be used to query for information contained in the `siteMetadata` object located in your project's `gatsby-config.js`. In order to test this out, you can start the `default-starter-project` in development mode by running `npm run develop`.

Navigate to `http://localhost:8000/___graphql` in your browser to view the GraphiQL editor, which enables you to test GraphQL queries on the underlying APIs. Using the documentation explorer you can view the current GraphQL schema for your project, which is an invaluable resource during development.

Examining the available types in GraphQL you will notice that you can query `site`. This GraphQL type further returns the `siteMetadata` which needs to be accessed to create the dynamic navigation. At this point it is useful if you know a little GraphQL in order to extract the menu links. If you are unfamiliar with GraphQL, there is some excellent documentation available at GraphQL's official website found [here](https://graphql.org/learn/) tha you can use to brush up on your skills! The query below will return the menu links.
Examining the available types in GraphQL you will notice that you can query `site`. This GraphQL type further returns the `siteMetadata` which needs to be accessed to create the dynamic navigation. At this point, it is useful if you know a little GraphQL in order to extract the menu links. If you are unfamiliar with GraphQL, there is some excellent documentation available at GraphQL's official website found [here](https://graphql.org/learn/) that you can use to brush up on your skills! The query below will return the menu links.

```js
query SiteQuery {
Expand Down Expand Up @@ -90,7 +90,7 @@ Perfect! You now have a way of obtaining data from the `gatsby-config.js` file.

### Pulling data inside the layout component

Inside your project, locate the `src/components` folder and navigate to the `layout.js` file. Within this layout component you should notice a component named `StaticQuery`.
Inside your project, locate the `src/components` folder and navigate to the `layout.js` file. Within this layout component, you should notice a component named `StaticQuery`.

StaticQuery is a new component introduced in Gatsby V2, which allows you to run GraphQL queries within your components, not just pages. It allows developers to collocate data with their components.

Expand Down Expand Up @@ -141,7 +141,7 @@ const Layout = ({ children }) => (

With the above changes to your `StaticQuery` component, the `render` property, which accepts a function that takes one argument, now has access to the menu links for use inside the function (as the argument). The last thing that is left to do is to display the site's navigation.

To do this, the header component that is already available in the project seems like it might be a good starting place to display the navigation. Lets pass the `menuLinks` object to this header component like so:
To do this, the header component that is already available in the project seems like it might be a good starting place to display the navigation. Let's pass the `menuLinks` object to this header component like so:

```diff:title=src/components/layout.js
const Layout = ({ children }) => (
Expand Down
8 changes: 4 additions & 4 deletions docs/docs/create-source-plugin.md
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,7 @@ node for the markdown content and set its mediaType as `text/markdown` and the
various Gatsby markdown transformer plugins will see your node and transform it
into HTML.

This loose coupling between data source and transformer plugins allow Gatsby
This loose coupling between the data source and the transformer plugins allow Gatsby
site builders to quickly assemble complex data transformation pipelines with
little work on their (and your (the source plugin author)) part.

Expand All @@ -53,7 +53,7 @@ What does the code look like?
A source plugin is a normal NPM package. It has a package.json with optional
dependencies as well as a `gatsby-node.js` where you implement Gatsby's Node.js
APIs. Gatsby supports node versions back to Node 4 and as it's common to want to
use more modern Node.js and JavaScript syntax, many plugins write code in a
use more modern Node.js and JavaScript syntax, many plugins write code in an
zaffnet marked this conversation as resolved.
Show resolved Hide resolved
`src` directory and compile the code. All plugins maintained in the Gatsby repo
follow this pattern.

Expand Down Expand Up @@ -90,7 +90,7 @@ But at a high-level, these are the jobs of a source plugin:
[_Node Link_](/docs/api-specification/) in the API specification concepts
section.
- Return either a promise or use the callback (3rd parameter) to report back to
Gatsby when you're done sourcing nodes. Otherwise either Gatsby will continue
Gatsby when you're done sourcing nodes. Otherwise, either Gatsby will continue
on before you're done sourcing or hang while waiting for you to indicate
you're finished.

Expand All @@ -113,7 +113,7 @@ There are two ways of adding node relationships in Gatsby: (1) transformations (

An example of a transformation relationship is the `gatsby-transformer-remark` plugin, which transforms a parent `fileNode`'s markdown string into a `MarkdownRemark` node. The Remark transformer plugin adds its newly created child node as a child of the parent node using the action `createParentChildLink`. Transformation relationships are used when a new node is _completely_ derived from a single parent node. E.g. the markdown node is derived from the parent `fileNode` and wouldn't ever exist if the parent `fileNode` hadn't been created.

Because all children nodes are derived from their parent, when a parent node is deleted or changed, Gatsby deletes all of the child nodes (and their child nodes, and so on) with the expectation that they'll be recreated again by transformer plugins. This is done to ensure there's not nodes left over that were derived from older versions of data but shouldn't exist any longer.
Because all children nodes are derived from their parent, when a parent node is deleted or changed, Gatsby deletes all of the child nodes (and their child nodes, and so on) with the expectation that they'll be recreated again by transformer plugins. This is done to ensure there are no nodes left over that were derived from older versions of data but shouldn't exist any longer.

_Creating the transformation relationship_

Expand Down
4 changes: 2 additions & 2 deletions docs/docs/create-transformer-plugin.md
Original file line number Diff line number Diff line change
Expand Up @@ -35,9 +35,9 @@ Information on the purpose of this function can be found in the [API reference](

## Using the cache

Sometimes transforming properties costs time and resources and in order to avoid recreating these properties at each run you can profit from the global cache mechanism Gatsby provides.
Sometimes transforming properties costs time and resources and in order to avoid recreating these properties at each run, you can profit from the global cache mechanism Gatsby provides.

Cache keys should at least contain the contentDigest of the concerned. For example the `gatsby-transformer-remark` uses the following cache key for the html node:
Cache keys should at least contain the contentDigest of the concerned. For example, the `gatsby-transformer-remark` uses the following cache key for the html node:

```javascript:title=extend-node-type.js
const htmlCacheKey = node =>
Expand Down