diff --git a/package-lock.json b/package-lock.json
index 08149ac..16d906d 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -26,6 +26,7 @@
         "@nuxtjs/eslint-module": "^3.0.2",
         "@nuxtjs/stylelint-module": "^4.1.0",
         "@nuxtjs/tailwindcss": "^4.2.1",
+        "@types/gapi.youtube": "^3.0.35",
         "@vue/test-utils": "^1.3.0",
         "babel-core": "7.0.0-bridge.0",
         "babel-jest": "^27.4.4",
@@ -4809,6 +4810,15 @@
         "@types/gapi": "*"
       }
     },
+    "node_modules/@types/gapi.youtube": {
+      "version": "3.0.35",
+      "resolved": "https://registry.npmjs.org/@types/gapi.youtube/-/gapi.youtube-3.0.35.tgz",
+      "integrity": "sha512-U17CuGgwn+EiA5EWRFN3IST1s69TIDeUmvilwKmWUqoVBSfKju2bWJcaSQbxEyC05b/9F15zAd41pkfOCmhUWA==",
+      "dev": true,
+      "dependencies": {
+        "@types/gapi": "*"
+      }
+    },
     "node_modules/@types/graceful-fs": {
       "version": "4.1.5",
       "resolved": "https://registry.npmjs.org/@types/graceful-fs/-/graceful-fs-4.1.5.tgz",
@@ -30338,6 +30348,15 @@
         "@types/gapi": "*"
       }
     },
+    "@types/gapi.youtube": {
+      "version": "3.0.35",
+      "resolved": "https://registry.npmjs.org/@types/gapi.youtube/-/gapi.youtube-3.0.35.tgz",
+      "integrity": "sha512-U17CuGgwn+EiA5EWRFN3IST1s69TIDeUmvilwKmWUqoVBSfKju2bWJcaSQbxEyC05b/9F15zAd41pkfOCmhUWA==",
+      "dev": true,
+      "requires": {
+        "@types/gapi": "*"
+      }
+    },
     "@types/graceful-fs": {
       "version": "4.1.5",
       "resolved": "https://registry.npmjs.org/@types/graceful-fs/-/graceful-fs-4.1.5.tgz",
diff --git a/package.json b/package.json
index 0228cdb..8e043ce 100644
--- a/package.json
+++ b/package.json
@@ -39,6 +39,7 @@
     "@nuxtjs/eslint-module": "^3.0.2",
     "@nuxtjs/stylelint-module": "^4.1.0",
     "@nuxtjs/tailwindcss": "^4.2.1",
+    "@types/gapi.youtube": "^3.0.35",
     "@vue/test-utils": "^1.3.0",
     "babel-core": "7.0.0-bridge.0",
     "babel-jest": "^27.4.4",
diff --git a/pages/index.vue b/pages/index.vue
index 5719ae7..69605cc 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -17,17 +17,22 @@
 
 <script lang="ts">
 import Vue from 'vue'
+import { GoogleApiYouTubeActivityResource } from '@types/gapi.youtube'
 
 export default Vue.extend({
   name: 'IndexPage',
 
-  data: () => ({
-    hasError: false,
-    videos: [],
-  }),
+  data(): {
+    hasError: boolean
+    videos: GoogleApiYouTubeActivityResource[]
+  } {
+    return {
+      hasError: false,
+      videos: [],
+    }
+  },
 
   async fetch() {
-    /* this.videos = await fetch(`GET https://www.googleapis.com/youtube/v3/playlistItems?part=snippet%2CcontentDetails&maxResults=50&playlistId=${process.env.YOUTUBE_UPLOADS_PLAYLIST_ID}&key=${process.env.YOUTUBE_API_KEY}`) */
     try {
       const response = await fetch(
         `https://www.googleapis.com/youtube/v3/playlistItems?part=snippet%2CcontentDetails&maxResults=50&playlistId=${process.env.YOUTUBE_UPLOADS_PLAYLIST_ID}&key=${process.env.YOUTUBE_API_KEY}`