La in dapper, och routing. fixade upp lite exempelsidor

Frontend/src/App.tsx

@@ -1,32 +1,54 @@
+import { Router, Route } from "@solidjs/router";
 import type { Component } from "solid-js";
-import { createSignal, For, onMount } from "solid-js";
-import CalibreService from "./services/calibreservice";
-import { book } from "./types/calibretypes";
-import BookCard from "./components/BookCard";
+import Home from "./components/Home";
+import BookList from "./components/BookList";
+import AuthorList from "./components/AuthorList";
 
 const App: Component = () => {
-	const [books, setBooks] = createSignal<book[]>([]);
-	onMount(() => {
-		CalibreService.getBooks().then(setBooks);
-	});
 	return (
 		<div>
 			<header>
-				<p>
-					Edit <code>src/App.tsx</code> and save to reload.
-				</p>
-				<a
-					href="https://github.com/solidjs/solid"
-					target="_blank"
-					rel="noopener noreferrer"
-				>
-					Learn Solid
-				</a>
+				<nav class="navbar navbar-expand-lg bg-body-tertiary">
+					<div class="container">
+						<a class="navbar-brand" href="#">
+							Navbar
+						</a>
+						<button
+							class="navbar-toggler"
+							type="button"
+							data-bs-toggle="collapse"
+							data-bs-target="#navbarNavAltMarkup"
+							aria-controls="navbarNavAltMarkup"
+							aria-expanded="false"
+							aria-label="Toggle navigation"
+						>
+							<span class="navbar-toggler-icon"></span>
+						</button>
+						<div class="collapse navbar-collapse" id="navbarNavAltMarkup">
+							<div class="navbar-nav">
+								<a class="nav-link active" href="/">
+									Home
+								</a>
+								<a class="nav-link" href="/books">
+									Books
+								</a>
+								<a class="nav-link" href="/authors">
+									Authors
+								</a>
+							</div>
+						</div>
+					</div>
+				</nav>
 			</header>
 
-			<div class="book-grid d-flex flex-wrap justify-content-between gap-3 p-3">
-				<For each={books()}>{(item) => <BookCard book={item} />}</For>
-			</div>
+			<main class="container">
+				<Router>
+					<Route path="/books/author/:authorid" component={BookList} />
+					<Route path="/books" component={BookList} />
+					<Route path="/authors" component={AuthorList} />
+					<Route path="/" component={Home} />
+				</Router>
+			</main>
 		</div>
 	);
 };