nextjs

Migrate Next.js 16+ Pages Router apps to App Router patterns.

2|Updated Mar 29, 2026

Search Tags:#web development #react #migration #vercel #nextjs #app router

Ready to run

npx skills add https://github.com/NagyVikt/codex-plugins --skill nextjs-nagyvikt

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: nextjs
Source: https://github.com/NagyVikt/codex-plugins/tree/main/plugins/vercel/skills/nextjs
Command: npx skills add https://github.com/NagyVikt/codex-plugins --skill nextjs-nagyvikt

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill provides expert-level architectural guidance and automated migration support for Next.js 16+ applications, ensuring developers follow modern App Router patterns and avoid legacy pitfalls.

Core Features & Use Cases

App Router Migration: Automatically identifies legacy Pages Router patterns (like getServerSideProps) and provides migration paths to Server Components and Route Handlers.
Performance Optimization: Enforces lazy initialization for database and SDK clients to prevent build-time crashes and optimizes font loading with next/font.
Use Case: Use this Skill to refactor a legacy Pages Router application into a modern, performant Next.js 16 architecture using React 19 features and the App Router.

Quick Start

Use the nextjs skill to analyze my current project and suggest migrations from Pages Router to App Router.

Frequently Asked Questions about nextjs

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I migrate from Next.js Pages Router to App Router?▼

Migrating from Next.js Pages Router to App Router involves replacing legacy patterns like getServerSideProps with Server Components and Route Handlers. This transition aligns your project with Next.js 16+ architecture, utilizing React 19.2 standards for improved performance.

What is the best way to optimize database clients for Next.js serverless environments?▼

Optimizing database clients for Next.js serverless environments requires enforcing lazy initialization for database and SDK connections. This prevents build-time crashes by deferring resource allocation until runtime execution.

Can I use React 19 features with Next.js 16 App Router?▼

Yes, you can use React 19 features with the Next.js 16 App Router. The architecture enforces compliance with React 19.2 standards, allowing you to leverage modern Server Components and optimized Vercel deployment configurations.

Why does my Next.js build crash when initializing SDK clients at the top level?▼

Your Next.js build crashes because top-level SDK client initialization executes during the build process. Enforcing lazy initialization defers this execution to runtime, preventing build-time failures in serverless environments.

When do I need to use proxy.ts middleware in Next.js?▼

You need to use proxy.ts middleware in Next.js when migrating legacy Pages Router patterns to modern App Router architectures. It supports advanced routing requirements and ensures optimized Vercel deployment configurations for Next.js 16+ applications.