Static analysis for Next.js

Find the broken paths in your product before your users do.

UX Grapher reads your codebase as a graph: every screen a node, every link and button an edge. It reports the pages nobody can reach, the links that go nowhere and the journeys with no way back, each with the file, the line and the fix.

No setup, no config file, no running your code.

Navigation//store/orders/orders/[id]/products/product/[id]/billing/products/new/dashboard/stores
orphaned page or dead link dead end global navigation
11
real navigation defects found in a public open-source store
5 s
to map its 35 screens and 83 links
11 / 11
error findings confirmed by hand against the source
0
lines of your code executed, installed or stored
How it works

Your code already describes your product’s map. We read it.

Analytics tell you where users went. The code tells you everywhere they could go, and everywhere they can’t.

01

Connect a repository

Point the CLI at a folder today. Soon: sign in with GitHub and pick a repo. Private repositories are read through a GitHub App, never through a pasted token.

02

Every screen and link is mapped

Routes, layouts, links, router calls, redirects and config redirects, followed through imports and path aliases, and credited to the screen that renders them.

03

Get a structured assessment

Coverage first, then reachability, dead ends and chokepoints, then every defect with its evidence and a concrete fix. On pull requests: a check that fails on new defects.

What it finds

Structural defects, not opinions.

Every finding is measured on the graph and points at the code that caused it.

Dead links

error

A link or router.push to a route that no longer exists, including the ones a refactor left behind. Names the route it most likely meant.

Orphaned pages

error

A screen that exists, ships, and has no way in. A feature someone paid for that users cannot find.

Missing doors

error

A navigation entry that lights up for a section it never actually links to. You can only arrive by typing the URL.

Dead ends

warning

A screen with no next step. The only way on is the sidebar or the back button.

One-way journeys

warning

Getting in takes one click; getting back takes four. Measured for every link, not guessed.

Chokepoints

info

The screens every path is forced through. One broken release there, and everything behind it is cut off.

A real finding

The kind of bug a refactor leaves behind.

The store dashboard in skateshop, a popular open-source Next.js app, moved from /dashboard/stores to /store/[storeId]. A dozen links didn’t move with it. A catch-all route swallows them, so nothing crashes. They just go nowhere. Link checkers can’t see this. The graph can.

Read the full report →
HighDead link

“View details” on the /store/[storeId]/customers/[customerId] page and 1 other screen leads to a page that doesn’t exist.

What users experience
Users who click “View details” on the /store/[storeId]/customers/[customerId] page and 1 other screen land on a “page not found” instead of what they asked for. What they were trying to do stops there.
Why it matters
It is reachable from 2 different screens, so it interrupts several journeys, and each click is a likely support ticket.
Why high
A guaranteed failure for anyone who clicks it, and usually a one-line fix.
Recommended fixPoint the “View details” button at /store/[storeId]/orders/[orderId]. That section moved there and this link was not updated.
Where
“View details” on the /store/[storeId]/customers/[customerId] page and 1 other screensrc/components/tables/orders-table.tsx:124
Technical details

dangling-edge · /dashboard/stores/*/orders/* · error · confidence medium

No page.tsx backs /dashboard/stores/*/orders/*. /store/[storeId]/orders/[orderId] ends the same way, so this looks like a link left behind when the section moved.

/store/[storeId]/orders/[orderId] exists and shares the rest of the path.

Honest by design

It tells you what it couldn’t read.

Some links are computed at runtime. Rather than guess, every one is listed with its file and line, and coverage is the first number in every report.

69% resolved (57 links)26 listed for review
Safe with private code

We keep nothing. Not your code, not your report.

  • ✓ Static analysis only. Nothing is installed, built or run.
  • ✓ Access through a GitHub App that can only read the repositories you choose, with your own sign-in.
  • ✓ The code is unpacked in memory. It never touches disk.
  • ✓ No database. The report exists on your screen until you leave; download it to keep it.
Try it

Run it on your own repo in a minute.

The command-line tool is the same engine the web app will use. Point it at any Next.js app-router project and read the report it writes. The hosted version, with GitHub sign-in and pull-request checks, is in private beta.

Works with app/ or src/app/, TypeScript or JavaScript. Add a .uxgraph.yml to declare your sidebar for sharper results.

# from the ux-graph-analyzer checkout
$ node packages/cli/dist/bin.js ../my-app
ux-graph: 43 nodes, 118 edges, 69% coverage
ux-graph: 11 error, 20 warning, 4 info
ux-graph: wrote ux-graph-report/UX_GRAPH_REPORT.md

# fail CI on new defects
$ node packages/cli/dist/bin.js . --check --baseline baseline.json

See the map of your product.

Start with the sample report, then run it on your own code.