Use Redux for internal state plus add prototype for data hot reloading …

…fixes #777 (#788)

* Use DataTree instead of Abstract Syntax Tree

The idea for how to do things was taken from compilers
but since we're not actually parsing syntax into a tree, using
AST terminology is confusing. DataTree seems like a more sensible name.

* Add a watch command for all packages and update contributing instructions

* Add trailing slash when creating script tags for prefixed sites

* Add redux, convert all globals except pages to use it

* Add more tests + convert node api signature to (args, pluginOptions) to make same as browser/ssr api signature

* Use Redux for managing data nodes + initial rough implemenation of hot reloading

* Move raw action dispatching to action creator

* Add nodes tests

* Update windows docs

* Update CONTRIBUTING.md

* Somewhat reliable draining

* Upgrade gatsbygram for PR

* Up sites to latest canary

CONTRIBUTING.md

@@ -22,17 +22,16 @@ The usual contributing steps are:
 * Install yarn, lerna, and gatsby-dev-cli globaly: `npm install -g yarn lerna gatsby-dev-cli@canary`
 * Checkout to the 1.0 branch: `git checkout 1.0`
 * Install dependencies: `yarn && lerna bootstrap`
-* Make sure tests are passing for you: `lerna run test`
+* Make sure tests are passing for you: `yarn run test`
 * Create a topic branch: `git checkout -b topics/new-feature-name`
-* Run `yarn build` or `npm run build` to do an initial build of all packages
-  and ensure there are no errors.
-* Now navigate to the package you want to modify and run `yarn run watch` to
-  watch that package's code and compile your changes on the fly as you work.
-* Use the `gatsby-dev` command to copy built files from package(s) you're
-  working on to a Gatsby site. In each site you want to work on, run
-  `gatsby-dev` and as arguments, pass a space-seperated list of packages e.g.
-  `gatsby-dev gatsby gatsby-typegen-remark`. The first time you run the command,
-  you'll also need to set the path to your cloned repository.
+* Run `yarn run watch` to do an initial build of all packages and watch for
+  changes to packages' source code and compile changes on the fly as you
+  work.
+* Use the `gatsby-dev` command to copy files from your cloned copy of Gatsby
+  to test Gatsby sites. To use, go to a site you want to work on and run
+  `gatsby-dev`. This will copy over the built version of every gatsby
+  package the site is using. Note: the first time you run the command,
+  you'll also need to set the path to clone of the Gatsby repository.
 * Add tests and code for your changes.
 * Once you‘re done, make sure all tests still pass: `yarn test`
 * Commit and push to your fork.

docs/docs/gatsby-on-windows.md

@@ -2,8 +2,17 @@
 title: Gatsby on windows
 ---
 
-## Install build environment
+## Setting up your environment for building native Node.js modules.
 
-To be able to run Gatsby and especially sharp (a dependency to have a powerful image processor), you need to have a functional build environment (Python and Visual C++ Build Tools).
+Many Gatsby plugins and themes require building native Node.js modules e.g.
+[Sharp (a common Gatsby dependency used for image
+processing)](/docs/packages/gatsby-plugin-sharp/). To do so, you need a
+functional build environment (Python and Visual C++ Build Tools).
 
