astrotim

// Home.js
import React from 'react';

class Home extends React.Component {
  render() {
    return <p>Home</p>;
  }
}

export default Home;

astrotim

$ create-react-app static-react

astrotim

 import React, { Component } from 'react';
+import { BrowserRouter, Link, Switch, Route } from 'react-router-dom';
+import Home from './Home';
+import Post from './Post';
 import logo from './logo.svg';
 import './App.css';
 
 class App extends Component {
   render() {
     return (

astrotim

language: node_js
node_js:
  - "node"
cache:
  - yarn
install:
  - yarn install
script:
  - yarn build
deploy:

astrotim

   },
   "scripts": {
     "start": "react-scripts start",
     "build": "react-scripts build",
+    "postbuild": "react-snap",
     "test": "react-scripts test --env=jsdom",
     "eject": "react-scripts eject"
   }

astrotim

 import React from 'react';
-import ReactDOM from 'react-dom';
+import { hydrate, render } from 'react-dom';
 import './index.css';
 import App from './App';
-import registerServiceWorker from './registerServiceWorker';
 
-ReactDOM.render(<App />, document.getElementById('root'));
-registerServiceWorker();
+const rootElement = document.getElementById('root');

astrotim

 import React from 'react';
+import { createClient } from 'contentful';
 
 class Home extends React.Component {
+  state = {
+    posts: []
+  };
+
+  componentWillMount() {
+    const client = createClient({

astrotim

import React from 'react';
import { createClient } from 'contentful';

class Home extends React.Component {
  state = {
    posts: []
  };

  componentWillMount() {
    const client = createClient({

astrotim

 import React from 'react';
+import { Link } from 'react-router-dom';
 import { createClient } from 'contentful';
 
 class Home extends React.Component {
 
     return this.state.posts.map(post => {
       console.log(post);
-      return <p>Post</p>;
+      return (

astrotim

             <h1 className="App-title">Welcome to React</h1>
-            <Link to="/">Home</Link> <Link to="/post/">Post</Link>
           </header>
           <Switch>
             <Route exact path="/" component={Home} />
-            <Route path="/post/" component={Post} />
+            <Route path="/post/:id" component={Post} />
           </Switch>
         </div>
       </BrowserRouter>