Merge pull request #6 from Justkant/develop

Fix production build

.travis.yml

@@ -1,11 +1,14 @@
 language: node_js
 
 node_js:
-  - "4.1"
-  - "4.0"
+  - "4"
 
 sudo: false
 
+cache:
+  directories:
+    - node_modules
+
 before_script:
   - export DISPLAY=:99.0
   - sh -e /etc/init.d/xvfb start

api/api.js

@@ -3,6 +3,8 @@ require('../server.babel'); // babel registration (runtime transpilation for nod
 import express from 'express';
 import bodyParser from 'body-parser';
 import config from './config';
+import users from './users';
+import products from './products';
 import PrettyError from 'pretty-error';
 import Thinky from 'thinky';
 
@@ -14,13 +16,35 @@ const app = express();
 
 app.use(bodyParser.json());
 
+app.get('/login', users.login);
+
+app.route('/users')
+  .get(users.getUsers)
+  .post(users.addUser);
+
+app.route('/users/:id')
+  .get(users.getUser)
+  .put(users.updateUser)
+  .delete(users.deleteUser);
+
+app.route('/products')
+  .get(products.getProducts)
+  .post(products.addProduct);
+
+app.route('/products/:id')
+  .get(products.getProduct)
+  .put(products.updateProduct)
+  .delete(products.deleteProduct);
+
+app.get('/search/:text', products.search);
+
 if (config.apiPort) {
   app.listen(config.apiPort, (err) => {
     if (err) {
       console.error(err);
     }
     console.info('----\n==> 🌎  API is running on port %s', config.apiPort);
-    console.info('==> 💻  Send requests to http://localhost:%s', config.apiPort);
+    console.info('==> 💻  Send requests to http://localhost:%s ', config.apiPort);
   });
 } else {
   console.error('==>     ERROR: No PORT environment variable has been specified');

api/products.js

@@ -0,0 +1,34 @@
+function getProducts(req, res) {
+
+}
+
+function getProduct(req, res) {
+
+}
+
+function addProduct(req, res) {
+
+}
+
+function updateProduct(req, res) {
+
+}
+
+function deleteProduct(req, res) {
+
+}
+
+function search(req, res) {
+
+}
+
+const products = {
+  getProducts: getProducts,
+  getProduct: getProduct,
+  addProduct: addProduct,
+  updateProduct: updateProduct,
+  deleteProduct: deleteProduct,
+  search: search
+};
+
+export default products;

api/users.js

@@ -0,0 +1,32 @@
+function login(req, res) {
+  console.log(req);
+  res.send({name: 'kant', token: 'bite'});
+}
+
+function getUsers(req, res) {
+}
+
+function getUser(req, res) {
+}
+
+function addUser(req, res) {
+  console.log(req);
+  res.send({name: 'kant', token: 'bite'});
+}
+
+function updateUser(req, res) {
+}
+
+function deleteUser(req, res) {
+}
+
+const users = {
+  login: login,
+  getUsers: getUsers,
+  getUser: getUser,
+  addUser: addUser,
+  updateUser: updateUser,
+  deleteUser: deleteUser
+};
+
+export default users;

package.json

@@ -1,7 +1,7 @@
 {
   "author": "Quentin 'Kant' Jaccarino",
   "name": "whatashop",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "description": "Online Shopping Application",
   "homepage": "https://github.com/Justkant/WhatAShop#readme",
   "license": "MIT",
@@ -28,6 +28,7 @@
     "start-prod": "node ./node_modules/better-npm-run start-prod",
     "start-prod-api": "node ./node_modules/better-npm-run start-prod-api",
     "build": "webpack --verbose --colors --display-error-details --config webpack/prod.config.js",
+    "postinstall": "webpack --display-error-details --config webpack/prod.config.js",
     "lint": "eslint -c .eslintrc src",
     "start-dev": "node ./node_modules/better-npm-run start-dev",
     "start-dev-api": "node ./node_modules/better-npm-run start-dev-api",
@@ -41,6 +42,7 @@
       "env": {
         "NODE_PATH": "./src",
         "NODE_ENV": "production",
+        "PORT": 3000,
         "APIPORT": 3030
       }
     },
@@ -89,29 +91,29 @@
     "body-parser": "1.14.1",
     "express": "4.13.3",
     "file-loader": "0.8.4",
-    "history": "1.11.1",
+    "history": "1.12.2",
     "http-proxy": "1.11.2",
-    "jsonwebtoken": "^5.0.5",
+    "jsonwebtoken": "^5.4.0",
     "lru-memoize": "1.0.0",
     "map-props": "1.0.0",
-    "multireducer": "1.0.0",
+    "multireducer": "1.0.1",
     "piping": "0.3.0",
     "pretty-error": "1.2.0",
-    "query-string": "2.4.1",
-    "react": "^0.14.0-rc1",
+    "query-string": "2.4.2",
+    "react": "^0.14.0",
     "react-document-meta": "2.0.0-rc2",
-    "react-dom": "0.14.0-rc1",
-    "react-redux": "3.0.1",
+    "react-dom": "0.14.0",
+    "react-redux": "3.1.0",
     "react-router": "1.0.0-rc1",
     "redux": "3.0.2",
-    "redux-form": "2.0.0",
+    "redux-form": "2.1.0",
     "serialize-javascript": "1.1.2",
     "serve-favicon": "2.3.0",
     "serve-static": "1.10.0",
     "superagent": "1.4.0",
     "thinky": "^2.1.8",
     "url-loader": "0.5.6",
-    "webpack-isomorphic-tools": "0.9.0"
+    "webpack-isomorphic-tools": "0.9.1"
   },
   "devDependencies": {
     "autoprefixer-stylus": "0.8.0",
@@ -125,14 +127,14 @@
     "clean-webpack-plugin": "0.1.3",
     "concurrently": "0.1.1",
     "css-loader": "0.19.0",
-    "eslint": "1.5.1",
+    "eslint": "1.6.0",
     "eslint-config-airbnb": "0.1.0",
     "eslint-loader": "1.0.0",
-    "eslint-plugin-react": "3.5.0",
-    "extract-text-webpack-plugin": "0.8.2",
+    "eslint-plugin-react": "3.5.1",
+    "extract-text-webpack-plugin": "^0.8.2",
     "json-loader": "0.5.3",
     "karma": "0.13.10",
-    "karma-chrome-launcher": "0.2.0",
+    "karma-chrome-launcher": "0.2.1",
     "karma-cli": "0.1.1",
     "karma-firefox-launcher": "0.1.6",
     "karma-mocha": "0.2.0",
@@ -141,17 +143,18 @@
     "karma-webpack": "1.7.0",
     "mocha": "2.3.3",
     "react-a11y": "0.2.6",
-    "react-addons-test-utils": "0.14.0-rc1",
+    "react-addons-test-utils": "0.14.0",
     "react-hot-loader": "1.3.0",
     "react-transform-hmr": "1.0.1",
     "redux-devtools": "2.1.5",
+    "strip-loader": "^0.1.0",
     "style-loader": "0.12.4",
     "stylus-loader": "1.3.1",
     "webpack": "1.12.2",
     "webpack-dev-middleware": "1.2.0",
-    "webpack-hot-middleware": "2.3.0"
+    "webpack-hot-middleware": "2.4.1"
   },
   "engines": {
-    "node": "4.0.0"
+    "node": "4.1.2"
   }
 }

