phase-2-convention_skill

Overview

This skill defines coding rules and conventions to keep JavaScript projects consistent and AI-friendly. It codifies naming, file structure, environment variables, architecture, and reusable patterns so collaborators and AI agents produce predictable, maintainable code. Use it proactively when starting a project or whenever a clear style guide is required.

How this skill works

The skill produces a CONVENTIONS.md and supporting docs that specify naming rules, code style (indentation, quotes, semicolons), folder structure, and common patterns. It also defines environment variable prefixes, .env file layout, validation examples, and clean-architecture dependency rules. Deliverables are written files and checklists that fit Starter, Dynamic, and Enterprise application levels.

When to use it

• Starting a new project to set consistent coding style before writing code
• Onboarding AI agents so generated code follows project conventions
• Designing environment variable naming and .env structure at design stage
• Defining architecture and folder layout for maintainability
• Preparing reusable patterns and extraction criteria to reduce duplication

Best practices

• Document conventions in CONVENTIONS.md and split naming/structure into docs/01-plan/
• Prefer PascalCase for components, camelCase for functions, UPPER_SNAKE_CASE for constants
• Use kebab-case or PascalCase for filenames according to team preference and document it
• Define env var prefixes (NEXT_PUBLIC_, DB_, API_, AUTH_) and never expose secrets to client
• Adopt a 4-layer clean architecture (presentation, application, domain, infrastructure) with clear import rules
• Include env validation (e.g., zod) and a .env.example template to avoid missing variables

Example use cases

• Create a Phase 2 CONVENTIONS.md before Phase 3 mockups so AI-generated UI code matches project style
• Onboard a new developer or AI assistant with concise naming.md and structure.md
• Set up .env.example and local .env rules to avoid deployment surprises
• Define reusable component and function guidelines to increase code reusability
• Apply level-based folder structures (Starter → Dynamic → Enterprise) when scaling the project