Merge remote-tracking branch 'origin/v2'

.babelrc

@@ -1,4 +0,0 @@
-{
-  "presets": ['react', 'es2015', 'stage-1'],
-  "plugins": ['add-module-exports']
-}

gatsby-config.js

@@ -45,6 +45,18 @@ module.exports = {
       },
     },
     `gatsby-plugin-feed`,
+    {
+      resolve: `gatsby-plugin-manifest`,
+      options: {
+        name: `Gatsby Starter Blog`,
+        short_name: `GatsbyJS`,
+        start_url: `/`,
+        background_color: `#ffffff`,
+        theme_color: `#663399`,
+        display: `minimal-ui`,
+        icon: `src/assets/gatsby-icon.png`,
+      },
+    },
     `gatsby-plugin-offline`,
     `gatsby-plugin-react-helmet`,
     {

gatsby-node.js

@@ -3,8 +3,8 @@ const Promise = require('bluebird')
 const path = require('path')
 const { createFilePath } = require('gatsby-source-filesystem')
 
-exports.createPages = ({ graphql, boundActionCreators }) => {
+exports.createPages = ({ graphql, actions }) => {
-  const { createPage } = boundActionCreators
+  const { createPage } = actions
 
   return new Promise((resolve, reject) => {
     const blogPost = path.resolve('./src/templates/blog-post.js')
@@ -54,8 +54,8 @@ exports.createPages = ({ graphql, boundActionCreators }) => {
   })
 }
 
-exports.onCreateNode = ({ node, boundActionCreators, getNode }) => {
+exports.onCreateNode = ({ node, actions, getNode }) => {
-  const { createNodeField } = boundActionCreators
+  const { createNodeField } = actions
 
   if (node.internal.type === `MarkdownRemark`) {
     const value = createFilePath({ node, getNode })

package.json

@@ -7,32 +7,38 @@
     "url": "https://github.com/gatsbyjs/gatsby-starter-blog/issues"
   },
   "dependencies": {
-    "gatsby": "^1.9.250",
+    "gatsby": "^2.0.0",
-    "gatsby-link": "^1.6.39",
+    "gatsby-plugin-feed": "^2.0.5",
-    "gatsby-plugin-feed": "^1.3.20",
+    "gatsby-plugin-google-analytics": "^2.0.5",
-    "gatsby-plugin-google-analytics": "^1.0.29",
+    "gatsby-plugin-manifest": "^2.0.2",
-    "gatsby-plugin-offline": "^1.0.15",
+    "gatsby-plugin-offline": "^2.0.5",
-    "gatsby-plugin-react-helmet": "^1.0.8",
+    "gatsby-plugin-react-helmet": "^3.0.0",
-    "gatsby-plugin-sharp": "^1.6.42",
+    "gatsby-plugin-sharp": "^2.0.5",
-    "gatsby-plugin-typography": "^1.7.18",
+    "gatsby-plugin-typography": "^2.2.0",
-    "gatsby-remark-copy-linked-files": "^1.5.31",
+    "gatsby-remark-copy-linked-files": "^2.0.5",
-    "gatsby-remark-images": "^1.5.61",
+    "gatsby-remark-images": "^2.0.1",
-    "gatsby-remark-prismjs": "^1.2.24",
+    "gatsby-remark-prismjs": "^3.0.0",
-    "gatsby-remark-responsive-iframe": "^1.4.18",
+    "gatsby-remark-responsive-iframe": "^2.0.5",
-    "gatsby-remark-smartypants": "^1.4.12",
+    "gatsby-remark-smartypants": "^2.0.5",
-    "gatsby-source-filesystem": "^1.5.31",
+    "gatsby-source-filesystem": "^2.0.1",
-    "gatsby-transformer-remark": "^1.7.40",
+    "gatsby-transformer-remark": "^2.1.1",
-    "gatsby-transformer-sharp": "^1.6.22",
+    "gatsby-transformer-sharp": "^2.1.1",
-    "lodash": "^4.17.5",
+    "lodash": "^4.17.11",
+    "prismjs": "^1.15.0",
+    "react": "^16.5.1",
+    "react-dom": "^16.5.1",
+    "react-helmet": "^5.2.0",
+    "react-typography": "^0.16.13",
     "typeface-merriweather": "0.0.43",
     "typeface-montserrat": "0.0.43",
+    "typography": "^0.16.17",
     "typography-theme-wordpress-2016": "^0.15.10"
   },
   "devDependencies": {
     "eslint": "^4.19.1",
-    "eslint-plugin-react": "^7.7.0",
+    "eslint-plugin-react": "^7.11.1",
-    "gh-pages": "^1.1.0",
+    "gh-pages": "^1.2.0",
-    "prettier": "^1.12.0"
+    "prettier": "^1.14.2"
   },
   "homepage": "https://github.com/gatsbyjs/gatsby-starter-blog#readme",
   "keywords": [

src/components/layout.js

@@ -1,18 +1,14 @@
 import React from 'react'
-import Link from 'gatsby-link'
+import { Link } from 'gatsby'
 
 import { rhythm, scale } from '../utils/typography'
 
 class Template extends React.Component {
   render() {
     const { location, children } = this.props
+    const rootPath = `${__PATH_PREFIX__}/`
     let header
 
-    let rootPath = `/`
-    if (typeof __PREFIX_PATHS__ !== `undefined` && __PREFIX_PATHS__) {
-      rootPath = __PATH_PREFIX__ + `/`
-    }
-
     if (location.pathname === rootPath) {
       header = (
         <h1
@@ -66,7 +62,7 @@ class Template extends React.Component {
         }}
       >
         {header}
-        {children()}
+        {children}
       </div>
     )
   }

src/pages/index.js

@@ -1,19 +1,28 @@
 import React from 'react'
-import Link from 'gatsby-link'
+import { Link, graphql } from 'gatsby'
 import get from 'lodash/get'
 import Helmet from 'react-helmet'
 
 import Bio from '../components/Bio'
+import Layout from '../components/layout'
 import { rhythm } from '../utils/typography'
 
 class BlogIndex extends React.Component {
   render() {
     const siteTitle = get(this, 'props.data.site.siteMetadata.title')
+    const siteDescription = get(
+      this,
+      'props.data.site.siteMetadata.description'
+    )
     const posts = get(this, 'props.data.allMarkdownRemark.edges')
 
     return (
-      <div>
+      <Layout location={this.props.location}>
-        <Helmet title={siteTitle} />
+        <Helmet
+          htmlAttributes={{ lang: 'en' }}
+          meta={[{ name: 'description', content: siteDescription }]}
+          title={siteTitle}
+        />
         <Bio />
         {posts.map(({ node }) => {
           const title = get(node, 'frontmatter.title') || node.fields.slug
@@ -33,7 +42,7 @@ class BlogIndex extends React.Component {
             </div>
           )
         })}
-      </div>
+      </Layout>
     )
   }
 }
@@ -41,10 +50,11 @@ class BlogIndex extends React.Component {
 export default BlogIndex
 
 export const pageQuery = graphql`
-  query IndexQuery {
+  query {
     site {
       siteMetadata {
         title
+        description
       }
     }
     allMarkdownRemark(sort: { fields: [frontmatter___date], order: DESC }) {

src/templates/blog-post.js

@@ -1,20 +1,26 @@
 import React from 'react'
 import Helmet from 'react-helmet'
-import Link from 'gatsby-link'
+import { Link,graphql } from 'gatsby'
 import get from 'lodash/get'
 
 import Bio from '../components/Bio'
+import Layout from '../components/layout'
 import { rhythm, scale } from '../utils/typography'
 
 class BlogPostTemplate extends React.Component {
   render() {
     const post = this.props.data.markdownRemark
     const siteTitle = get(this.props, 'data.site.siteMetadata.title')
-    const { previous, next } = this.props.pathContext
+    const siteDescription = post.excerpt
+    const { previous, next } = this.props.pageContext
 
     return (
-      <div>
+      <Layout location={this.props.location}>
-        <Helmet title={`${post.frontmatter.title} | ${siteTitle}`} />
+        <Helmet
+          htmlAttributes={{ lang: 'en' }}
+          meta={[{ name: 'description', content: siteDescription }]}
+          title={`${post.frontmatter.title} | ${siteTitle}`}
+        />
         <h1>{post.frontmatter.title}</h1>
         <p
           style={{
@@ -60,7 +66,7 @@ class BlogPostTemplate extends React.Component {
             }
           </li>
         </ul>
-      </div>
+      </Layout>
     )
   }
 }
@@ -77,6 +83,7 @@ export const pageQuery = graphql`
     }
     markdownRemark(fields: { slug: { eq: $slug } }) {
       id
+      excerpt
       html
       frontmatter {
         title

src/utils/typography.js

@@ -17,3 +17,5 @@ if (process.env.NODE_ENV !== 'production') {
 }
 
 export default typography
+export const rhythm = typography.rhythm
+export const scale = typography.scale