메뉴
Implement or modify frontend features in the React app with correct service boundaries, shared UI usage, and matching tests. Use when asked to add pages, components, API integrations, or state/UI behavior in apps/frontend.
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
SOC 직업 분류 기준
Add or update Playwright E2E tests for backend APIs or frontend UI in this monorepo. Use when asked for end-to-end verification, cross-service test coverage, or deterministic integration tests.
Diagnose and fix failing CI checks in this Nx polyglot monorepo. Use when asked to investigate GitHub Actions failures, pre-push issues, or failing affected lint/test/build targets.
Update and validate OpenAPI specs when backend API contracts change. Use when adding/changing endpoints, DTOs, response schemas, or auth requirements in api-go or api-java.
Add or update a backend API endpoint in this polyglot monorepo. Use when asked to create REST endpoints, handlers/controllers, request or response DTOs, service logic, routes, OpenAPI updates, and matching tests.
Author, validate, and document Postgres schema migrations in this monorepo. Use when asked to add tables/columns/indexes, modify schema, or prepare rollback-safe DB changes.
| name | add-frontend-feature |
| description | Implement or modify frontend features in the React app with correct service boundaries, shared UI usage, and matching tests. Use when asked to add pages, components, API integrations, or state/UI behavior in apps/frontend. |
Use this skill when building or updating UI behavior in apps/frontend.
From docs/polyglot-architecture.md:
Do not introduce new API calls to the wrong service.
libs/ui-shared first for reusable primitives.Typical touch points:
apps/frontend/src/App.tsxapps/frontend/src/pages/*apps/frontend/src/components/*Keep components focused and avoid unrelated refactors.
apps/frontend/src/**/*.spec.tsx.apps/frontend-e2e specs.pnpm nx run frontend:lintpnpm nx run frontend:testnpm run test:e2e:frontend (when flow spans full app behavior)Run hooks if required by workflow:
npm run hooks:run:pre-commitnpm run hooks:run:pre-push