project-conventions

Standardize Next.js App Router project structure with TypeScript strict and Tailwind.

Updated Mar 5, 2026

Search Tags:#typescript #conventions #nextjs #tailwind #coding-standards #app-router #project-structure

Ready to run

npx skills add https://github.com/Ezequielpereyraa/ai-config --skill project-conventions-ezequielpereyraa

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: project-conventions
Source: https://github.com/Ezequielpereyraa/ai-config/tree/main/cursor/skills/project-conventions
Command: npx skills add https://github.com/Ezequielpereyraa/ai-config --skill project-conventions-ezequielpereyraa

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Establishes project conventions for Next.js App Router projects using TypeScript strict mode and Tailwind, reducing onboarding time and ensuring consistent architecture.

Core Features & Use Cases

Enforces a clear folder structure and naming patterns across apps.
Guides on modular organization (src/app, components, hooks, utils, services, mappers, types) to improve maintainability and collaboration.
Use Case: Start a new Next.js project with a consistent scaffold that aligns with the prescribed conventions.

Quick Start

Follow the conventions in this Skill when starting a new Next.js App Router project with TS strict and Tailwind.

Frequently Asked Questions about project-conventions

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

FAQPage Schema

How do I structure a Next.js App Router project with TypeScript and Tailwind?▼

To structure a Next.js App Router project, use a modular organization with folders like src/app, components, hooks, utils, services, mappers, and types. This enforces consistent architecture and maintainability across teams.

What are the best conventions for starting a new Next.js App Router application?▼

The best conventions for starting a new Next.js app include enforcing TypeScript strict mode, applying Tailwind configuration standards, and using clear folder structure and naming patterns to reduce onboarding time.

Does this convention guide support existing Next.js projects or only new ones?▼

These conventions support both starting new apps and enforcing consistent structure in existing team projects. They apply modular naming conventions and TypeScript strict usage to standardize Next.js App Router architecture.

Why use TypeScript strict mode and modular folders in Next.js App Router?▼

Use TypeScript strict mode and modular folders in Next.js App Router to ensure consistent architecture and reduce onboarding time. This setup enforces clear naming patterns across components, hooks, utils, services, mappers, and types.

Can I use these Next.js conventions without Tailwind CSS?▼

These conventions are specifically designed for Next.js App Router projects using Tailwind. While folder structure and TypeScript strict rules apply independently, the Tailwind configuration standards require Tailwind to be installed.