deployed

Author: nil1729

README.md

@@ -22,6 +22,10 @@ Simple Projects done by me while learning `Vue JS`.
 
 ---
 
+#### Task 4 ( Simple MEVN Stack Application )
+
+- This site is deployed to `Heroku` and see demo [here](https://mevn-noob-1.herokuapp.com/)
+
 ### Setup on Local Enviroment
 
 ```

vue-noob-4/.gitignore

@@ -2,7 +2,12 @@ node_modules
 .env
 .DS_Store
 node_modules
-/dist
+
+# For Github Files only
+dist
+public
+# For Server Files only
+# client
 
 # local env files
 .env.local

vue-noob-4/client/.gitignore

@@ -0,0 +1 @@
+node_modules

vue-noob-4/client/src/components/pages/Home.vue

@@ -29,15 +29,15 @@
           <td>{{ customer.lastName }}</td>
           <td>{{ customer.email }}</td>
           <td>
-            <router-link class="btn btn-secondary" :to="`/view/${customer._id}`">View</router-link>
+            <router-link class="btn btn-sm btn-secondary" :to="`/view/${customer._id}`">View</router-link>
           </td>
         </tr>
         <tr v-else v-for="customer in customers" :key="customer._id">
           <td>{{ customer.firstName }}</td>
           <td>{{ customer.lastName }}</td>
           <td>{{ customer.email }}</td>
           <td>
-            <router-link class="btn btn-secondary" :to="`/view/${customer._id}`">View</router-link>
+            <router-link class="btn btn-sm btn-secondary" :to="`/view/${customer._id}`">View</router-link>
           </td>
         </tr>
       </tbody>

vue-noob-4/client/src/components/pages/View.vue

@@ -6,10 +6,10 @@
       <div class="mt-3 d-flex align-items-center">
         <h1 class="text-dark">{{ customer.firstName }} {{ customer.lastName }}</h1>
         <div class="ml-auto">
-          <router-link :to="`/edit/${$route.params.id}`" class="btn btn-info">Edit</router-link>
+          <router-link :to="`/edit/${$route.params.id}`" class="btn btn-sm btn-info">Edit</router-link>
           <button
             @click="handleDelete"
-            class="btn btn-danger ml-2"
+            class="btn btn-sm btn-danger ml-2"
           >{{ dltBtnClicked ? 'Loading ...' : 'Delete' }}</button>
         </div>
       </div>

vue-noob-4/client/src/store.js

@@ -12,11 +12,7 @@ const sendRequest = async body => {
 		body,
 		redirect: 'follow',
 	};
-	let uri = ``;
-	if (process.env.NODE_ENV !== 'production') {
-		uri += 'http://localhost:5000';
-	}
-	const res = await fetch(`${uri}/api_v1_graphql`, requestOptions);
+	const res = await fetch(`/api_v1_graphql`, requestOptions);
 	const JSONData = await res.json();
 	return JSONData;
 };

vue-noob-4/client/vue.config.js

@@ -0,0 +1,11 @@
+const path = require('path');
+module.exports = {
+	outputDir: path.resolve(__dirname, '../public'),
+	devServer: {
+		proxy: {
+			'/api': {
+				target: 'http://localhost:5000',
+			},
+		},
+	},
+};

vue-noob-4/server.js

@@ -24,6 +24,13 @@ app.use(
 	})
 );
 
+if (process.env.NODE_ENV === 'production') {
+	app.use(express.static(__dirname + '/public/'));
+	app.get('*', async (req, res) => {
+		res.sendFile(__dirname + '/public/index.html');
+	});
+}
+
 const PORT = process.env.PORT || 5000;
 app.listen(PORT, () => {
 	console.log(`Server started on port ${PORT}`);

vue-noob-vuex/.firebase/hosting.ZGlzdA.cache

@@ -1 +1,7 @@
-index.html,1595749628301,5226a91c0d587d02b7bbbffbc8d760d13b6590e62465433807861f852828fbef
+index.html,1595750017323,25381bc049ec413bb4eb56cf59a17d55934d4e4c3dc269a3108b96a5cb987500
+css/app.0f7e6187.css,1595750017317,3ceca3b8b205f6ababfb9268fc961776e91171d4fd17747e92f9f409d085a638
+favicon.ico,1595750017317,d5451f0f0f0bcbcd433bbdf4f6e7e5d89d8ecce2650649e969ccb5e5cd499ab2
+js/app.3d5bd6a5.js,1595750017323,d1229d7f6eddcdd23a836c82b0efd8c21902398fa6bce15d369c4e045d62b021
+js/app.3d5bd6a5.js.map,1595750017324,7bb9c357f9f7bcd0543b1979abe9af9d8b5eeaf9954eee1025cbd5d62bfd68d5
+js/chunk-vendors.ebfffe87.js,1595750017323,6c8ec3b0ba77073ba2de23e15816bd89863f986753d68dc73d2600cc67a110e8
+js/chunk-vendors.ebfffe87.js.map,1595750017324,f16a7214782c49f3563ece6aa13867869e8b6dae32c8a88defc27ba10147062d