From d298238529b728f096a91886e9a5a077ae5bff8e Mon Sep 17 00:00:00 2001
From: gillkyle <kylerobertgill@gmail.com>
Date: Fri, 12 Jan 2018 09:06:42 -0700
Subject: [PATCH 1/4] Update CONTRIBUTING.md

small typo
---
 CONTRIBUTING.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
index b72c8c893dccf..bdec4b9387545 100644
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -65,7 +65,7 @@ a pull request.
   additions or modifications here.
 * Make sure to double check your grammar and capitalise correctly.
 * Commit and push to your fork.
-* Create an pull request from your branch.
+* Create a pull request from your branch.
 
 ## Development tools
 

From afffb3f7e29f08556802098484fd1288b8b6724e Mon Sep 17 00:00:00 2001
From: gillkyle <kylerobertgill@gmail.com>
Date: Fri, 12 Jan 2018 09:47:34 -0700
Subject: [PATCH 2/4] Update README.md

typo fixes and additional section
---
 packages/gatsby-image/README.md | 23 ++++++++++++++++++++++-
 1 file changed, 22 insertions(+), 1 deletion(-)

diff --git a/packages/gatsby-image/README.md b/packages/gatsby-image/README.md
index 740aa5e34b283..de5dcdc725528 100644
--- a/packages/gatsby-image/README.md
+++ b/packages/gatsby-image/README.md
@@ -31,7 +31,7 @@ Ideally you would:
   show a preview of the image while it loads
 * Hold the image position so your page doesn't jump while images load
 
-Doing this consistantly across a site feels like sisyphean labor. You manually
+Doing this consistently across a site feels like sisyphean labor. You manually
 optimize your images and then… several images are swapped in at the last minute
 or a design-tweak shaves 100px of width off your images.
 
@@ -56,6 +56,27 @@ The GraphQL query creates multiple thumbnails with optimized JPEG and PNG
 compression. The `gatsby-image` component automatically sets up the "blur-up"
 effect as well as lazy loading of images further down the screen.
 
+## Install
+
+`npm install --save gatsby-image`
+
+Depending on the gatsby starter you used, you may need to include [gatsby-transformer-sharp](/packages/gatsby-transformer-sharp/) and [gatsby-plugin-sharp](/packages/gatsby-plugin-sharp/) as well, and make sure they are installed and included in your gatsby-config.
+
+```
+npm install --save gatsby-transformer-sharp
+npm install --save gatsby-plugin-sharp
+```
+
+Then in your `gatsby-config.js`:
+```
+plugins: [
+  `gatsby-transformer-sharp`,
+  `gatsby-plugin-sharp`
+];
+```
+
+## How to use
+
 This is what a component using `gatsby-images` looks like.
 
 ```jsx

From e06212dd857f6101084676d3b7b69b39689e27d3 Mon Sep 17 00:00:00 2001
From: gillkyle <kylerobertgill@gmail.com>
Date: Fri, 12 Jan 2018 09:51:29 -0700
Subject: [PATCH 3/4] Update awesome-gatsby.md

---
 docs/docs/awesome-gatsby.md | 1 +
 1 file changed, 1 insertion(+)

diff --git a/docs/docs/awesome-gatsby.md b/docs/docs/awesome-gatsby.md
index 96051852b53ae..a5833dba8a0ac 100644
--- a/docs/docs/awesome-gatsby.md
+++ b/docs/docs/awesome-gatsby.md
@@ -19,3 +19,4 @@ A curated list of interesting Gatsby community projects and learning resources.
 * [Egghead course — "Build a Blog with React and Markdown using Gatsby"](https://egghead.io/courses/build-a-blog-with-react-and-markdown-using-gatsby)
 * [Build a photo site with Gatsby — 6 part tutorial](https://jeremey.blog/gatsby-photo/)
 * [Blazing fast website with Gatsby and Contentful series](https://www.youtube.com/watch?v=Ek4o40w1tH4&list=PL8KiuH6vpACV-F7jXribe4YveGBhBeG9A)
+* [Image Optimization Made Easy with Gatsby.js](https://medium.com/@kyle.robert.gill/ridiculously-easy-image-optimization-with-gatsby-js-59d48e15db6e)

From 01c2592ea62b4894dacc3ea9ba72aa1d3179e97f Mon Sep 17 00:00:00 2001
From: Kyle Mathews <mathews.kyle@gmail.com>
Date: Fri, 12 Jan 2018 10:21:14 -0800
Subject: [PATCH 4/4] Update README.md

---
 packages/gatsby-image/README.md | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/packages/gatsby-image/README.md b/packages/gatsby-image/README.md
index de5dcdc725528..81f5139819f90 100644
--- a/packages/gatsby-image/README.md
+++ b/packages/gatsby-image/README.md
@@ -105,6 +105,8 @@ export const query = graphql`
 `;
 ```
 
+For another explanation of how to get started with gatsby-image, see this blog post by community member Kyle Gill [Image Optimization Made Easy with Gatsby.js](https://medium.com/@kyle.robert.gill/ridiculously-easy-image-optimization-with-gatsby-js-59d48e15db6e)
+
 ## Two types of responsive images
 
 There are two types of responsive images supported by gatsby-image.