-The easy way to have this build env on windows is to run `npm install --global windows-build-tools` on an admin powershell console.
+The easy way to setup your build environment on Windows is to install the
+[`windows-build-tools`](https://github.com/felixrieseberg/windows-build-tools)
+package by runnning `npm install --global windows-build-tools` on an admin
+powershell console. On installing this package, it downloads and installs the
+Visual C++ Build Tools 2015, provided free of charge by Microsoft. These tools
+are required to compile popular native modules. It will also install Python
+2.7, configuring your machine and npm appropriately.

examples/gatsbygram/gatsby-node.js

@@ -8,14 +8,15 @@ const slash = require("slash")
 // called after the Gatsby bootstrap is finished so you have
 // access to any information necessary to programatically
 // create pages.
-exports.createPages = ({ args }) =>
-  new Promise((resolve, reject) => {
+exports.createPages = ({ graphql, actionCreators }) => {
+  const { upsertPage } = actionCreators
+
+  return new Promise((resolve, reject) => {
     // The “graphql” function allows us to run arbitrary
     // queries against this Gatsbygram's graphql schema. Think of
     // it like Gatsbygram has a built-in database constructed
     // from static data that you can run queries against.
-    const { graphql } = args
-    const pages = []
+    //
     // Post is a data node type derived from data/posts.json
     // which is created when scrapping Instagram. “allPosts”
     // is a "connection" (a GraphQL convention for accessing
@@ -46,7 +47,10 @@ exports.createPages = ({ args }) =>
       // already includes an ID field, we just use that for
       // each page's path.
       _.each(result.data.allPosts.edges, edge => {
-        pages.push({
+        // Gatsby uses Redux to manage its internal state.
+        // Plugins and sites can use functions like "upsertPage"
+        // to interact with Gatsby.
+        upsertPage({
           // Each page is required to have a `path` as well
           // as a template component. The `context` is
           // optional but is often necessary so the template
@@ -58,7 +62,7 @@ exports.createPages = ({ args }) =>
           },
         })
       })
-
-      resolve(pages)
+      resolve()
     })
   })
+}

examples/gatsbygram/package.json

@@ -5,18 +5,19 @@
   "version": "1.0.0",
   "author": "Kyle Mathews <mathews.kyle@gmail.com>",
   "dependencies": {
-    "gatsby": "1.0.0-alpha12-alpha.d7d6ef64",
-    "gatsby-link": "1.0.0-alpha12-alpha.d7d6ef64",
-    "gatsby-parser-json": "1.0.0-alpha12-alpha.d7d6ef64",
-    "gatsby-parser-sharp": "1.0.0-alpha12-alpha.d7d6ef64",
-    "gatsby-plugin-glamor": "1.0.0-alpha12-alpha.d7d6ef64",
-    "gatsby-plugin-google-analytics": "^1.0.0-alpha12-alpha.d7d6ef64",
-    "gatsby-plugin-manifest": "1.0.0-alpha12-alpha.d7d6ef64",
-    "gatsby-plugin-offline": "1.0.0-alpha12-alpha.d7d6ef64",
-    "gatsby-plugin-sharp": "1.0.0-alpha12-alpha.d7d6ef64",
-    "gatsby-source-filesystem": "1.0.0-alpha12-alpha.d7d6ef64",
-    "gatsby-typegen-filesystem": "1.0.0-alpha12-alpha.d7d6ef64",
-    "gatsby-typegen-sharp": "1.0.0-alpha12-alpha.d7d6ef64",
+    "gatsby": "1.0.0-alpha12-alpha.1fdb9004",
+    "gatsby-link": "1.0.0-alpha12-alpha.1fdb9004",
+    "gatsby-parser-json": "1.0.0-alpha12-alpha.1fdb9004",
+    "gatsby-parser-sharp": "1.0.0-alpha12-alpha.1fdb9004",
+    "gatsby-plugin-glamor": "1.0.0-alpha12-alpha.1fdb9004",
+    "gatsby-plugin-google-analytics": "^1.0.0-alpha12-alpha.1fdb9004",
+    "gatsby-plugin-manifest": "1.0.0-alpha12-alpha.1fdb9004",
+    "gatsby-plugin-offline": "1.0.0-alpha12-alpha.1fdb9004",
+    "gatsby-plugin-sharp": "1.0.0-alpha12-alpha.1fdb9004",
+    "gatsby-source-filesystem": "1.0.0-alpha12-alpha.1fdb9004",
+    "gatsby-typegen-filesystem": "1.0.0-alpha12-alpha.1fdb9004",
+    "gatsby-typegen-sharp": "1.0.0-alpha12-alpha.1fdb9004",
+    "instagram-screen-scrape": "^2.0.0",
     "lodash": "^4.16.4",
     "mkdirp": "^0.5.1",
     "mousetrap": "^1.6.0",