Documentation/Frameworks/Nextjs
🏗ī¸

Nextjs

v1.1.2Apache 2.0

Advanced Next.js skills for App Router, Server Components, and data fetching.

frameworksskillhooknextjsreactssr

Installation

Install han binary (required for hooks to work):

curl -fsSL https://han.guru/install.sh | bash

Then install this plugin:

han plugin install nextjs

Overview

Advanced Next.js skills for App Router, Server Components, and data fetching.

Skills

This plugin provides the following skills:

  • Nextjs App Router
  • Nextjs Data Fetching
  • Nextjs Server Components

Usage

Once enabled, Claude will automatically apply these skills when working with relevant code. The plugin provides context and expertise that Claude uses to:

  • Write idiomatic code following best practices
  • Suggest appropriate patterns and architectures
  • Catch common mistakes and anti-patterns
  • Provide framework-specific guidance

Installation

Install via the han CLI:

bash
han plugin install nextjs

Skills

📖

nextjs-app-router

Use when next.js App Router with layouts, loading states, and streaming. Use when building modern Next.js 13+ applications.

📖

nextjs-data-fetching

Use when next.js data fetching patterns including SSG, SSR, and ISR. Use when building data-driven Next.js applications.

📖

nextjs-server-components

Use when next.js Server Components for optimal performance. Use when building data-intensive Next.js applications.

Hooks

🛑

Stop

Runs when the main Claude Code agent has finished responding. Can verify task completion, check quality gates, or ensure documentation requirements are met before the session ends.

han hook run nextjs lint --async
🛑

SubagentStop

Runs when a Claude Code subagent (Agent tool call) has finished responding. Can validate subagent outputs, enforce quality standards, or trigger additional workflows after delegated tasks complete.

han hook run nextjs lint --async