LowFile-scopeJavaScript / TypeScript Plug & play

Use redirect() and notFound() from next/navigation

Prefer redirect() and notFound() over manual 302/404 handling and custom components in App Router.

Why this matters

Integrates with the router and simplifies control flow.

Bad vs. good

Side-by-side examples engineers can pattern-match during review.

Avoid

return NextResponse.redirect('/login', 302) inside page.tsx

Prefer

import { redirect, notFound } from 'next/navigation'
export default async function Page(){ const session = await getSession(); if(!session) redirect('/login'); const post = await getPost(); if(!post) notFound(); return <div>{post.title}</div> }

More snippets

Bad

Rendering a custom <NotFound /> component

Good

notFound() for a true 404

Related rules

From the same buckets as this rule.

High
Keep 'use client' at the leaf: default to Server Components
Prefer Server Components for pages/layouts and move interactivity to small leaf Client Components. Only add 'use client' where browser APIs or event handlers are strictly necessary.
stack-nextjsstack-react+2
High
Make fetch caching explicit in Server Components
For dynamic data use { cache: 'no-store' } or file-level dynamic = 'force-dynamic'. For ISR use { next: { revalidate: N, tags: [...] } }.
stack-nextjsstack-react+2
High
Middleware only for light auth/rewrites
Keep middleware fast and side-effect free (no DB writes). Narrow the matcher and skip static assets. Use Route Handlers for heavy logic.
stack-nextjsstack-react+2

Why this matters

Bad vs. good

More snippets

Related rules

Keep 'use client' at the leaf: default to Server Components

Make fetch caching explicit in Server Components

Middleware only for light auth/rewrites

Why this matters

Bad vs. good

More snippets

Related rules

Keep 'use client' at the leaf: default to Server Components

Make fetch caching explicit in Server Components

Middleware only for light auth/rewrites