diff --git a/components/Film/Film.spec.js b/components/Film/Film.spec.js
index 51046f6..71aa0d2 100644
--- a/components/Film/Film.spec.js
+++ b/components/Film/Film.spec.js
@@ -24,7 +24,7 @@ describe("Film", () => {
     });
 
     expect(wrapper.findComponent(RouterLinkStub).props().to).toBe(
-      `/film/${mockFilms[0].id}`
+      `/films/${mockFilms[0].id}`
     );
   });
 });
diff --git a/components/Film/index.vue b/components/Film/index.vue
index 2ff90ee..8818ad9 100644
--- a/components/Film/index.vue
+++ b/components/Film/index.vue
@@ -28,7 +28,7 @@
       </p>
       <router-link
         class="rounded font-semibold bg-gray-400 py-2 px-4 border-b-4 border-gray-500"
-        :to="`/film/${film.id}`"
+        :to="`/films/${film.id}`"
         tag="button"
       >
         Read more
diff --git a/pages/films/_id.vue b/pages/films/_id.vue
new file mode 100644
index 0000000..58d8af4
--- /dev/null
+++ b/pages/films/_id.vue
@@ -0,0 +1,28 @@
+<template>
+  <div>
+    {{ film }}
+  </div>
+</template>
+
+<script>
+export default {
+  name: "Film",
+  head: {
+    titleTemplate: "%s - Film"
+  },
+  validate({ params }) {
+    return /([\w]{8}-[\w]{4}-[\w]{4}-[\w]{4}-[\w]{12})/.test(params.id);
+  },
+  async asyncData({ $axios, params }) {
+    const film = await $axios.$get(`/api/films/${params.id}`);
+    return { film };
+  },
+  data() {
+    return {
+      film: {}
+    };
+  }
+};
+</script>
+
+<style></style>