Can it help me fix hydration errors?

Absolutely. The skill provides debugging strategies and common fixes for hydration mismatches caused by browser APIs, dates, or invalid HTML nesting.

How does it handle image and font optimization?

It enforces the use of next/image and next/font with specific rules for remote images, responsive sizes, and Tailwind CSS integration to ensure optimal loading.

Does this skill support the latest Next.js 15 changes?

Yes, it includes specific patterns for Next.js 15+ async APIs, including breaking changes to params, searchParams, cookies, and headers.

Can this skill assist with self-hosting Next.js?

Yes, it includes guidance for 'output: standalone' configurations for Docker and cache handlers for multi-instance ISR environments.

Does it cover React Server Components (RSC)?

Yes, it specializes in detecting invalid RSC patterns, such as async client components and non-serializable props passed across the server-client boundary.

Next.js Best Practices

Name: Next.js Best Practices
Author: liminal-ai

byliminal-ai

0•

개발자 도구

Optimizes Next.js application development by enforcing modern patterns, App Router conventions, and performance best practices.

This skill provides a comprehensive framework for building production-grade Next.js applications, specifically targeting the App Router architecture and the latest features in versions 15 and 16. It guides developers through complex React Server Component (RSC) boundaries, handles async API migrations for headers and cookies, and ensures optimal performance through guided implementation of image, font, and script optimizations. Whether you are debugging hydration errors or architecting advanced parallel routing, this skill acts as an expert steward to maintain high code quality and adherence to official Next.js standards.

주요 기능

01Enforces Next.js 15+ async API patterns for cookies, headers, and params

02Validates React Server Component (RSC) boundaries and prop serialization

03Troubleshoots hydration errors and data waterfalls in App Router

04Guides implementation of complex parallel and intercepting route patterns

05Optimizes Core Web Vitals through image, font, and script configuration

060 GitHub stars

사용 사례

01Reviewing and refactoring Server Components to ensure proper client/server separation

02Setting up production-ready error handling and metadata for SEO optimization

03Migrating legacy Next.js projects to version 15/16 async API standards

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add liminal-ai/code-steward next-best-practices

For use in Claude.ai and ChatGPT

주요 기능

01Enforces Next.js 15+ async API patterns for cookies, headers, and params

02Validates React Server Component (RSC) boundaries and prop serialization

03Troubleshoots hydration errors and data waterfalls in App Router

04Guides implementation of complex parallel and intercepting route patterns

05Optimizes Core Web Vitals through image, font, and script configuration

060 GitHub stars

사용 사례

01Reviewing and refactoring Server Components to ensure proper client/server separation

02Setting up production-ready error handling and metadata for SEO optimization

03Migrating legacy Next.js projects to version 15/16 async API standards

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add liminal-ai/code-steward next-best-practices

For use in Claude.ai and ChatGPT