Staging all basic files.

.gitignore

@@ -4,13 +4,15 @@
 /node_modules
 /.pnp
 .pnp.js
-
+client/node_modules
+client/.pnp
+client.pnp.js
 # testing
 /coverage
-
+client/coverage
 # production
 /build
-
+client/build
 # misc
 .DS_Store
 .env.local

client/package.json

@@ -0,0 +1,34 @@
+{
+  "name": "bodyshop",
+  "version": "0.1.0",
+  "private": true,
+  "dependencies": {
+    "@material-ui/core": "^4.7.1",
+    "dotenv": "^8.2.0",
+    "react": "^16.12.0",
+    "react-dom": "^16.12.0",
+    "react-scripts": "3.2.0",
+    "typeface-roboto": "^0.0.75"
+  },
+  "scripts": {
+    "start": "react-scripts start",
+    "build": "react-scripts build",
+    "test": "react-scripts test",
+    "eject": "react-scripts eject"
+  },
+  "eslintConfig": {
+    "extends": "react-app"
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  }
+}

client/public/index.html

@@ -10,6 +10,10 @@
       content="Web site created using create-react-app"
     />
     <link rel="apple-touch-icon" href="logo192.png" />
+
+    <!-- Roboto Font for Material Design UI -->
+    <!-- <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap" /> -->
+
     <!--
       manifest.json provides metadata used when your web app is installed on a
       user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/

client/src/App.js

@@ -2,8 +2,10 @@ import React from 'react';
 import logo from './logo.svg';
 import './App.css';
 
+import 'typeface-roboto';
+
 function App() {
-  return (
+  return (~
     <div className="App">
       <header className="App-header">
         <img src={logo} className="App-logo" alt="logo" />

client/src/index.js

@@ -9,4 +9,4 @@ ReactDOM.render(<App />, document.getElementById('root'));
 // If you want your app to work offline and load faster, you can change
 // unregister() to register() below. Note this comes with some pitfalls.
 // Learn more about service workers: https://bit.ly/CRA-PWA
-serviceWorker.unregister();
+serviceWorker.register();

package.json

@@ -1,31 +1,27 @@
 {
-  "name": "bodyshop",
+  "name": "bodyshop-server",
-  "version": "0.1.0",
+  "version": "0.0.1",
-  "private": true,
+  "engines": {
-  "dependencies": {
+    "node": "12.13.1",
-    "react": "^16.12.0",
+    "npm": "6.11.3"
-    "react-dom": "^16.12.0",
-    "react-scripts": "3.2.0"
   },
   "scripts": {
-    "start": "react-scripts start",
+    "client": "cd client && yarn start",
-    "build": "react-scripts build",
+    "server": "nodemon server.js",
-    "test": "react-scripts test",
+    "build": "cd client && npm run build",
-    "eject": "react-scripts eject"
+    "dev": "concurrently --kill-others-on-fail \"yarn server\" \"yarn client\"",
+    "start": "node server.js",
+    "heroku-postbuild": "cd client && npm install && npm install --only=dev --no-shrinkwrap && npm run build"
   },
-  "eslintConfig": {
+  "dependencies": {
-    "extends": "react-app"
+    "body-parser": "^1.18.3",
+    "compression": "1.7.4",
+    "cors": "2.8.5",
+    "dotenv": "7.0.0",
+    "express": "^4.16.4",
+    "express-sslify": "^1.2.0"
   },
-  "browserslist": {
+  "devDependencies": {
-    "production": [
+    "concurrently": "^4.0.1"
-      ">0.2%",
-      "not dead",
-      "not op_mini all"
-    ],
-    "development": [
-      "last 1 chrome version",
-      "last 1 firefox version",
-      "last 1 safari version"
-    ]
   }
 }

server.js

@@ -0,0 +1,31 @@
+const express = require('express');
+const cors = require('cors');
+const bodyParser = require('body-parser');
+const path = require('path');
+var enforce = require('express-sslify');
+if (process.env.NODE_ENV !== 'production') require('dotenv').config();
+
+const app = express();
+const port = process.env.PORT || 5000;
+
+app.use(bodyParser.json());
+app.use(bodyParser.urlencoded({ extended: true }));
+app.use(enforce.HTTPS({ trustProtoHeader: true }));
+app.use(cors());
+
+if (process.env.NODE_ENV === 'production') {
+  app.use(express.static(path.join(__dirname, 'client/build')));
+
+  app.get('/service-worker.js', (req, res) => {
+    res.sendFile(path.resolve(__dirname, '..', 'build', 'service-worker.js'));
+  });
+
+  app.get('*', function(req, res) {
+    res.sendFile(path.join(__dirname, 'client/build', 'index.html'));
+  });
+}
+
+app.listen(port, error => {
+  if (error) throw error;
+  console.log('Server running on port ' + port);
+});