add unique titles to docs, tutorial, blog (gatsbyjs#3550)

Author: Ben Forshey

www/src/pages/blog/index.js

@@ -1,4 +1,6 @@
 import React from "react"
+import Helmet from "react-helmet"
+
 import Container from "../../components/container"
 import BlogPostPreviewItem from "../../components/blog-post-preview-item"
 
@@ -19,6 +21,9 @@ class BlogPostsIndex extends React.Component {
           },
         }}
       >
+        <Helmet>
+          <title>Blog</title>
+        </Helmet>
         <Container
           css={{
             [presets.Tablet]: {
@@ -67,11 +72,11 @@ class BlogPostsIndex extends React.Component {
                   marginRight: rhythm(-options.blockMarginBottom * 2),
                   transition: `transform ${presets.animation.speedDefault} ${
                     presets.animation.curveDefault
-                  },  box-shadow ${presets.animation.speedDefault} ${
+                    },  box-shadow ${presets.animation.speedDefault} ${
                     presets.animation.curveDefault
-                  }, padding ${presets.animation.speedDefault} ${
+                    }, padding ${presets.animation.speedDefault} ${
                     presets.animation.curveDefault
-                  }`,
+                    }`,
                   "&:hover": {
                     transform: `translateY(-4px)`,
                     boxShadow: `0 10px 42px rgba(25, 17, 34, 0.1)`,

www/src/pages/docs/bound-action-creators.js

@@ -1,4 +1,5 @@
 import React from "react"
+import Helmet from "react-helmet"
 
 import Functions from "../../components/function-list"
 import { rhythm, scale } from "../../utils/typography"
@@ -8,6 +9,9 @@ class ActionCreatorsDocs extends React.Component {
   render() {
     return (
       <Container>
+        <Helmet>
+          <title>Bound Action Creators</title>
+        </Helmet>
         <h1 css={{ marginTop: 0 }}>Bound Action Creators</h1>
         <p>
           Gatsby uses

www/src/pages/docs/browser-apis.js

@@ -1,4 +1,5 @@
 import React from "react"
+import Helmet from "react-helmet"
 
 import Functions from "../../components/function-list"
 import { rhythm, scale } from "../../utils/typography"
@@ -8,6 +9,9 @@ class BrowserAPIDocs extends React.Component {
   render() {
     return (
       <Container>
+        <Helmet>
+          <title>Browser APIs</title>
+        </Helmet>
         <h1 css={{ marginTop: 0 }}>Gatsby Browser APIs</h1>
         <h2 css={{ marginBottom: rhythm(1 / 2) }}>Usage</h2>
         <p css={{ marginBottom: rhythm(1) }}>

www/src/pages/docs/index.js

@@ -1,5 +1,6 @@
 import React from "react"
 import Link from "gatsby-link"
+import Helmet from "react-helmet"
 
 import SidebarBody from "../../components/sidebar-body"
 import docsSidebar from "./doc-links.yaml"
@@ -10,6 +11,9 @@ class IndexRoute extends React.Component {
   render() {
     return (
       <Container>
+        <Helmet>
+          <title>Docs</title>
+        </Helmet>
         <h1 css={{ marginTop: 0 }}>Get started</h1>
         <p>Gatsby is a blazing-fast static site generator for React.</p>
         <h2>Install Gatsby{`'`}s command line tool</h2>

www/src/pages/docs/node-apis.js

@@ -1,4 +1,5 @@
 import React from "react"
+import Helmet from "react-helmet"
 
 import Functions from "../../components/function-list"
 import { rhythm, scale } from "../../utils/typography"
@@ -8,6 +9,9 @@ class NodeAPIDocs extends React.Component {
   render() {
     return (
       <Container>
+        <Helmet>
+          <title>Node APIs</title>
+        </Helmet>
         <h1 css={{ marginTop: 0 }}>Gatsby Node APIs</h1>
         <p>
           Gatsby gives plugins and site builders many APIs for controlling your

www/src/pages/docs/ssr-apis.js

@@ -1,4 +1,5 @@
 import React from "react"
+import Helmet from "react-helmet"
 
 import Functions from "../../components/function-list"
 import { rhythm, scale } from "../../utils/typography"
@@ -8,6 +9,9 @@ class SSRAPIs extends React.Component {
   render() {
     return (
       <Container>
+        <Helmet>
+          <title>SSR APIs</title>
+        </Helmet>
         <h1 css={{ marginTop: 0 }}>Gatsby Server Rendering APIs</h1>
         <h2 css={{ marginBottom: rhythm(1 / 2) }}>Usage</h2>
         <p css={{ marginBottom: rhythm(1) }}>

www/src/pages/features.js

@@ -1,4 +1,6 @@
 import React, { Component } from "react"
+import Helmet from "react-helmet"
+
 import EvaluationTable from "../components/evaluation-table"
 import EvaluationCell from "../components/evaluation-cell"
 import FuturaParagraph from "../components/futura-paragraph"
@@ -67,6 +69,9 @@ const LegendTable = () => {
 
   return (
     <div>
+      <Helmet>
+        <title>Features</title>
+      </Helmet>
       <div
         css={{
           border: `1px solid ${legendBorderColor}`,
@@ -151,7 +156,7 @@ const FeaturesHeader = () => (
   </div>
 )
 
-const getFeaturesData = function(data) {
+const getFeaturesData = function (data) {
   const sections = (data || [])
     .map((row, i) => (row.node.Category ? i : -1))
     .filter(rowNum => rowNum !== -1)

www/src/pages/tutorial.js

@@ -1,9 +1,14 @@
 import React from "react"
+import Helmet from "react-helmet"
 import Link from "gatsby-link"
+
 import Container from "../components/container"
 
 export default () => (
   <Container>
+    <Helmet>
+      <title>Tutorial</title>
+    </Helmet>
     <h1 css={{ marginTop: 0 }}>Gatsby.js Tutorial</h1>
     <p>
       Hi! We’re so happy you decided to try using Gatsby. This tutorial has (or