Adding screenshots

package.json

@@ -3,10 +3,12 @@
   "version": "1.0.0",
   "description": "",
   "main": "index.js",
-  "engines": { "node": ">=14.15.0"},
+  "engines": {
+    "node": ">=14.15.0"
+  },
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
-    "start": "node server",
+    "start": "node server/server.js",
     "start:dev": "nodemon server"
   },
   "keywords": [],

public/index.html

@@ -14,6 +14,6 @@
   <script src="bundles/service1.js"></script>
   <script src="bundles/service2.js"></script>
   <script src="bundles/service3.js"></script>
-  <script src="bundles/service4.js"></script>
+  <script src="bundles/service4.js"></script> 
 </body>
 </html>

public/style.css

@@ -0,0 +1,57 @@
+#header {
+    width: 100%;
+}
+
+#oneTwo {
+    display: flex;
+    width: 1366px;
+    background-color: #ebeef0;
+}
+
+#containerOne {
+    display: flex;
+    justify-content: flex-start;
+    width: 70%;
+    /* position: absolute;
+    left: 0%;
+    width: 65%; */
+}
+
+#service1 {
+    display: flex;
+    justify-content: center;
+    width: 100%;
+}
+
+#containerTwo {
+    display: flex;
+    justify-content: flex-end;
+    width: 30%;
+    height: 950px;
+    position: -webkit-sticky;
+    position: sticky;
+    top: 10;
+    position: absolute;
+    right: 0%;
+}
+
+#service2 {
+    display: flex;
+    justify-content: flex-end;
+    width: 100%;
+    /* float: right; */
+    /* width: 450px;
+    height: auto; */
+}
+
+#service3 {
+    display: flex;
+    float: left;
+    width: 65%
+}
+
+#service4 {
+    display: flex;
+    float: left;
+    width: 65%
+}

server/config/services.js

@@ -42,23 +42,23 @@
 
 module.exports = {
   service1: {
-    api: 'FIX_ME',
-    url: 'http://localhost:3001',
-    bundle: 'app.js',
+    api: '/:id/photos',
+    url: 'http://18.144.83.48:3001/photos/1/',
+    bundle: '/photos/:id/bundle.js'
   },
   service2: {
-    api: 'FIX_ME',
-    url: 'http://localhost:3002',
-    bundle: 'app.js',
+    api: '/:id/checkout',
+    url: 'http://54.183.207.18:3005/',
+    bundle: '/checkout/:id/bundle.js',
   },
   service3: {
-    api: 'FIX_ME',
-    url: 'http://localhost:3003',
-    bundle: 'app.js',
+    api: '/ctl',
+    url: 'http://3.101.147.158:3003/',
+    bundle: 'bundle.js',
   },
   service4: {
-    api: 'FIX_ME',
-    url: 'http://localhost:3004',
-    bundle: 'app.js',
-  },
+    api: '/:id/reviews',
+    url: 'http://13.57.35.129:8000/',
+    bundle: '/reviews/:id/bundle.js'
+  }
 };

server/index.js

@@ -7,5 +7,5 @@ const server = require('./server.js');
 const PORT = 3000 || process.env.PORT;
 
 server.listen(PORT, () => {
-  console.log(`Server running on localhost:${PORT}`);
+  console.log(`Server running on http://localhost:${PORT}/products/1`);
 });

server/router/api.js

@@ -1,7 +1,7 @@
 const { Router } = require('express');
 const { createProxyMiddleware } = require('http-proxy-middleware');
 const {
-  service1, service2, service3, service4,
+  service1, service2, service3, service4
 } = require('../config/services.js');
 
 const router = Router();

server/router/bundles.js

@@ -1,39 +1,39 @@
 const { Router } = require('express');
 const { createProxyMiddleware } = require('http-proxy-middleware');
 const {
-  service1, service2, service3, service4,
+  service1, service2, service3, service4
 } = require('../config/services.js');
 
 const router = Router();
 
 router.use('/service1.js', createProxyMiddleware({
   target: service1.url,
   pathRewrite: {
-    '^/bundles/service1.js': service1.bundle,
+    '^.*': service1.bundle,
   },
   changeOrigin: true,
 }));
 
 router.use('/service2.js', createProxyMiddleware({
   target: service2.url,
   pathRewrite: {
-    '^/bundles/service2.js': service2.bundle,
+    '^.*': service2.bundle,
   },
   changeOrigin: true,
 }));
 
 router.use('/service3.js', createProxyMiddleware({
   target: service3.url,
   pathRewrite: {
-    '^/bundles/service3.js': service3.bundle,
+    '^.*': service3.bundle,
   },
   changeOrigin: true,
 }));
 
 router.use('/service4.js', createProxyMiddleware({
   target: service4.url,
   pathRewrite: {
-    '^/bundles/service4.js': service4.bundle,
+    '^.*': service4.bundle,
   },
   changeOrigin: true,
 }));

server/server.js

@@ -7,11 +7,12 @@ const PUBLIC_DIR = path.resolve(__dirname, '..', 'public');
 const app = express();
 
 app.use(morgan('dev'));
-app.use(express.static(PUBLIC_DIR));
+app.use('/products/:id', express.static(PUBLIC_DIR));
+// app.use('/:id', express.static(PUBLIC_DIR));
 
 // Handling asset requests for webpack bundles by passing off requests to the bundles router
-app.use('/bundles', router.bundles);
+app.use('/products/:id/bundles', router.bundles);
 // Handling AJAX requests to the API by passing off requests to the api router
-app.use('/api', router.api);
+app.use('/', router.api);
 
 module.exports = app;