Complete Next.js migration with SSR and Docker deployment

- Migrate from vanilla JavaScript SPA to Next.js 16 with App Router
- Add server-side rendering for all pages (Home, Compare, Rankings)
- Create individual school pages with dynamic routing (/school/[urn])
- Implement Chart.js and Leaflet map integrations
- Add comprehensive SEO with sitemap, robots.txt, and JSON-LD
- Set up Docker multi-service architecture (PostgreSQL, FastAPI, Next.js)
- Update CI/CD pipeline to build both backend and frontend images
- Fix Dockerfile to include devDependencies for TypeScript compilation
- Add Jest testing configuration
- Implement performance optimizations (code splitting, caching)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

nextjs-app/app/rankings/page.tsx

@@ -0,0 +1,58 @@
+/**
+ * Rankings Page (SSR)
+ * Display top-ranked schools by various metrics
+ */
+
+import { fetchRankings, fetchFilters, fetchMetrics } from '@/lib/api';
+import { RankingsView } from '@/components/RankingsView';
+import type { Metadata } from 'next';
+
+interface RankingsPageProps {
+  searchParams: Promise<{
+    metric?: string;
+    local_authority?: string;
+    year?: string;
+  }>;
+}
+
+export const metadata: Metadata = {
+  title: 'School Rankings',
+  description: 'Top-ranked primary schools by KS2 performance across England',
+  keywords: 'school rankings, top schools, best schools, KS2 rankings, school league tables',
+};
+
+// Force dynamic rendering
+export const dynamic = 'force-dynamic';
+
+export default async function RankingsPage({ searchParams }: RankingsPageProps) {
+  const { metric: metricParam, local_authority, year: yearParam } = await searchParams;
+
+  const metric = metricParam || 'rwm_expected_pct';
+  const year = yearParam ? parseInt(yearParam) : undefined;
+
+  // Fetch rankings data
+  const [rankingsResponse, filtersResponse, metricsResponse] = await Promise.all([
+    fetchRankings({
+      metric,
+      local_authority,
+      year,
+      limit: 100,
+    }),
+    fetchFilters(),
+    fetchMetrics(),
+  ]);
+
+  // Convert metrics object to array
+  const metricsArray = Object.values(metricsResponse.metrics);
+
+  return (
+    <RankingsView
+      rankings={rankingsResponse.rankings}
+      filters={filtersResponse.filters}
+      metrics={metricsArray}
+      selectedMetric={metric}
+      selectedArea={local_authority}
+      selectedYear={year}
+    />
+  );
+}