diff --git a/components/List.tsx b/components/List.tsx
index da6d5c3..cc66315 100644
--- a/components/List.tsx
+++ b/components/List.tsx
@@ -2,7 +2,7 @@ import React from "react";
 
 import { SimpleBook } from "../lib/books";
 
-export default function Detail(props: Props) {
+export default function List(props: Props) {
   return (
     <ul>
       {props.books.map((book, idx) => {
diff --git a/pages/playground.tsx b/pages/playground.tsx
index 96180e6..1d2abe8 100644
--- a/pages/playground.tsx
+++ b/pages/playground.tsx
@@ -7,7 +7,9 @@ import { DetailedBook, SimpleBook, getBook, getAllBooks } from "../lib/books";
 export default function Playground(props: Props) {
   return (
     <div>
+      <h1>Detail</h1>
       <Detail book={props.book} />
+      <h1>List</h1>
       <List books={props.books} />
     </div>
   );