diff --git a/app.vue b/app.vue
index 047d7e9..bc6adf8 100644
--- a/app.vue
+++ b/app.vue
@@ -1,3 +1,15 @@
+<script setup lang="ts">
+import Toast from 'primevue/toast';
+</script>
+
 <template>
-  <h1>Hello World!</h1>
+  <div class="w-full h-full flex flex-column">
+    <NavBar />
+    <main class="flex-1">
+      <NuxtPage />
+    </main>
+    <ClientOnly>
+      <Toast position="bottom-right" />
+    </ClientOnly>
+  </div>
 </template>
diff --git a/layouts/centered-content.vue b/layouts/centered-content.vue
new file mode 100644
index 0000000..93d89e9
--- /dev/null
+++ b/layouts/centered-content.vue
@@ -0,0 +1,7 @@
+<template>
+  <div
+    class="w-full h-full flex flex-column justify-content-center align-items-center text-center"
+  >
+    <slot></slot>
+  </div>
+</template>
diff --git a/pages/index.vue b/pages/index.vue
new file mode 100644
index 0000000..c1d367c
--- /dev/null
+++ b/pages/index.vue
@@ -0,0 +1,5 @@
+<template>
+  <NuxtLayout name="centered-content">
+    <div class="font-bold text-6xl">Spotify Playlist Archive</div>
+  </NuxtLayout>
+</template>