From 0188ea72fd987cb8cfc6eaa903460fb217344682 Mon Sep 17 00:00:00 2001
From: benjamin hoffman <6520022+benjaminhoffman@users.noreply.github.com>
Date: Sun, 14 Jan 2018 20:08:42 -0800
Subject: [PATCH 1/8] Removes words like 'simple' & 'easy' from docs/www
---
.../index.md | 2 +-
docs/blog/2017-11-06-migrate-hugo-gatsby/index.md | 6 +++---
docs/blog/gatsby-v1.md | 8 ++++----
docs/blog/gatsbygram-case-study/index.md | 6 +++---
docs/docs/add-404-page.md | 2 +-
docs/docs/gatsby-starters.md | 2 +-
docs/docs/gatsby-style-guide.md | 4 ++--
docs/docs/glamor.md | 2 +-
docs/tutorial/part-four/index.md | 8 ++++----
docs/tutorial/part-one/index.md | 10 +++++-----
docs/tutorial/part-two/index.md | 6 +++---
packages/gatsby-plugin-netlify/src/plugin-data.js | 2 +-
packages/gatsby-remark-prismjs/README.md | 2 +-
13 files changed, 30 insertions(+), 30 deletions(-)
diff --git a/docs/blog/2017-10-01-migrating-my-blog-from-hexo-to-gatsby/index.md b/docs/blog/2017-10-01-migrating-my-blog-from-hexo-to-gatsby/index.md
index 6f9875eb4fb19..0bf6dc9a33b53 100644
--- a/docs/blog/2017-10-01-migrating-my-blog-from-hexo-to-gatsby/index.md
+++ b/docs/blog/2017-10-01-migrating-my-blog-from-hexo-to-gatsby/index.md
@@ -522,7 +522,7 @@ If you've worked with GraphQL before this should look very familiar. In fact, as
you can see the string type is imported directly from GraphQL and not from
Gatsby.
-Basically you check the type of node and if it's a type your interested in you
+You check the type of node and if it's a type your interested in you
resolve with some fields. Fields in GraphQL require a `type` and a way to
`resolve` the value.
diff --git a/docs/blog/2017-11-06-migrate-hugo-gatsby/index.md b/docs/blog/2017-11-06-migrate-hugo-gatsby/index.md
index b7b815912da59..e587f3570465f 100644
--- a/docs/blog/2017-11-06-migrate-hugo-gatsby/index.md
+++ b/docs/blog/2017-11-06-migrate-hugo-gatsby/index.md
@@ -89,8 +89,8 @@ programatic creation of pages explained in the next section.
This is the official
[documentation](/docs/creating-and-modifying-pages/),
plus there is a
-[tutorial](/tutorial/part-four/#data-in-gatsby) which
-gives examples. Basically, I had to create a `gatsby-node.js` file which exports
+[tutorial](/tutorial/part-four/#data-in-gatsby), which
+gives examples. In sum, I created a `gatsby-node.js` file which exports
`createPages` method using the `createPage` action from
[`boundActionCreators`](/docs/bound-action-creators/).
@@ -165,7 +165,7 @@ for the
The approach is well documented and you can also see
[previews of the themes online](http://kyleamathews.github.io/typography.js/).
-Steps were quite easy:
+Steps were:
Add `gatsby-plugin-typography` and `typography-theme-moraga` (for example) and
"enable" the plugin in the `gatsby-config.js` file:
diff --git a/docs/blog/gatsby-v1.md b/docs/blog/gatsby-v1.md
index 7b11267508a61..c10e9ecfd5aa2 100644
--- a/docs/blog/gatsby-v1.md
+++ b/docs/blog/gatsby-v1.md
@@ -116,7 +116,7 @@ enables rich integrations with CMSs like Contentful, Wordpress, and Drupal along
with other remote and local sources.
In Gatsby v0, (like pretty much every static site generator) data was processed
-then _pushed_ into templates to be rendered into HTML. This is a simple pattern
+then _pushed_ into templates to be rendered into HTML. This is a straight-forward pattern
and works great for many use cases. But when you start working on more complex
sites, you really start to miss the flexibility of a database-driven site. With
a database, all your data is available to query against in any fashion you'd
@@ -144,7 +144,7 @@ This pattern of _colocating_ your queries next to your views is copied from the
Colocation makes it easy to fully understand your views as everything necessary
for that view is fully defined there.
-A simple example of how this works in practice.
+An example of how this works in practice.
Say we had a markdown file that looked like:
@@ -161,7 +161,7 @@ In our site, we would write a React component which acts as a template for all
the blog posts. Included with the component is an exported `pageQuery`.
```jsx
-// A simple React component for rendering a blog page.
+// A basic React component for rendering a blog page.
import React from "react";
class BlogPostTemplate extends React.Component {
@@ -297,7 +297,7 @@ uses [Redux](http://redux.js.org/) to communicate with their Django API.
The marketing portion of the site loads quickly with minimal JavaScript. When a
potential customer goes to sign-up for the app, there's no _awkward jump from
-the marketing website to the web app_—just a simple page change which seamlessly
+the marketing website to the web app_—just a page change which seamlessly
loads in the needed JavaScript. The _team is sharing components and styles
across the site_ without stepping on each others shoes as they rapidly iterate
on features.
diff --git a/docs/blog/gatsbygram-case-study/index.md b/docs/blog/gatsbygram-case-study/index.md
index 0d435a01dc9ee..945b45c831b08 100644
--- a/docs/blog/gatsbygram-case-study/index.md
+++ b/docs/blog/gatsbygram-case-study/index.md
@@ -298,7 +298,7 @@ export const pageQuery = `
In addition to creating pages for our Instagram photos, we want to make an index
page for browsing all photos. To build this index page, Gatsby lets us create
-pages using simple React.js components.
+pages using React.js components.
```
pages/
@@ -310,7 +310,7 @@ These React component pages can query the Gatsbygram GraphQL schema for data and
are automatically converted into their own pages at `gatsbygram.gatsbyjs.org/`
and `gatsbygram.gatsbyjs.org/about/`.
-Gatsbygram's `about.js` is a simple React component with no query. `index.js` is
+Gatsbygram's `about.js` is a plain React component with no query. `index.js` is
more complex. It queries for thumbnails for all images and has an infinite
scroll implementation to lazy load in image thumbnails.
@@ -325,7 +325,7 @@ your header, footer, and default page structure. It is also used as the
"[app shell](https://developers.google.com/web/updates/2015/11/app-shell)" when
loading your site from a service worker.
-A simple layout component might look something like this.
+A small layout component might look something like this.
```jsx
import React from "react";
diff --git a/docs/docs/add-404-page.md b/docs/docs/add-404-page.md
index 33342832b3d55..c2df07348e48c 100644
--- a/docs/docs/add-404-page.md
+++ b/docs/docs/add-404-page.md
@@ -2,7 +2,7 @@
title: "Add 404 Page"
---
-Adding a 404 page is easy. First, create a page whose path matches the regex
+Adding a 404 page is simple. First, create a page whose path matches the regex
`/404*`. Most often you'll want to create a React component page at
`src/pages/404.js`.
diff --git a/docs/docs/gatsby-starters.md b/docs/docs/gatsby-starters.md
index 6695e1373e2bf..f167311006b05 100644
--- a/docs/docs/gatsby-starters.md
+++ b/docs/docs/gatsby-starters.md
@@ -77,7 +77,7 @@ Community:
* Bootstrap CSS framework
* Single column layout
- * Simple components: SiteNavi, SitePost, SitePage
+ * Basic components: SiteNavi, SitePost, SitePage
* [gatsby-blog-starter-kit](https://github.com/dschau/gatsby-blog-starter-kit)
diff --git a/docs/docs/gatsby-style-guide.md b/docs/docs/gatsby-style-guide.md
index 82a2e70376086..9fe4a5d3b5744 100644
--- a/docs/docs/gatsby-style-guide.md
+++ b/docs/docs/gatsby-style-guide.md
@@ -195,7 +195,7 @@ to read.
# Formatting example code
Readers will likely use Guide articles as a quick reference to look up syntax.
-Articles should have simple real-world examples that show common-use cases of
+Articles should have a bare-bones, real-world example that show common-use cases of
that syntax.
Here are specific formatting guidelines for any code:
@@ -258,7 +258,7 @@ it in a clear, accurate, and objective manner. You'll likely go through several
rounds of proofreading and editing before you're happy with your writing.
Use the [Hemingway App](http://www.hemingwayapp.com/). There’s nothing magical
-about this simple tool, but it will automatically detect widely agreed-upon
+about this tool, but it will automatically detect widely agreed-upon
style issues:
* passive voice
diff --git a/docs/docs/glamor.md b/docs/docs/glamor.md
index 37bbd3ca5eaa5..e63a5678d3b4e 100644
--- a/docs/docs/glamor.md
+++ b/docs/docs/glamor.md
@@ -9,7 +9,7 @@ CSS syntax React supports for the `style` prop. Glamor is a variant on "CSS-in-J
One of the most important problems they solve is selector name collisions. With traditional CSS, you have to be careful not to overwrite CSS selectors used elsewhere in a site because all CSS selectors live in the same global namespace. This unfortunate restriction can lead to elaborate (and often confusing) selector naming schemes.
-With CSS-in-JS, you avoid all that as CSS selectors are scoped automatically to their component. Styles are tightly coupled with their components. This makes it very easy to know how to edit a component's CSS as there's never any confusion about how and where CSS is being used.
+With CSS-in-JS, you avoid all that as CSS selectors are scoped automatically to their component. Styles are tightly coupled with their components. This makes it easier to know how to edit a component's CSS as there's never any confusion about how and where CSS is being used.
First, open a new terminal window and run the following to create a new site:
diff --git a/docs/tutorial/part-four/index.md b/docs/tutorial/part-four/index.md
index b6515dc10638f..46b1c4a00d2d6 100644
--- a/docs/tutorial/part-four/index.md
+++ b/docs/tutorial/part-four/index.md
@@ -73,7 +73,7 @@ In Gatsby, GraphQL enables components to declare and receive the data they need.
## Our first GraphQL query
Let's create another new site for this part of the tutorial like in the previous
-parts. We're going to build a simple Markdown blog called "Pandas Eating Lots".
+parts. We're going to build a Markdown blog called "Pandas Eating Lots".
It's dedicated to showing off the best pictures & videos of Pandas eating lots
of food. Along the way we'll be dipping our toes into GraphQL and Gatsby's
Markdown support.
@@ -197,7 +197,7 @@ the following:

-We have another simple site with a layout and two pages.
+We have another small site with a layout and two pages.
Now let's start querying 😋
@@ -211,7 +211,7 @@ error-prone, especially as sites get larger and more complex. It's much better t
store the title in one place and then _pull_ that title into components whenever
we need it.
-To solve this, Gatsby supports a simple pattern for adding site "metadata"—like
+To solve this, Gatsby supports the following pattern for adding site "metadata"—like
the title.
We add this data to the `gatsby-config.js` file. Let's add our site title to
@@ -1078,7 +1078,7 @@ export const query = graphql`
`
```
-And there we go! A working (albeit quite simple still) blog!
+And there we go! A working, albeit small, blog!
Try playing more with the site. Try adding some more Markdown files. Explore
querying other data from the `MarkdownRemark` nodes and adding them to the
diff --git a/docs/tutorial/part-one/index.md b/docs/tutorial/part-one/index.md
index 24d96b1827719..0f4055268cd1b 100644
--- a/docs/tutorial/part-one/index.md
+++ b/docs/tutorial/part-one/index.md
@@ -202,11 +202,11 @@ pages!
## Interactive page
-One nice thing about using Gatsby for building websites vs other tools is it's
-so easy to add interactivity to your pages. React.js was designed for
+One nice thing about using Gatsby for building websites vs. other tools is itʼs
+so easier to add interactivity to your pages. React.js was designed for
Facebook.com and is used on many other world-class web applications.
-Let's see how easy it is to add interactive elements to our pages.
+Let's see how much easier it is to add interactive elements to our pages.
We'll start by creating a new link to a page at `/counter`/ from our original
`index.js` page component `Counter`.
@@ -339,8 +339,8 @@ changes the count.
## Deploying Gatsby.js websites on the web
-Gatsby.js is a _static site generator_ which makes deploying Gatsby sites to the
-web really easy. There are no servers to setup or complicated databases to
+Gatsby.js is a _static site generator_, which makes deploying Gatsby sites to the
+web really easier. There are no servers to setup or complicated databases to
deploy. Instead, the Gatsby `build` command produces a directory of static HTML
and JavaScript files which you can deploy to a static site hosting service.
diff --git a/docs/tutorial/part-two/index.md b/docs/tutorial/part-two/index.md
index a22b1b229a724..325c355f367f6 100644
--- a/docs/tutorial/part-two/index.md
+++ b/docs/tutorial/part-two/index.md
@@ -17,7 +17,7 @@ within the same file.
While a seemingly simple change, it has profound implications for how you think
about building websites.
-Take the simple example of creating a custom button. In the past you would
+Take the example of creating a custom button. In the past you would
create a CSS class (perhaps `.primary-button`) with your custom styles and then
whenever you want to apply those styles e.g.
@@ -101,7 +101,7 @@ JavaScript code) that others can then use when building Gatsby sites.
There's already dozens of plugins! Check them out at the
[plugins section of the site](/docs/plugins/).
-Gatsby plugins are easy to install and use. In almost every Gatsby site you
+Our goal with Gatsby plugins is to make them easy to install and use. In almost every Gatsby site you
build, you will be installing plugins. While working through the rest of the
tutorial, you'll have many opportunities to practice installing and using
plugins.
@@ -376,7 +376,7 @@ Your page should now look like:

-Let's create a simple list of people with names, avatars, and short latin
+Let's create a list of people with names, avatars, and short latin
biographies.
First, let's create the file for the CSS at
diff --git a/packages/gatsby-plugin-netlify/src/plugin-data.js b/packages/gatsby-plugin-netlify/src/plugin-data.js
index 37cd6b1ee756e..92fc471fc7991 100644
--- a/packages/gatsby-plugin-netlify/src/plugin-data.js
+++ b/packages/gatsby-plugin-netlify/src/plugin-data.js
@@ -36,7 +36,7 @@ export default function makePluginData(store, assetsManifest, pathPrefix) {
const chunkManifest = normalizeStats(stats)
const pages = applyLayouts(storePages, layouts)
- // We combine the manifest of JS and the manifest of assets to make a simple lookup table.
+ // We combine the manifest of JS and the manifest of assets to make a lookup table.
const manifest = { ...assetsManifest, ...chunkManifest }
return {
diff --git a/packages/gatsby-remark-prismjs/README.md b/packages/gatsby-remark-prismjs/README.md
index 81b138b989d14..3a1c225d549b3 100644
--- a/packages/gatsby-remark-prismjs/README.md
+++ b/packages/gatsby-remark-prismjs/README.md
@@ -57,7 +57,7 @@ If you want to highlight lines of code, you also need to add some additional CSS
that targets our _custom line highlighting implementation_ (which slightly
differs from PrismJS's own plugin for that – more on that later).
-For simple line highlights similar to PrismJS's, try:
+For line highlights similar to PrismJS's, try:
```css
.gatsby-highlight-code-line {
From b2af0c35ab78df5c27132cb6e3c357dfe4d09b99 Mon Sep 17 00:00:00 2001
From: benjamin hoffman <6520022+benjaminhoffman@users.noreply.github.com>
Date: Mon, 15 Jan 2018 14:19:03 -0800
Subject: [PATCH 2/8] Additional optimizations
---
.../index.md | 2 +-
docs/docs/add-404-page.md | 2 +-
docs/docs/gatsby-style-guide.md | 4 ++--
docs/docs/styled-components.md | 2 +-
docs/tutorial/part-four/index.md | 7 ++-----
docs/tutorial/part-one/index.md | 5 ++---
6 files changed, 9 insertions(+), 13 deletions(-)
diff --git a/docs/blog/2017-10-01-migrating-my-blog-from-hexo-to-gatsby/index.md b/docs/blog/2017-10-01-migrating-my-blog-from-hexo-to-gatsby/index.md
index 0bf6dc9a33b53..1796784896944 100644
--- a/docs/blog/2017-10-01-migrating-my-blog-from-hexo-to-gatsby/index.md
+++ b/docs/blog/2017-10-01-migrating-my-blog-from-hexo-to-gatsby/index.md
@@ -522,7 +522,7 @@ If you've worked with GraphQL before this should look very familiar. In fact, as
you can see the string type is imported directly from GraphQL and not from
Gatsby.
-You check the type of node and if it's a type your interested in you
+You check the type of node and if it's a type youʼre interested in you
resolve with some fields. Fields in GraphQL require a `type` and a way to
`resolve` the value.
diff --git a/docs/docs/add-404-page.md b/docs/docs/add-404-page.md
index c2df07348e48c..b04b2cbcb1287 100644
--- a/docs/docs/add-404-page.md
+++ b/docs/docs/add-404-page.md
@@ -2,7 +2,7 @@
title: "Add 404 Page"
---
-Adding a 404 page is simple. First, create a page whose path matches the regex
+To create a 404 page create a page whose path matches the regex
`/404*`. Most often you'll want to create a React component page at
`src/pages/404.js`.
diff --git a/docs/docs/gatsby-style-guide.md b/docs/docs/gatsby-style-guide.md
index 9fe4a5d3b5744..975c1c4c09459 100644
--- a/docs/docs/gatsby-style-guide.md
+++ b/docs/docs/gatsby-style-guide.md
@@ -195,8 +195,8 @@ to read.
# Formatting example code
Readers will likely use Guide articles as a quick reference to look up syntax.
-Articles should have a bare-bones, real-world example that show common-use cases of
-that syntax.
+Articles should be a basic, real-world example that show common use cases of
+its syntax.
Here are specific formatting guidelines for any code:
diff --git a/docs/docs/styled-components.md b/docs/docs/styled-components.md
index 5438b67740385..3d842bc9b3851 100644
--- a/docs/docs/styled-components.md
+++ b/docs/docs/styled-components.md
@@ -8,7 +8,7 @@ Styled Components lets you use actual CSS syntax inside your components. Styled
One of the most important problems they solve is selector name collisions. With traditional CSS, you have to be careful not to overwrite CSS selectors used elsewhere in a site because all CSS selectors live in the same global namespace. This unfortunate restriction can lead to elaborate (and often confusing) selector naming schemes.
-With CSS-in-JS, you avoid all that as CSS selectors are scoped automatically to their component. Styles are tightly coupled with their components. This makes it very easy to know how to edit a component's CSS as there's never any confusion about how and where CSS is being used.
+With CSS-in-JS, you avoid all that as CSS selectors are scoped automatically to their component. Styles are tightly coupled with their components. This makes it much easier to know how to edit a component's CSS, as there's never any confusion about how and where CSS is being used.
First, open a new terminal window and run the following to create a new site:
diff --git a/docs/tutorial/part-four/index.md b/docs/tutorial/part-four/index.md
index 46b1c4a00d2d6..2934327020c8f 100644
--- a/docs/tutorial/part-four/index.md
+++ b/docs/tutorial/part-four/index.md
@@ -211,10 +211,7 @@ error-prone, especially as sites get larger and more complex. It's much better t
store the title in one place and then _pull_ that title into components whenever
we need it.
-To solve this, Gatsby supports the following pattern for adding site "metadata"—like
-the title.
-
-We add this data to the `gatsby-config.js` file. Let's add our site title to
+To solve this, we can add site "metadata" — like page title or description — to the `gatsby-config.js` file. Let's add our site title to
`gatsby-config.js` file and then query it from our layout and about page!
Edit your `gatsby-config.js`:
@@ -706,7 +703,7 @@ seem to really enjoy bananas!

-Which looks great! Except…the order of the posts is wrong.
+Which looks great! Except… the order of the posts is wrong.
But this is easy to fix. When querying a connection of some type, you can pass a
variety of arguments to the query. You can `sort` and `filter` nodes, set how
diff --git a/docs/tutorial/part-one/index.md b/docs/tutorial/part-one/index.md
index 0f4055268cd1b..f7844e1fd013d 100644
--- a/docs/tutorial/part-one/index.md
+++ b/docs/tutorial/part-one/index.md
@@ -202,8 +202,7 @@ pages!
## Interactive page
-One nice thing about using Gatsby for building websites vs. other tools is itʼs
-so easier to add interactivity to your pages. React.js was designed for
+One nice thing about using Gatsby for building websites vs. other tools is itʼs easier to add interactivity to your pages. React.js was designed for
Facebook.com and is used on many other world-class web applications.
Let's see how much easier it is to add interactive elements to our pages.
@@ -340,7 +339,7 @@ changes the count.
## Deploying Gatsby.js websites on the web
Gatsby.js is a _static site generator_, which makes deploying Gatsby sites to the
-web really easier. There are no servers to setup or complicated databases to
+web easier. There are no servers to setup or complicated databases to
deploy. Instead, the Gatsby `build` command produces a directory of static HTML
and JavaScript files which you can deploy to a static site hosting service.
From 85cedb2bf46d2e1027a68c93277f3433422541e0 Mon Sep 17 00:00:00 2001
From: Kyle Mathews
Date: Mon, 15 Jan 2018 16:51:03 -0800
Subject: [PATCH 3/8] Update gatsby-v1.md
---
docs/blog/gatsby-v1.md | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/docs/blog/gatsby-v1.md b/docs/blog/gatsby-v1.md
index c10e9ecfd5aa2..2e3f9783f9986 100644
--- a/docs/blog/gatsby-v1.md
+++ b/docs/blog/gatsby-v1.md
@@ -297,7 +297,7 @@ uses [Redux](http://redux.js.org/) to communicate with their Django API.
The marketing portion of the site loads quickly with minimal JavaScript. When a
potential customer goes to sign-up for the app, there's no _awkward jump from
-the marketing website to the web app_—just a page change which seamlessly
+the marketing website to the web app_—just a simple page change which seamlessly
loads in the needed JavaScript. The _team is sharing components and styles
across the site_ without stepping on each others shoes as they rapidly iterate
on features.
From bae5428eac4feeeb7a828ce83c177df664474ceb Mon Sep 17 00:00:00 2001
From: Kyle Mathews
Date: Mon, 15 Jan 2018 16:51:37 -0800
Subject: [PATCH 4/8] Update add-404-page.md
---
docs/docs/add-404-page.md | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/docs/docs/add-404-page.md b/docs/docs/add-404-page.md
index b04b2cbcb1287..337bc5b80e502 100644
--- a/docs/docs/add-404-page.md
+++ b/docs/docs/add-404-page.md
@@ -2,7 +2,7 @@
title: "Add 404 Page"
---
-To create a 404 page create a page whose path matches the regex
+To create a 404 page create a page whose path matches the regex
`/404*`. Most often you'll want to create a React component page at
`src/pages/404.js`.
From 839e3b19fd029d1566ca33b30aa70f2cb2961c12 Mon Sep 17 00:00:00 2001
From: Kyle Mathews
Date: Mon, 15 Jan 2018 16:52:41 -0800
Subject: [PATCH 5/8] Update gatsby-style-guide.md
---
docs/docs/gatsby-style-guide.md | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/docs/docs/gatsby-style-guide.md b/docs/docs/gatsby-style-guide.md
index 975c1c4c09459..bc71db34477e4 100644
--- a/docs/docs/gatsby-style-guide.md
+++ b/docs/docs/gatsby-style-guide.md
@@ -195,7 +195,7 @@ to read.
# Formatting example code
Readers will likely use Guide articles as a quick reference to look up syntax.
-Articles should be a basic, real-world example that show common use cases of
+Articles should have a basic, real-world example that shows common use cases of
its syntax.
Here are specific formatting guidelines for any code:
From a5ea0742e01eaef0bd4f7869b99f51a0c3fd4282 Mon Sep 17 00:00:00 2001
From: Kyle Mathews
Date: Mon, 15 Jan 2018 16:53:26 -0800
Subject: [PATCH 6/8] Update styled-components.md
---
docs/docs/styled-components.md | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/docs/docs/styled-components.md b/docs/docs/styled-components.md
index 3d842bc9b3851..a5cdc6f88ba09 100644
--- a/docs/docs/styled-components.md
+++ b/docs/docs/styled-components.md
@@ -8,7 +8,7 @@ Styled Components lets you use actual CSS syntax inside your components. Styled
One of the most important problems they solve is selector name collisions. With traditional CSS, you have to be careful not to overwrite CSS selectors used elsewhere in a site because all CSS selectors live in the same global namespace. This unfortunate restriction can lead to elaborate (and often confusing) selector naming schemes.
-With CSS-in-JS, you avoid all that as CSS selectors are scoped automatically to their component. Styles are tightly coupled with their components. This makes it much easier to know how to edit a component's CSS, as there's never any confusion about how and where CSS is being used.
+With CSS-in-JS, you avoid all that as CSS selectors are scoped automatically to their component. Styles are tightly coupled with their components. This makes it much easier to know how to edit a component's CSS as there's never any confusion about how and where CSS is being used.
First, open a new terminal window and run the following to create a new site:
From ac5b81d69f22ecd34b9c47c7712177f1ce7dc4b6 Mon Sep 17 00:00:00 2001
From: Kyle Mathews
Date: Mon, 15 Jan 2018 16:54:42 -0800
Subject: [PATCH 7/8] Update index.md
---
docs/tutorial/part-one/index.md | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/docs/tutorial/part-one/index.md b/docs/tutorial/part-one/index.md
index f7844e1fd013d..1846b2e908c2b 100644
--- a/docs/tutorial/part-one/index.md
+++ b/docs/tutorial/part-one/index.md
@@ -205,7 +205,7 @@ pages!
One nice thing about using Gatsby for building websites vs. other tools is itʼs easier to add interactivity to your pages. React.js was designed for
Facebook.com and is used on many other world-class web applications.
-Let's see how much easier it is to add interactive elements to our pages.
+Let's see how easy it is to add interactive elements to our pages.
We'll start by creating a new link to a page at `/counter`/ from our original
`index.js` page component `Counter`.
From 1ea872677a463517faa5e8a378b8326fa912d80c Mon Sep 17 00:00:00 2001
From: Kyle Mathews
Date: Mon, 15 Jan 2018 16:55:50 -0800
Subject: [PATCH 8/8] Update index.md
---
docs/tutorial/part-one/index.md | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/docs/tutorial/part-one/index.md b/docs/tutorial/part-one/index.md
index 1846b2e908c2b..bccf0db97ffe3 100644
--- a/docs/tutorial/part-one/index.md
+++ b/docs/tutorial/part-one/index.md
@@ -339,7 +339,7 @@ changes the count.
## Deploying Gatsby.js websites on the web
Gatsby.js is a _static site generator_, which makes deploying Gatsby sites to the
-web easier. There are no servers to setup or complicated databases to
+web much easier vs. traditional CMSs. There are no servers to setup or complicated databases to
deploy. Instead, the Gatsby `build` command produces a directory of static HTML
and JavaScript files which you can deploy to a static site hosting service.