skills.rest
jlaws
jlawsCOMMUNITY
Explore all skills by this author →
GitHub

agent-frontend-engineer

Design accessible, responsive UI components for frontend frameworks like React, Next.js, and Vue.

2|Updated Jan 3, 2026
Search Tags:#ui#accessibility#frontend#react#design-system#responsive-design#component-patterns
One-click install
npx skills add https://github.com/jlaws/dotfiles --skill agent-frontend-engineer
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: agent-frontend-engineer
Source: https://github.com/jlaws/dotfiles/tree/main/.agents/skills/agent-frontend-engineer
Command: npx skills add https://github.com/jlaws/dotfiles --skill agent-frontend-engineer

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Frontend Engineer helps with frontend frameworks, design systems, accessibility, responsive design, and web patterns. Use when building UI components, implementing responsive layouts, or solving accessibility issues. Do NOT use for: backend API design (use architecture-specialist), backend implementation (use language-specialist), or infrastructure/DevOps (use devops-engineer).

Core Features & Use Cases

  • Read relevant files from references/frontend/ to inform UI decisions.
  • Provide accessibility audits, design-system-patterns, and responsive-web-patterns guidance.
  • Use Case: When building a new UI component, ask for patterns, accessibility considerations, and implementation guidance.

Quick Start

Describe a responsive, accessible UI component pattern for a modern web app and provide implementation guidance.

Frequently Asked Questions about agent-frontend-engineer

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

FAQPage Schema
How do I build accessible and responsive UI components in React?▼

Build accessible and responsive UI components by applying design system patterns, following accessibility conformance standards, and implementing responsive web layout techniques. The Skill provides architecture decisions and component pattern guidance for modern frameworks.

What is the best way to structure a design system component library?▼

Structure a design system component library by establishing consistent architecture decisions, reusable component patterns, and accessibility standards. Use this guidance to ensure UI components remain maintainable and conform to accessibility and responsive design best practices.

Can I use this for backend API design and infrastructure setup?▼

No, you cannot use this for backend API design, backend implementation, or infrastructure and DevOps. It is strictly limited to frontend frameworks, design systems, accessibility fixes, and responsive layout architecture decisions.

How do I fix accessibility issues in an existing Vue component?▼

Fix accessibility issues in an existing Vue component by conducting an accessibility audit, identifying conformance gaps, and applying appropriate component patterns and ARIA attributes. The Skill provides targeted guidance for resolving these specific frontend accessibility problems.

Does this Skill work with Next.js for responsive web design?▼

Yes, this Skill works with Next.js and other modern frontend frameworks to implement responsive web design. It provides responsive web patterns, performance best practices, and component architecture guidance tailored for these environments.

Related Skills

Explore More Software Engineering Skills→
vecearvecear

storybook-setup

Automate Storybook setup, configuration, and CSF3 story authoring for frontend projects.

Community
Intermediate
baasith6baasith6

responsive-testing

Capture screenshots of web applications at multiple viewport sizes to identify layout breakages.

Community
Intermediate
HCMUTE-RTICHCMUTE-RTIC

full-stack-orchestration-full-stack-feature

Orchestrate full-stack feature development across backend, frontend, and infrastructure layers.

Official
Advanced
tanstack-skillstanstack-skills
29

tanstack-store

Manage immutable reactive state with stores, derived values, and effects.

Official
Intermediate