diff --git a/client/src/App.tsx b/client/src/App.tsx
index 9e704ea..25cc53c 100644
--- a/client/src/App.tsx
+++ b/client/src/App.tsx
@@ -1,10 +1,8 @@
 import { BrowserRouter, Routes, Route } from "react-router";
 import AppShell from "./components/AppShell/AppShell";
+import { BrowsePage } from "./pages/BrowsePage";
 
 /* ---------- Temporary placeholder pages (delete when the real ones exist) ---------- */
-function BrowsePlaceholder() {
-return <h1>Browse page</h1>;
-}
 function ShelfPlaceholder() {
   return <h1>My shelf page</h1>;
 }
@@ -18,7 +16,7 @@ export default function App() {
     <BrowserRouter>
       <Routes>
         <Route element={<AppShell />}>
-          <Route index element={<BrowsePlaceholder />} />
+          <Route index element={<BrowsePage />} />
           <Route path="shelf" element={<ShelfPlaceholder />} />
           <Route path="book/:id" element={<DetailPlaceholder />} />
         </Route>
diff --git a/client/src/data/mockBooks.ts b/client/src/data/mockBooks.ts
new file mode 100644
index 0000000..d1d408d
--- /dev/null
+++ b/client/src/data/mockBooks.ts
@@ -0,0 +1,11 @@
+import type {Book} from '../types/book';
+import booksJson from '../../../server/test-data/books.json';
+
+export type ShelfEntry = {bookId: Book['id']; rating?: number};
+
+export const mockBooks: Book[] = booksJson.map(({googleBooksId, ...rest}) => ({
+    id: googleBooksId,
+    ...rest,
+}));
+
+export const mockShelfEntries: ShelfEntry[] = [];
\ No newline at end of file