skills.rest
mustafazeydani
mustafazeydaniCOMMUNITY
Explore all skills by this author →
GitHub

frontend-conventions

Enforce Next.js conventions for routing, components, metadata, and API client generation.

Updated Apr 25, 2026
Search Tags:#SEO#web development#Next.js#metadata#code conventions
One-click install
npx skills add https://github.com/mustafazeydani/nextjs-nestjs-monorepo-starter --skill frontend-conventions-mustafazeydani
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: frontend-conventions
Source: https://github.com/mustafazeydani/nextjs-nestjs-monorepo-starter/tree/main/.agents/skills/frontend-conventions
Command: npx skills add https://github.com/mustafazeydani/nextjs-nestjs-monorepo-starter --skill frontend-conventions-mustafazeydani

SYSTEM DOCUMENTATION & REQUIREMENTS

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

What problem does it solve?

This Skill addresses the need for consistent web app development practices, ensuring that web applications adhere to best practices and conventions for efficient and maintainable code.

Core Features & Use Cases

  • Conventions Enforcement: Enforces standard structures for Next.js applications, including App Router route colocation, component and utility organization, and shared path constants.
  • API Client Integration: Generates API clients and ensures codegen synchronization after backend changes.
  • Metadata & SEO Optimization: Provides guidance on metadata and structured data implementation for SEO-friendly web pages.
  • Client-Server Boundaries: Defines clear boundaries between client and server code, improving maintainability and security.
  • Use Case: When you're developing a new feature in a Next.js application and want to ensure that your code adheres to established web app conventions.

Quick Start

Apply the frontend-conventions skill to review and refactor your web app feature code to align with best practices.

Frequently Asked Questions about frontend-conventions

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

FAQPage Schema
What are the best practices for Next.js App Router file structuring?▼

Next.js App Router conventions enforce route colocation, organized component and utility structures, and shared path constants to maintain consistent web application architecture and improve code maintainability.

How do I generate and synchronize an API client in Next.js after backend changes?▼

You can generate API clients and ensure codegen synchronization after backend changes by applying frontend conventions, which keeps your web application code aligned with backend updates automatically.

How do I implement metadata and structured data for SEO in Next.js?▼

Implementing SEO-friendly web pages in Next.js requires proper metadata and structured data configuration, which this skill enforces by providing guidance on metadata best practices for search optimization.

How do I separate client and server code boundaries in Next.js?▼

Defining clear boundaries between client and server code in Next.js improves application maintainability and security by strictly separating server-side logic from client-side execution environments.

Can I use these web development conventions for existing Next.js features?▼

Yes, you can apply these web development conventions to review and refactor existing Next.js feature code, ensuring it aligns with established best practices for maintainability and SEO optimization.

Does this convention enforcement work without external dependencies?▼

Yes, this convention enforcement operates without external dependencies, utilizing built-in scripts and references to standardize your Next.js routing, component structuring, and metadata implementations directly.

Related Skills

Explore More Software Engineering Skills→
mrlynnmrlynn
8

mongodb-nextjs-scaffold

Initialize a Next.js application with MongoDB connection and validation schemas.

Community
Intermediate
CodySwannGTCodySwannGT
3

ops-db-ops

Manage database migrations, reverts, schema generation, and GraphQL codegen for Expo/serverless projects using TypeORM and AWS credentials.

Community
Intermediate
dirnbauerdirnbauer
33

ai-search-optimization

Optimize content for AI search engines with schema.org markup.

Community
Intermediate
nonputtipongnonputtipong

Python Development Tools

Guide Python development with Pyright, Ruff, pytest, and debugging workflows.

Community
Intermediate