diff --git a/src/App.vue b/src/App.vue
index 5db9bba..8cae621 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,12 +1,16 @@
 <script setup lang="ts">
+	import Summary from './components/summary.vue'
+	import MinsLeftToPracticeToday from './components/mins_left_to_practice_today.vue'
 </script>
 
 <template>
-  <header>
-	<h1>Practice Tracker</h1>
-  </header>
-  <main>
-  </main>
+	<header>
+		<h1>Practice Tracker</h1>
+	</header>
+	<main>
+		<Summary/>
+		<MinsLeftToPracticeToday/>
+	</main>
 </template>
 
 <style scoped>
diff --git a/src/components/mins_left_to_practice_today.vue b/src/components/mins_left_to_practice_today.vue
new file mode 100644
index 0000000..cc25c2e
--- /dev/null
+++ b/src/components/mins_left_to_practice_today.vue
@@ -0,0 +1,9 @@
+<script setup lang="ts">
+</script>
+
+<template>
+	<h2>Mins Left to Practice Today</h2>
+</template>
+
+<style scoped>
+</style>
diff --git a/src/components/summary.vue b/src/components/summary.vue
new file mode 100644
index 0000000..c4a2300
--- /dev/null
+++ b/src/components/summary.vue
@@ -0,0 +1,9 @@
+<script setup lang="ts">
+</script>
+
+<template>
+	<h2>Summary</h2>
+</template>
+
+<style scoped>
+</style>