src/client.js

@@ -4,8 +4,7 @@
 import 'babel/polyfill';
 import React from 'react';
 import ReactDOM from 'react-dom';
-import createHistory from 'history/lib/createBrowserHistory';
-import createLocation from 'history/lib/createLocation';
+import { createHistory } from 'history';
 import createStore from './redux/create';
 import ApiClient from './helpers/ApiClient';
 import universalRouter from './helpers/universalRouter';
@@ -16,7 +15,7 @@ const client = new ApiClient();
 const dest = document.getElementById('content');
 const store = createStore(client, window.__data);
 
-const location = createLocation(document.location.pathname, document.location.search);
+const location = history.createLocation(document.location.pathname, document.location.search);
 
 const render = (loc, hist, str, preload) => {
   return universalRouter(loc, hist, str, preload)
@@ -44,13 +43,12 @@ history.listenBefore((loc, callback) => {
     .then((callback));
 });
 
-render(location, history, store);
+render(location, history, store, !dest.firstChild);
 
 if (process.env.NODE_ENV !== 'production') {
   window.React = React; // enable debugger
-  const reactRoot = window.document.getElementById('content');
 
-  if (!reactRoot || !reactRoot.firstChild || !reactRoot.firstChild.attributes || !reactRoot.firstChild.attributes['data-react-checksum']) {
+  if (!dest || !dest.firstChild || !dest.firstChild.attributes || !dest.firstChild.attributes['data-react-checksum']) {
     console.error('Server-side React render was discarded. Make sure that your initial render does not contain any client-side code.');
   }
 }

src/components/Search/Search.js

@@ -1,5 +1,5 @@
 import React, {Component, PropTypes} from 'react';
-import {bindActionCreators} from 'redux';
+// import {bindActionCreators} from 'redux';
 import {connect} from 'react-redux';
 
 @connect(

src/components/__tests__/Search-test.js

@@ -1,5 +1,4 @@
 import React from 'react';
-import ReactDOM from 'react-dom';
 import {renderIntoDocument} from 'react-addons-test-utils';
 import { expect} from 'chai';
 import { Search } from 'components';

src/containers/App/App.js

@@ -1,9 +1,10 @@
 import React, { Component, PropTypes } from 'react';
-import { Link } from 'react-router';
+import DocumentMeta from 'react-document-meta';
 import { bindActionCreators } from 'redux';
 import { connect } from 'react-redux';
-import DocumentMeta from 'react-document-meta';
-import { isLoaded as isAuthLoaded, load as loadAuth, logout } from 'redux/modules/auth';
+import { isLoaded as isAuthLoaded, load as loadAuth } from 'redux/modules/auth';
+import { Market, SignupLogin } from '../index';
+import './App.styl';
 
 const title = 'WhatAShop';
 const description = 'WhatAShop, an online shopping website.';
@@ -26,20 +27,19 @@ const meta = {
 
 @connect(
     state => ({user: state.auth.user}),
-    dispatch => bindActionCreators({logout}, dispatch))
+    dispatch => bindActionCreators({loadAuth}, dispatch))
 export default class App extends Component {
   static propTypes = {
-    children: PropTypes.object.isRequired,
+    children: PropTypes.object,
     user: PropTypes.object,
-    logout: PropTypes.func.isRequired,
     history: PropTypes.object
   };
 
   static contextTypes = {
     store: PropTypes.object.isRequired
   };
 
-  componentWillReceiveProps(nextProps) {
+  /* componentWillReceiveProps(nextProps) {
     if (!this.props.user && nextProps.user) {
       // login
       this.props.history.pushState(null, '/');
@@ -50,7 +50,7 @@ export default class App extends Component {
       // console.log(this.props.user);
       // console.log(nextProps.user);
     }
-  }
+  } */
 
   static fetchData(store) {
     const promises = [];
@@ -60,53 +60,13 @@ export default class App extends Component {
     return Promise.all(promises);
   }
 
-  handleLogout(event) {
-    event.preventDefault();
-    this.props.logout();
-  }
-
   render() {
     const {user} = this.props;
-    const styles = require('./App.styl');
     return (
-      <div className={styles.app}>
+      <div>
         <DocumentMeta {...meta}/>
-        <nav className="navbar navbar-default navbar-fixed-top">
-          <div className="container">
-            <Link to="/" className="navbar-brand">
-              <div className={styles.brand}/>
-              React Redux Example
-            </Link>
-
-            <ul className="nav navbar-nav">
-              {user && <li><Link to="/chat">Chat</Link></li>}
-
-              <li><Link to="/widgets">Widgets</Link></li>
-              <li><Link to="/survey">Survey</Link></li>
-              <li><Link to="/about">About Us</Link></li>
-              {!user && <li><Link to="/login">Login</Link></li>}
-              {user && <li className="logout-link"><a href="/logout" onClick={this.handleLogout.bind(this)}>Logout</a></li>}
-            </ul>
-            {user &&
-            <p className={styles.loggedInMessage + ' navbar-text'}>Logged in as <strong>{user.name}</strong>.</p>}
-            <ul className="nav navbar-nav navbar-right">
-              <li>
-                <a href="https://github.com/erikras/react-redux-universal-hot-example"
-                   target="_blank" title="View on Github"><i className="fa fa-github"/></a>
-              </li>
-            </ul>
-          </div>
-        </nav>
-        <div className={styles.appContent}>
-          {this.props.children}
-        </div>
-
-        <div className="well text-center">
-          Have questions? Ask for help <a
-          href="https://github.com/erikras/react-redux-universal-hot-example/issues"
-          target="_blank">on Github</a> or in the <a
-          href="http://www.reactiflux.com/" target="_blank">#react-redux-universal</a> Slack channel.
-        </div>
+        {!user && <SignupLogin/>}
+        {user && <Market children={this.props.children}/>}
       </div>
     );
   }