frontend-feature

Implements one approved frontend plan task using existing contracts and shared UI conventions.

Updated Aug 5, 2026
One-click install
npx skills add https://github.com/ahsanghalib/ai-workflow --skill frontend-feature-ahsanghalib
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: frontend-feature
Source: https://github.com/ahsanghalib/ai-workflow/tree/main/skills/frontend-feature
Command: npx skills add https://github.com/ahsanghalib/ai-workflow --skill frontend-feature-ahsanghalib

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? It keeps frontend feature work bounded and verifiable by requiring an approved SPEC and PLAN before any code changes, preventing scope creep, unauthorized contract changes, and unverified claims of completion. ## Core Features & Use Cases - Approved-task enforcement: Requires an exact approved SPEC and frontend PLAN, selecting only the first eligible task via the implement-next companion workflow. - Contract-safe implementation: Uses feature-local API modules, shared UI primitives, and narrow state scoping while keeping authorization decisions on the server. - Verification and handoff: Verifies user-observable behavior with typecheck, lint, and tests, then hands off substantial work to code review with recorded evidence. - Use Case: A developer has an approved PLAN for a new settings page. This Skill selects the first unchecked task, implements it against the existing API contract, runs the validation commands, and reports changed files and untested paths. ## Quick Start Ask the assistant to implement the first eligible task from the approved frontend PLAN for your feature, verifying behavior before claiming completion.

Frequently Asked Questions about frontend-feature

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

FAQPage Schema
How do I implement a frontend feature task from an approved plan?▼

Provide the exact approved SPEC and frontend PLAN path, then let the workflow select the first eligible unchecked task. It implements only that task, preserves red/green/refactor gates, and verifies user-observable behavior before reporting results.

Can I use this for a small frontend bug fix without a plan?▼

A trivial fix can use the lightweight path only if it is one bounded user-visible behavior, does not change API contracts, auth, security, persistence, or deployment, and has a clear validation command. Otherwise it routes through project-init.

Does it work when the backend API contract is not ready?▼

Implementation proceeds only when the contract exists or is explicitly mocked by the approved task. If a required contract is missing, the work stops and the dependency is routed to the backend/API workflow instead of guessing.

What are the limitations of this frontend workflow?▼

It does not redesign backend or domain behavior, modify unapproved shared contracts, create catch-all API modules, push branches, or deploy. It also never reads secrets, .env contents, or browser credentials, and completes only one plan task per pass.

How is frontend work verified before completion?▼

Verification covers user-observable behavior plus typecheck, lint, and tests, with TDD evidence or a recorded exception. Substantial work is handed to code review, and browser checks record origin, viewport, assertions, and console or network observations.