diff --git a/frontend/src/app/album/page.tsx b/frontend/src/app/album/page.tsx
index be15206..5d141f7 100644
--- a/frontend/src/app/album/page.tsx
+++ b/frontend/src/app/album/page.tsx
@@ -1,6 +1,7 @@
-'use client'
+'use client';
 
-import { useState, useEffect } from 'react'
+import { useState, useEffect } from 'react';
+import Link from 'next/link';
 import { Album } from '@/common/album.entity';
 
 export default function Page() {
@@ -20,7 +21,13 @@ export default function Page() {
   return (
     <ul>
       {albums.map((album: Album) => (
-        <li key={album.id}><a href="">{album.title}</a> by {album.artist} ({album.genre})</li>
+        <li key={album.id}>
+          <Link
+            href={{
+              pathname: `/album/${album.id}`
+            }}
+          >{album.title}
+          </Link> by {album.artist} ({album.genre})</li>
       ))}
     </ul>
   );