diff --git a/.firebaserc b/.firebaserc
new file mode 100644
index 0000000..571d80e
--- /dev/null
+++ b/.firebaserc
@@ -0,0 +1,14 @@
+{
+  "projects": {
+    "default": "avm99963-labs"
+  },
+  "targets": {
+    "avm99963-labs": {
+      "hosting": {
+        "twpt-dashboard": [
+          "twpt-dashboard-frontend"
+        ]
+      }
+    }
+  }
+}
\ No newline at end of file
diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..dbb58ff
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1,66 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+firebase-debug.log*
+firebase-debug.*.log*
+
+# Firebase cache
+.firebase/
+
+# Firebase config
+
+# Uncomment this if you'd like others to create their own Firebase project.
+# For a team working on the same Firebase project(s), it is recommended to leave
+# it commented so all members can deploy to the same project(s) in .firebaserc.
+# .firebaserc
+
+# Runtime data
+pids
+*.pid
+*.seed
+*.pid.lock
+
+# Directory for instrumented libs generated by jscoverage/JSCover
+lib-cov
+
+# Coverage directory used by tools like istanbul
+coverage
+
+# nyc test coverage
+.nyc_output
+
+# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
+.grunt
+
+# Bower dependency directory (https://bower.io/)
+bower_components
+
+# node-waf configuration
+.lock-wscript
+
+# Compiled binary addons (http://nodejs.org/api/addons.html)
+build/Release
+
+# Dependency directories
+node_modules/
+
+# Optional npm cache directory
+.npm
+
+# Optional eslint cache
+.eslintcache
+
+# Optional REPL history
+.node_repl_history
+
+# Output of 'npm pack'
+*.tgz
+
+# Yarn Integrity file
+.yarn-integrity
+
+# dotenv environment variables file
+.env
diff --git a/firebase.json b/firebase.json
new file mode 100644
index 0000000..bae5b7b
--- /dev/null
+++ b/firebase.json
@@ -0,0 +1,17 @@
+{
+  "hosting": {
+    "target": "twpt-dashboard",
+    "public": "frontend/dist",
+    "ignore": [
+      "firebase.json",
+      "**/.*",
+      "**/node_modules/**"
+    ],
+    "rewrites": [
+      {
+        "source": "**",
+        "destination": "/index.html"
+      }
+    ]
+  }
+}
diff --git a/frontend/Makefile b/frontend/Makefile
index fc3d69e..b904f82 100644
--- a/frontend/Makefile
+++ b/frontend/Makefile
@@ -1,6 +1,21 @@
-.PHONY: serve
+.PHONY: serve deploy build_js
 
 WEBPACK := ./node_modules/webpack-cli/bin/cli.js
 
 serve:
 	$(WEBPACK) serve --mode development
+
+node_deps:
+	npm ci --no-save
+
+clean_deps:
+	rm -rf node_modules
+
+deps: node_deps
+	rm -rf dist
+
+build_js:
+	$(WEBPACK) --mode production
+
+deploy: deps build_js
+	firebase deploy --only hosting:twpt-dashboard
diff --git a/frontend/src/App.vue b/frontend/src/App.vue
index dc4ddc1..a2e638a 100644
--- a/frontend/src/App.vue
+++ b/frontend/src/App.vue
@@ -1,7 +1,7 @@
 <script>
 import {mapGetters} from 'vuex';
 
-import config from './config.json5';
+import config from './config.js';
 import GsiButton from './GsiButton.vue';
 
 export default {
diff --git a/frontend/src/GsiButton.vue b/frontend/src/GsiButton.vue
index 01cd924..7cb9f1d 100644
--- a/frontend/src/GsiButton.vue
+++ b/frontend/src/GsiButton.vue
@@ -1,5 +1,5 @@
 <script>
-import config from './config.json5';
+import config from './config.js';
 
 export default {
   mounted() {
diff --git a/frontend/src/config.dev.json5 b/frontend/src/config.dev.json5
new file mode 100644
index 0000000..07bff27
--- /dev/null
+++ b/frontend/src/config.dev.json5
@@ -0,0 +1,8 @@
+{
+  // Details for the Sign In with Google functionality
+  google: {
+    clientId: '223047594100-ha7istt4csc0mlq11heogk7bqvmpbqo0.apps.googleusercontent.com',
+  },
+  // URL of the GRPC host
+  grpcWebHost: 'http://localhost:8081'
+}
diff --git a/frontend/src/config.js b/frontend/src/config.js
new file mode 100644
index 0000000..7db9da0
--- /dev/null
+++ b/frontend/src/config.js
@@ -0,0 +1,5 @@
+import configDev from './config.dev.json5';
+import configProd from './config.json5';
+
+const config = PRODUCTION ? configProd : configDev;
+export default config;
diff --git a/frontend/src/config.json5 b/frontend/src/config.json5
index 07bff27..3d26583 100644
--- a/frontend/src/config.json5
+++ b/frontend/src/config.json5
@@ -4,5 +4,5 @@
     clientId: '223047594100-ha7istt4csc0mlq11heogk7bqvmpbqo0.apps.googleusercontent.com',
   },
   // URL of the GRPC host
-  grpcWebHost: 'http://localhost:8081'
+  grpcWebHost: 'https://twpt-grpc-web.avm99963.com'
 }
diff --git a/frontend/webpack.config.js b/frontend/webpack.config.js
index 7287e6c..005f361 100644
--- a/frontend/webpack.config.js
+++ b/frontend/webpack.config.js
@@ -1,3 +1,4 @@
+const webpack = require('webpack');
 const path = require('path')
 const json5 = require('json5');
 const {VueLoaderPlugin} = require('vue-loader');
@@ -47,6 +48,9 @@
         filename: 'index.html',
         template: 'index.html',
       }),
+      new webpack.DefinePlugin({
+        'PRODUCTION': args.mode == 'production',
+      }),
     ],
     devServer: {
       static: './dist',