Merge branch 'master' of https://github.com/ctrlplusb/react-async-bootstrapper

Author: ctrlplusb

README.md

@@ -14,7 +14,65 @@ Provides the ability to execute async bootstrapper functions within your React e
 
 ## Introduction
 
-> Coming Soon
+This library is an abstraction of [`react-tree-walker`](https://github/ctrlplusb/react-tree-walker), that allows you to attach an `asyncBootstrap` member to your React components.
+
+Within the `asyncBootstrap` you can do any work/bootstrapping that you like and then return a `Promise` that should resolve to either `true` (which indicates back to the bootstrapping process that it should continue down the current branch of your application in order to locate and resolve any nested `asyncBootstrap` instances), or `false` (which indicates that traversal of the current branch of your application can stop).
+
+## Naive Example
+
+```jsx
+import asyncBootstrapper from 'react-async-bootstrapper'
+
+// Don't do this, do a proper imp
+const globalStateManager = {
+  products: {},
+}
+
+class Product extends Component {
+  // 👇
+  asyncBootstrap() {
+    if (globalStateManager.products[this.props.productId]) {
+      // Already have data, just return true to allow nested 
+      // asyncBootstrap instances to be located/resolved
+      return true
+    }
+  
+    // Fetch our product and load up our state
+    return fetch(`/api/products/${this.props.productId}`)
+      .then((response) => {
+        // store in our global state
+        globalStateManager.products[this.props.productId] = response.json()
+        // Indicates our desire to allow for nested asyncBootstrap instances
+        // to be located/resolved
+        return true
+      })
+  }
+
+  render() {
+    const product = globalStateManager.products[this.props.productId]
+    return (
+      <div>
+         {product.name} - {product.price}
+      </div>
+    )
+  }
+}
+
+const app = (
+  <div>
+    <h1>My favourite product</h1>
+    <Product productId={1337} />
+  </div>
+)
+
+// Now for the bootstrapping/rendering process (on a client/server)
+asyncBootstrapper(app).then(() => {
+  // bootstrapping complete
+  ReactDOM.render(app, document.getElementById('app'))
+})
+```
+
+Zing.  You can do anything you like.  And interplay with other libaries that support `react-async-bootstrapper`, such as [`react-async-component`](https://github/ctrlplusb/react-async-component) which provides code splitting support.
 
 ## FAQs