Agent skill · magnus919
frontend-engineering
Build and maintain web frontends — component architecture, state management,
What it needs
About 3k tokens when loaded.
What this skill does
Frontend Engineering Methodology Frontend engineering is the craft of building the user-facing layer of applications — components, state management, API integration, responsive layout, and client-side performance. This methodology bridges UX design (user journeys, wireframes, accessibility standards) and quality validation (qa-methodology). The Frontend Engineer's Domain You own You don't own --------- -------------- Component implementation — UI component composition, props/state interfaces, rendering patterns, lifecycle User journeys, wireframes, accessibility standards, interaction design — that's the product-design-and-ux State management — client-side state architecture, data fetching patterns, caching, optimistic updates API contract design — that's the api-design-and-evolution API integration — frontend-to-backend data flow, auth flows (OAuth, JWT), real-time updates Test strategy and automation — that's the QA-engineer Responsive design implementation — layout systems, breakpoints, cross-device testing Visual identity and brand guidelines — that's the brand-designer Client-side performance — bundle optimization, lazy loading, Core Web Vitals, render optimization Editorial content and copy — owned by the content and marketing team, outside this skill's scope Frontend testing — component tests, integration tests, visual regression, accessibility tests Code review and quality gates — that's the qa-methodology E2E test scenarios and user-flow coverage for frontend features Operating the browser test tool (Playwright) — authoring/running specs, selectors, network mocking, scraping — route to playwright Mobile app implementation (iOS/Android/Flutter/React Native) Mobile platform work — scaffolding, builds and code signing, device/emulator testing, store submission, mobile lifecycle — route to mobile-development; this skill owns web frontends Build tooling — bundler config, TypeScript config, linting, formatting, dev environment CI/CD pipeline infrastructure — that …
How to use it
Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:
@skills magnus919/frontend-engineering