docs(dashboards): Add Next.js Overview dashboard page (#17323)

Author: sergical

docs/product/dashboards/sentry-dashboards/img/nextjs-overview-dash.png

@@ -62,7 +62,7 @@ Like all dashboards, Sentry Dashboards can be [filtered](/product/dashboards/#gl
 
 | Dashboard | Description |
 |-----------|-------------|
-| **Next.js Overview** | Holistic view for Next.js: traffic, performance, client- and server-side issues, Web Vitals, rage & dead clicks. Tree-based SSR view for performance bottlenecks. |
+| **Next.js Overview** | Holistic view for Next.js: traffic, performance, client- and server-side issues, Web Vitals, rage & dead clicks. Tree-based SSR view for performance bottlenecks. [Learn more](/product/dashboards/sentry-dashboards/nextjs/) |
 | **Laravel Overview** | Backend performance, error rates, and request throughput for Laravel. Metrics most relevant to Laravel developers out of the box. |
 
 ## Investigate

docs/product/dashboards/sentry-dashboards/img/nextjs-server-ssr.png

@@ -0,0 +1,50 @@
+---
+title: Next.js Overview
+sidebar_order: 50
+description: >-
+  Monitor your Next.js application with a holistic view of client and server performance, Web Vitals, issues, and SSR bottlenecks.
+---
+
+The **Next.js Overview** dashboard gives you a combined view of client-side and server-side performance for your Next.js application. It surfaces Web Vitals, page load and navigation metrics, server transaction performance, and SSR rendering bottlenecks in one place.
+
+![Next.js Overview dashboard showing pageloads, API latency, performance score, rage clicks, and client transactions. =800x](./img/nextjs-overview-dash.png)
+
+## Widgets
+
+The top section of the dashboard includes the following widgets:
+
+- **Pageloads**: Total page loads over time, with release markers.
+- **API Latency**: P95 span duration for API routes.
+- **Issue Counts**: New and resolved issue counts over time.
+- **Performance Score**: Aggregate [Web Vitals](/product/dashboards/sentry-dashboards/frontend/web-vitals/) score (LCP, CLS, INP, FCP, TTFB) displayed as a donut chart.
+- **Rage and Dead Clicks**: Pages with the most rage clicks (repeated clicks from user frustration) and dead clicks (clicks that produce no response).
+- **Slow SSR**: Server-side rendering durations for the slowest components over time.
+
+## Client Transactions
+
+The **Client Transactions** table lists browser-side transactions grouped by operation type:
+
+| Operation | Description |
+|-----------|-------------|
+| `pageload` | Full page loads (initial navigation) |
+| `navigation` | Client-side route transitions |
+| `ui.interaction.click` | Click interactions |
+| `ui.interaction.press` | Press interactions |
+
+Each row shows views, error rate, average and P95 duration, and a [performance score](/product/insights/frontend/web-vitals/) where applicable.
+
+## Server Transactions
+
+The **Server Transactions** table lists your server-side routes ranked by traffic. Each row shows views, error rate, average and P95 duration, and total time spent. Use this to identify slow or error-prone routes.
+
+![Server Transactions table and SSR File Tree showing server route performance and component-level rendering times. =800x](./img/nextjs-server-ssr.png)
+
+## SSR File Tree
+
+The **SSR File Tree** widget maps your Next.js file-system routes to server-side rendering performance. It shows the component hierarchy (layouts, pages, and their child components) with error rates, average duration, and P95 duration for each node.
+
+Use this to identify which specific layout or page component is contributing to slow server-side renders.
+
+## Getting Started
+
+The Next.js Overview dashboard appears automatically when you have a Next.js project sending data to Sentry. Set up the [Sentry Next.js SDK](/platforms/javascript/guides/nextjs/) to start collecting the required telemetry.