frontend-engineer

Enforce build, test, and visual verification workflows for frontend projects.

Updated May 7, 2026

Search Tags:#typescript #testing #performance #accessibility #frontend #react #web

Ready to run

npx skills add https://github.com/Bartunek/nanoclaw --skill frontend-engineer-bartunek

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: frontend-engineer
Source: https://github.com/Bartunek/nanoclaw/tree/main/container/skills/frontend-engineer
Command: npx skills add https://github.com/Bartunek/nanoclaw --skill frontend-engineer-bartunek

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Frontend teams often ship updates without real-browser validation, leading to visual regressions, accessibility gaps, and performance issues. This skill enforces a build-test-verify workflow that requires visual verification in a real browser before work is considered complete.

Core Features & Use Cases

Enforce a complete frontend workflow: build, test, verify in a real browser.
Ensure accessibility, responsiveness, and performance checks before release.
Provide a clear Quick Start example to get started with the workflow.

Quick Start

Run the frontend engineering workflow on a web project to ensure the site is built, tested, and visually verified in a real browser.

Frequently Asked Questions about frontend-engineer

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

FAQPage Schema

How do I enforce a frontend workflow that requires visual verification in a real browser before deployment?▼

A production-grade frontend workflow enforces real-browser visual verification alongside TypeScript usage, semantic HTML, accessibility checks, and performance validation before considering any build or update complete.

How do I ensure accessibility and responsive design are checked before a React or Next.js release?▼

Integrate a frontend workflow that mandates accessibility, responsiveness, and performance checks alongside build and test phases, ensuring semantic HTML and design-system adoption are validated before release.

Does this frontend workflow support both Vite and plain HTML/CSS stacks?▼

Yes, the workflow applies to Next.js, Vite, and plain HTML/CSS stacks, enforcing build, test, accessibility, and performance checks uniformly across existing projects and new work.

Why do I need to verify web performance and visual output in a real browser instead of just running tests?▼

Real-browser verification catches visual regressions, accessibility gaps, and performance issues that automated tests miss, ensuring the frontend meets production-grade standards before release.

What is the best way to manage TypeScript usage and semantic HTML in a production-grade frontend project?▼

Adopt a frontend workflow that enforces TypeScript usage and semantic HTML as core requirements, integrating them into the build, test, and visual verification lifecycle to maintain production-grade quality.

When should I not use an automated build and test workflow for frontend development?▼

Skipping this workflow risks shipping visual regressions and accessibility gaps; it should always be used for frontend updates to guarantee performance, responsiveness, and visual correctness in a real browser.