fec-nextjs-project-standard

Enforce Next.js 14+ App Router project conventions and best practices.

21|3|Updated Mar 17, 2026
One-click install
npx skills add https://github.com/bovinphang/frontend-craft --skill fec-nextjs-project-standard
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: fec-nextjs-project-standard
Source: https://github.com/bovinphang/frontend-craft/tree/main/localized/zh-CN/skills/fec-nextjs-project-standard
Command: npx skills add https://github.com/bovinphang/frontend-craft --skill fec-nextjs-project-standard

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

The project standard helps teams enforce consistent Next.js 14+ App Router project structure, routing patterns, and data-fetching strategies across repositories, reducing ramp-up time and drift.

Core Features & Use Cases

  • App Router conventions: Layout, routing, loading, error, and not-found surfaces with server-first rendering guidelines.
  • Data fetching & metadata: SSR/SSG/ISR strategies, route handlers, and SEO metadata rules to ensure performance and accessibility.
  • Project-wide architecture: Client/server boundaries, middleware placement, and server actions patterns aligned with project conventions.

Quick Start

Follow the guidelines to scaffold or audit a Next.js 14+ App Router project against the standard.

Frequently Asked Questions about fec-nextjs-project-standard

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

FAQPage Schema
How do I structure a Next.js 14 App Router project to enforce consistent conventions?

To structure a Next.js 14 App Router project, enforce conventions for layouts, routing, loading, error, and not-found surfaces. This standardizes project architecture and reduces structural drift across repositories.

What are the best practices for managing server and client component boundaries in Next.js?

Best practices for Next.js server and client boundaries involve establishing clear rules for component separation. Proper boundaries ensure server-first rendering and align with project-wide architecture conventions.

When should I use SSR, SSG, or ISR for data fetching in Next.js App Router?

Choose SSR, SSG, or ISR for Next.js data fetching based on specific routing needs. The standard requires clear rules for these rendering strategies to ensure optimal performance and accessibility across your routes.

How do I generate SEO metadata correctly in a Next.js 14 App Router project?

To generate SEO metadata correctly in Next.js 14, follow metadata generation rules integrated with your data fetching strategies. This ensures proper SEO metadata outputs and maintains performance and accessibility standards.

Does this Next.js project standard cover middleware and route handlers?

Yes, this Next.js project standard covers middleware and route handlers. It provides guidelines for middleware placement and route handler patterns to maintain consistent project-wide architecture.

How do I audit an existing Next.js project against App Router best practices?

To audit an existing Next.js project against App Router best practices, check it against the standard's rules for server actions, metadata, and component boundaries. This identifies structural drift and enforces consistent conventions.