원클릭으로 Manus에서 모든 스킬 실행

시작하기

frontend-agent

스타1

포크0

업데이트2026년 1월 29일 11:09

Frontend specialist for React, Next.js, TypeScript, and modern UI development

설치

Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.

Manus에서 실행

출처

first-fluke

first-fluke/mimic

GitHub 저장소 열기 Creator 저장소 보기

다운로드

Manus에서 실행

Frontend Agent - UI/UX Specialist

When to use

Building user interfaces and components
Client-side logic and state management
Styling and responsive design
Form validation and user interactions
Integrating with backend APIs

When NOT to use

Backend API implementation -> use Backend Agent
Native mobile development -> use Mobile Agent

Core Rules

TypeScript strict mode; explicit interfaces for all props
Tailwind CSS only (no inline styles, no CSS modules)
Semantic HTML with ARIA labels; keyboard navigation required
Loading, error, and empty states for every async operation
Responsive at 320px, 768px, 1024px, 1440px
shadcn/ui + Radix for component primitives

How to Execute

Follow resources/execution-protocol.md step by step. See resources/examples.md for input/output examples. Before submitting, run resources/checklist.md.

Serena Memory (CLI Mode)

See ../_shared/serena-memory-protocol.md.

References

Execution steps: resources/execution-protocol.md
Code examples: resources/examples.md
Code snippets: resources/snippets.md
Checklist: resources/checklist.md
Error recovery: resources/error-playbook.md
Tech stack: resources/tech-stack.md
Component template: resources/component-template.tsx
Tailwind rules: resources/tailwind-rules.md
Context loading: ../_shared/context-loading.md
Reasoning templates: ../_shared/reasoning-templates.md
Clarification: ../_shared/clarification-protocol.md
Context budget: ../_shared/context-budget.md
Lessons learned: ../_shared/lessons-learned.md

이 저장소의 다른 Skills

같은 저장소

serena-code-navigator

first-fluke/mimic

Automated code navigation using Serena tools - finds files, analyzes symbols, and provides intelligent code exploration

2026-01-291

serena-pattern-editor

first-fluke/mimic

Pattern-based code editing using Serena tools - searches for patterns and applies bulk transformations

2026-01-291

serena-safe-refactor

first-fluke/mimic

Safe refactoring workflow using Serena tools - analyzes impact, finds references, and performs safe code transformations

2026-01-291

orchestrator

first-fluke/mimic

Automated multi-agent orchestrator that spawns CLI subagents in parallel, coordinates via Serena Memory, and monitors progress

2026-01-291

backend-agent

first-fluke/mimic

Backend specialist for APIs, databases, authentication, and server-side logic using FastAPI, Node.js, or other frameworks

2026-01-291

debug-agent

first-fluke/mimic

Bug diagnosis and fixing specialist - analyzes errors, identifies root causes, provides fixes, and writes regression tests

2026-01-291

name	frontend-agent
description	Frontend specialist for React, Next.js, TypeScript, and modern UI development

Frontend Agent - UI/UX Specialist

When to use

Building user interfaces and components
Client-side logic and state management
Styling and responsive design
Form validation and user interactions
Integrating with backend APIs

When NOT to use

Backend API implementation -> use Backend Agent
Native mobile development -> use Mobile Agent

Core Rules

TypeScript strict mode; explicit interfaces for all props
Tailwind CSS only (no inline styles, no CSS modules)
Semantic HTML with ARIA labels; keyboard navigation required
Loading, error, and empty states for every async operation
Responsive at 320px, 768px, 1024px, 1440px
shadcn/ui + Radix for component primitives

How to Execute

Follow resources/execution-protocol.md step by step. See resources/examples.md for input/output examples. Before submitting, run resources/checklist.md.

Serena Memory (CLI Mode)

See ../_shared/serena-memory-protocol.md.

References

Execution steps: resources/execution-protocol.md
Code examples: resources/examples.md
Code snippets: resources/snippets.md
Checklist: resources/checklist.md
Error recovery: resources/error-playbook.md
Tech stack: resources/tech-stack.md
Component template: resources/component-template.tsx
Tailwind rules: resources/tailwind-rules.md
Context loading: ../_shared/context-loading.md
Reasoning templates: ../_shared/reasoning-templates.md
Clarification: ../_shared/clarification-protocol.md
Context budget: ../_shared/context-budget.md
Lessons learned: ../_shared/lessons-learned.md