diff --git a/frontend/src/GsiButton.vue b/frontend/src/GsiButton.vue
new file mode 100644
index 0000000..01cd924
--- /dev/null
+++ b/frontend/src/GsiButton.vue
@@ -0,0 +1,31 @@
+<script>
+import config from './config.json5';
+
+export default {
+  mounted() {
+    if (document.readyState == 'complete')
+      this.init();
+    else
+      window.addEventListener('load', () => this.init());
+  },
+  methods: {
+    init() {
+      window.google.accounts.id.initialize({
+        client_id: config.google.clientId,
+        callback: this.onSignIn,
+      });
+      window.google.accounts.id.renderButton(document.getElementById('gsi-button'), {
+        theme: 'outline',
+        size: 'large',
+      });
+    },
+    onSignIn(response) {
+      this.$emit('on-signin', response);
+    },
+  },
+};
+</script>
+
+<template>
+  <div id="gsi-button"></div>
+</template>