Frontend Engineer

A consistent frontend workflow — component design, state handling, build verification — so quality doesn't vary by task.

AI Agents / Developmentai-agentsdevelopment
by AgentVoltv1.0.0Published 1y ago1 install
Free to sign up · every skill included with AgentVolt Pro

Before & after

Same prompt, same agent — the only difference is the skill.

PromptWhat's my priority list for frontend work this sprint?
Beforegeneric AI agent
For CS frontend, you'd probably want to prioritize work that has the biggest impact on your customers. That could be bug fixes, performance improvements, new features they're asking for, or improvements to the user experience. You'd also want to think about technical debt—things like code refactoring or dependency updates that will make your life easier long-term. It's usually a good idea to balance customer-facing work with internal improvements. You could look at your backlog and rank items by impact to customers, effort required, and strategic value. Do you have user feedback about what's causing friction? That might help you figure out what to prioritize.
Afterwith Frontend Engineer
CS FRONTEND PRIORITY FRAMEWORK (repeatable sprint planning)

INPUT SOURCES (gather before sprint)
→ Support tickets (CS team reported: 8 'login timeout' issues, 4 'dashboard loads slow')
→ User feedback (NPS comments: 2 requests for mobile optimization, 1 for dark mode)
→ Product roadmap (Q3 goal: onboarding flow improvement)
→ Technical debt log (3 legacy dependencies overdue for upgrade; TypeScript compiler warnings in auth.ts)
→ Metrics (page load avg: 3.2s target, current: 4.1s)

RANKED PRIORITY STACK

TIER 1 (CUSTOMER-BLOCKING)
→ Fix login timeout issue (support: 8 tickets, affects 15+ users, 2-hour fix) → Sprint day 1
→ Dashboard load optimization (current 4.1s → target 2.5s; performance budget exceeded) → Sprint day 2-3
→ Migrate to new auth library (blocking future SSO feature; legacy dependency EOL in 60 days) → Sprint day 3-4

TIER 2 (VALUE-ADD, IF TIME)
→ Mobile-responsive improvements (2 NPS comments; low complexity; 1 day)
→ Dark mode toggle (1 NPS comment; not blocking; defer unless day 5 exists)

TIER 3 (TECH DEBT, BACKLOG)
→ TypeScript compiler warnings cleanup (code quality; no user impact; assign to next sprint if time permits)
→ Upgrade remaining dependencies (3 packages; not urgent; schedule for next month)

SPRINT COMMITMENT (5 days)
→ Day 1: Login issue fix + unit tests
→ Day 2-3: Dashboard performance deep-dive (profiling, lazy-loading, cache strategy)
→ Day 4: Auth migration (spike + proof of concept)
→ Day 5: Buffer for code review, QA, spillover
→ NOT included: Dark mode, TypeScript warnings (defer)

VALIDATION (end-of-sprint)
→ Did we close 8 login-timeout support tickets? (metric: tickets closed)
→ Is dashboard load < 2.5s? (metric: Lighthouse score)
→ Is auth migration on track? (metric: PoC merged)

About this skill


name: cs-frontend-engineer description: Use when Structured Claude skill that gives Claude a repeatable workflow for cs frontend engineer.

Cs Frontend Engineer

One of 337+ skills in the original author's multi-agent claude-skills mega-collection (~19k GitHub stars). Packages the Cs Frontend Engineer workflow with its own instructions and validation so outputs stay consistent.

What you get

  • Public GitHub repo (alirezarezvani/claude-skills)
  • the cs-frontend-engineer skill folder with SKILL.md. Part of a 337-skill / 30-agent / 70-command install.

Customize your output

  • Fork the repo and adapt the skill's instructions and references to your workflow.

Example output

Activates automatically when your request matches Cs Frontend Engineer; chains with the other skills, agents, and commands in the collection.

Best for

Creators, builders, and teams using Claude Code.

SKILL.md preview

SKILL.md
---
name: cs-frontend-engineer
description: Use this skill to run a repeatable, validated workflow for frontend engineering tasks handled by the CS Frontend Engineer persona.
version: 1.0.0
category: AI Agents / Development
author: AgentVolt
license: proprietary
tags:
  - ai-agents
  - development
---

# Cs Frontend Engineer

Applies a consistent frontend engineering workflow — component design, state handling, and build verification — so output quality does not vary by task.

## When to use

… (sign up to view the full skill)
Sign up to view, copy, and install the full skill

More ai & agents skills

View all AI & Agents skills →