skills.rest
lucasnobree
lucasnobreeCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

nextjs-best-practices

Provide Next.js best practices for components, data fetching, routing, and performance.

Updated Apr 4, 2026
Search Tags:#best practices#performance#caching#routing#data fetching#Next.js#metadata#App Router#API routes#server components
One-click install
npx skills add https://github.com/lucasnobree/cian-platform --skill nextjs-best-practices-lucasnobree
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: nextjs-best-practices
Source: https://github.com/lucasnobree/cian-platform/tree/main/.agents/skills/nextjs-best-practices
Command: npx skills add https://github.com/lucasnobree/cian-platform --skill nextjs-best-practices-lucasnobree

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill provides guidelines to optimize Next.js application development, addressing common challenges and improving performance.

Core Features & Use Cases

  • Server vs Client Components: Guidance on choosing the right component type based on functionality.
  • Data Fetching Patterns: Strategies for efficient data retrieval and caching.
  • Routing Principles: Best practices for organizing and managing routes.
  • API Routes: Recommendations for creating robust API endpoints.
  • Performance Principles: Techniques for optimizing app performance.
  • Metadata: Best practices for setting static and dynamic metadata.
  • Caching Strategy: Strategies for implementing effective caching mechanisms.
  • Server Actions: Guidelines for handling server-side actions.
  • Anti-Patterns: Identification of common pitfalls to avoid.
  • Project Structure: Best practices for organizing the project structure.

Quick Start

Run the 'nextjs-best-practices' skill to learn about Next.js App Router principles, server components, data fetching, and routing patterns.

Frequently Asked Questions about nextjs-best-practices

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

FAQPage Schema
How do I choose between server and client components in the Next.js App Router?▼

To choose between server and client components in the Next.js App Router, base your decision on functionality: use server components for data fetching and static rendering, and client components for interactivity and state management.

What's the best way to implement data fetching and caching in Next.js?▼

The best way to implement data fetching and caching in Next.js involves applying specific strategies for efficient data retrieval and establishing effective caching mechanisms to optimize performance.

How should I structure routing and API routes in a Next.js application?▼

To structure routing and API routes in a Next.js application, follow established routing principles for organizing routes and apply recommendations for creating robust API endpoints within the App Router.

What are common Next.js anti-patterns I should avoid?▼

Common Next.js anti-patterns to avoid include misusing server actions, improper metadata configuration, inefficient project structure organization, and flawed component type selection that degrades performance.

How do I set static and dynamic metadata in Next.js?▼

To set static and dynamic metadata in Next.js, apply best practices for configuring metadata within the App Router to optimize SEO and ensure correct rendering based on application data.

Related Skills

Explore More Software Engineering Skills→
tlswhdghks42tlswhdghks42

nextjs-frontend-guidelines

Provide Next.js 15 frontend guidelines covering React 19, TypeScript, App Router, shadcn/ui, and Tailwind CSS 4 for the YGS project.

Community
Advanced
TwuanMinnTwuanMinn

nextjs-best-practices

Standardize Next.js App Router development across components, data fetching, routing, caching, and performance.

Community
Advanced
leenBakshleenBaksh
1

frontend-skill

Guide React, Next.js, and Tailwind CSS frontend implementations with component architecture and styling guidelines.

Community
Intermediate
AmidVoshakulAmidVoshakul

sveltekit

Manage file-based routing, SSR, and API routes in SvelteKit applications.

Community
Advanced