wire up pages

frontend/src/app/patterns/page.tsx

@@ -0,0 +1,38 @@
+import { getPatterns } from "@/lib/api";
+import Link from "next/link";
+
+export default async function PatternsPage() {
+  const { items: patterns } = await getPatterns();
+
+  return (
+    <div className="space-y-6">
+      <h1 className="text-3xl font-bold">Algorithmic Patterns</h1>
+      <p className="text-[var(--muted-foreground)]">
+        Master common problem-solving patterns to recognize and apply them in
+        interviews.
+      </p>
+
+      <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
+        {patterns.map((pattern) => (
+          <Link
+            key={pattern.id}
+            href={`/patterns/${pattern.slug}`}
+            className="p-6 rounded-lg border border-[var(--border)] bg-[var(--card)] hover:border-[var(--primary)] transition-colors"
+          >
+            <div className="flex items-center justify-between mb-2">
+              <h3 className="font-semibold">{pattern.name}</h3>
+              <span className="text-sm text-[var(--muted-foreground)]">
+                {pattern.question_count} questions
+              </span>
+            </div>
+            {pattern.description && (
+              <p className="text-sm text-[var(--muted-foreground)] mb-3">
+                {pattern.description}
+              </p>
+            )}
+          </Link>
+        ))}
+      </div>
+    </div>
+  );
+}