GitHub CopilotNext.jsArchitecture

Next.js GitHub Copilot Instructions

GitHub Copilot custom instructions for Next.js App Router projects.

.github/copilot-instructions.md

- Default to Server Components; mark as 'use client' only when state or browser APIs are needed
- Use server actions for mutations; validate with zod before processing
- Generate proper TypeScript types for route params and searchParams
- Add generateMetadata export to all route segments with dynamic data
- Use Image component from next/image with explicit dimensions always
- Apply next-safe-action for type-safe, validated server actions
- Generate loading.tsx and error.tsx siblings for all layout segments
- Use the new cookies() and headers() APIs from next/headers in Server Components

How to use with GitHub Copilot

Create `.github/copilot-instructions.md` in your repository. GitHub Copilot uses these to customize suggestions across your whole repo.

← All GitHub Copilot rules All Next.js rules →

#nextjs#copilot#github#app-router#coding-rules

Related Rules

TypeScript GitHub Copilot Instructions

GitHub CopilotTypeScript

GitHub Copilot custom instructions for TypeScript: strict types, modern patterns, and team conventions.

Code Style

typescript · copilotCopy Ready

React GitHub Copilot Instructions

GitHub CopilotReact

GitHub Copilot instructions for React: hooks, patterns, and best practices for modern React apps.

Code Style

react · copilotCopy Ready

Java GitHub Copilot Instructions

GitHub CopilotJava

GitHub Copilot instructions for Java 21: virtual threads, records, sealed types, and modern Spring Boot patterns.

Code Style

java · springCopy Ready

Swift GitHub Copilot Instructions

GitHub CopilotSwift

GitHub Copilot instructions for Swift: SwiftUI, async/await, and modern iOS development patterns.

Code Style

swift · swiftuiCopy Ready