diff --git a/pages/story/[id]/chapters.vue b/pages/story/[id]/chapters.vue
new file mode 100644
index 0000000..daaa440
--- /dev/null
+++ b/pages/story/[id]/chapters.vue
@@ -0,0 +1,31 @@
+<script lang="ts" setup>
+	import { storyMiddleware } from "~/lib/client/middleware";
+	import { IStory } from "~/models/stories";
+
+	definePageMeta({
+		middleware: [storyMiddleware],
+	});
+	const rtr = useRoute();
+	const { data: story, error } = await useApiFetch<IStory>(
+		`/story/${rtr.params.id}`,
+	);
+</script>
+
+<template>
+	<a-list :data-source="story.chapters">
+		<template #renderItem="{ item, index }">
+			<a-list-item>
+				<a-list-item-meta>
+					<template #title>
+						<b>
+							<nuxt-link :to="`/story/${story._id}/${index + 1}`">
+								{{ item.title || "Untitled" }}
+							</nuxt-link>
+						</b>
+					</template>
+				</a-list-item-meta>
+				<div v-html="item.summary"></div>
+			</a-list-item>
+		</template>
+	</a-list>
+</template>