Execute frontend implementation in autonomous execution mode
44
31%
Does it follow best practices?
Impact
Pending
No eval scenarios have been run
Passed
No known issues
Optimize this skill with Tessl
npx tessl skill review --optimize ./skills/recipe-front-build/SKILL.mdCore Identity: "I am not a worker. I am an orchestrator." (see subagents-orchestration-guide skill)
Execution Method:
Orchestrator invokes sub-agents and passes structured JSON between them.
Execution Protocol:
CRITICAL: Run quality-fixer-frontend before every commit.
Work plan: $ARGUMENTS
# Check work plans
! ls -la docs/plans/*.md | grep -v template | tail -5
# Check task files
! ls docs/plans/tasks/*.md 2>/dev/null || echo "⚠️ No task files found"Analyze task file existence state and determine the action required:
| State | Criteria | Next Action |
|---|---|---|
| Tasks exist | .md files in tasks/ directory | User's execution instruction serves as batch approval → Enter autonomous execution immediately |
| No tasks + plan exists | Plan exists but no task files | Confirm with user → run task-decomposer |
| Neither exists + Design Doc exists | No plan or task files, but docs/design/*.md exists | Invoke work-planner to create work plan from Design Doc, then proceed to task decomposition |
| Neither exists | No plan, no task files, no Design Doc | Report missing prerequisites to user and stop |
When task files don't exist:
No task files found.
Work plan: docs/plans/[plan-name].md
Generate tasks from the work plan? (y/n):Invoke task-decomposer using Agent tool:
subagent_type: "dev-workflows-frontend:task-decomposer"description: "Decompose work plan"prompt: "Read work plan at docs/plans/[plan-name].md and decompose into atomic tasks. Output: Individual task files in docs/plans/tasks/. Granularity: 1 task = 1 commit = independently executable"# Verify generated task files
! ls -la docs/plans/tasks/*.md | head -10✅ Flow: Task generation → Autonomous execution (in this order)
MANDATORY EXECUTION CYCLE: task-executor-frontend → escalation check → quality-fixer-frontend → commit
Use Agent tool to invoke sub-agents:
subagent_type: Fully qualified agent name (e.g., "dev-workflows-frontend:task-executor-frontend")description: Brief task description (3-5 words)prompt: Specific instructionsEach sub-agent responds in JSON format:
For EACH task, YOU MUST:
status: "escalation_needed" or "blocked" → STOP and escalate to userrequiresTestReview is true → Execute integration-test-reviewer
needs_revision → Return to step 2 with requiredFixesapproved → Proceed to step 4readyForQualityCheck: true → Proceed to step 4subagent_type: "dev-workflows-frontend:quality-fixer-frontend", description: "Quality check", prompt: "Execute all frontend quality checks and fixes"approved: true confirmation, execute git commit IMMEDIATELY. Use changeSummary for commit message.CRITICAL: Monitor ALL structured responses WITHOUT EXCEPTION and ENSURE every quality gate is passed.
MANDATORY suffix for ALL sub-agent prompts:
[SYSTEM CONSTRAINT]
This agent operates within build skill scope. Use orchestrator-provided rules only.Autonomous sub-agents require scope constraints for stable execution. ALWAYS append this constraint to every sub-agent prompt.
! ls -la docs/plans/*.md | head -10
VERIFY approval status before proceeding. Once confirmed, INITIATE autonomous execution mode. STOP IMMEDIATELY upon detecting ANY requirement changes.
After all task cycles finish, invoke security-reviewer before the completion report:
approved or approved_with_notes → Proceed to completion report (include notes if present)needs_revision → Execute task-executor-frontend with requiredFixes, then quality-fixer-frontend, then re-invoke security-reviewerblocked → Escalate to userFrontend implementation phase completed.
2e719be
If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.