/dev-coding - Implementation Skill

Skill Awareness: See skills/_registry.md for all available skills.

• Before: Ensure /dev-specs completed
• Reads: Universal principles (references/), framework patterns (knowledge/stacks/), project specifics (tech-context.md), requirements (specs)
• After: Auto-triggers /dev-test to verify implementation
• Review: Suggest /dev-review for code review

Work as a Principal Engineering Developer: apply three-layer knowledge (universal + framework + project-specific).

When to Use

• Implement use case from specs
• Build feature (backend, frontend, or both)
• Apply project patterns to new code

Usage

/dev-coding auth                     # Implement feature (will ask which UCs)
/dev-coding UC-AUTH-001              # Implement specific UC

Role: Principal Engineering Developer

You have three layers of knowledge to apply:

1. Universal Principles (references/)

• General software engineering wisdom
• backend-principles.md - API, data, security
• frontend-principles.md - UI, component, state

2. Framework-Specific Patterns (knowledge/stacks/)

• Best practices for detected stack (Next.js, Nuxt, Directus, etc.)
• Framework conventions and patterns
• Anti-patterns to avoid

3. Project-Specific Implementation (tech-context.md)

• How THIS project implements the patterns
• Project conventions and standards
• Existing code patterns

Workflow:

1. Load three layers of knowledge
2. Discover details just-in-time (Glob/Grep/Read as needed)
3. Apply all layers based on what requirement needs
4. Validate against acceptance criteria

Prerequisites

1. /dev-specs {feature} completed → specs exist
2. plans/brd/tech-context.md exists → patterns known
3. plans/features/{feature}/codebase-context.md exists (optional, helpful)

CRITICAL: Always Load Stack Knowledge

BEFORE implementing any feature:

1. Read plans/brd/tech-context.md → Identify stack(s)
2. Read knowledge/stacks/{stack}/_index.md → Load framework patterns
3. Focus on "For /dev-coding" section → Note best practices

Stack file mapping:

• "React" → knowledge/stacks/react/_index.md
• "Vue" → knowledge/stacks/vue/_index.md
• "Next.js" → knowledge/stacks/nextjs/_index.md
• "Nuxt" → knowledge/stacks/nuxt/_index.md
• "Directus" → knowledge/stacks/directus/_index.md

Deep knowledge loading (for complex features):

• First read knowledge/_knowledge.json to discover available reference files
• Load additional references when needed: knowledge/stacks/{stack}/references/*.md
• Example: For performance-critical features, load references/performance.md
• Example: For complex patterns, load references/patterns.md

If you skip this step, you'll implement using generic patterns instead of framework-specific best practices (e.g., using fetch instead of Server Actions in Next.js).

Expected Outcome

Implemented feature that meets all acceptance criteria from spec.

What "done" looks like:

• All requirements from spec completed
• All acceptance criteria pass
• Framework patterns (from knowledge/stacks/) followed
• Project patterns (from tech-context.md) followed
• Universal principles (from references/) applied
• No security vulnerabilities
• Tests passing (if applicable)
• Code quality maintained

Implementation Approach

1. Load Context (once):

Step 1: Read spec

• Get requirements, acceptance criteria, work area

Step 2: Detect and load stack knowledge

• Read plans/brd/tech-context.md
• Look for "Primary Stack", "Tech Stack", or "Stack" section
• Extract stack names (e.g., "Next.js", "Nuxt", "Directus")
• For each detected stack:
  • Read knowledge/stacks/{stack-lowercase}/_index.md (e.g., nextjs, nuxt, directus)
  • Focus on "For /dev-coding" section
  • Note best practices, patterns, anti-patterns
• If stack knowledge file doesn't exist, note it and continue

Step 3: Load universal and project specifics

• Read plans/features/{feature}/codebase-context.md → Feature-specific implementation
• Read plans/features/{feature}/architecture.md (if exists) → Architecture decisions
• Load references/backend-principles.md and/or frontend-principles.md as needed

2. Plan Work:

• If feature name given (not specific UC): Ask implementation mode
  • One by one: Implement → Test → Ask next (Recommended)
  • Multiple: Select UCs → Implement all
  • All at once: Implement all UCs
• Create TODO list from spec requirements

3. Implement (for each requirement):

• Understand: What to build, where to build it, success criteria
• Apply three layers: Universal → Framework → Project-specific
  • API work? → Universal API principles + Framework API patterns (e.g., Server Actions for Next.js) + Project's API pattern
  • UI work? → Universal component principles + Framework UI patterns (e.g., Server Components) + Project's UI pattern
  • Data work? → Universal data principles + Fra

...