jh941213/my-claude-code-asset

Master REST and GraphQL API design principles to build intuitive, scalable, and maintainable APIs that delight developers. Use when designing new APIs, reviewing API specifications, or establishing API design standards.

Master Python asyncio, concurrent programming, and async/await patterns for high-performance applications. Use when building async APIs, concurrent systems, or I/O-bound applications requiring non-blocking operations.

TypeScript 및 빌드 에러를 점진적으로 수정. "빌드 에러", "build error", "컴파일 에러" 키워드에 활성화.

변경사항 커밋, 푸시, PR 생성을 한 번에 수행. "커밋", "PR", "푸시" 키워드에 활성화.

컨텍스트 관리 가이드. "컨텍스트", "토큰", "compact" 키워드에 활성화.

agent-browser CLI를 활용한 E2E 테스트 자동화. 스냅샷 기반 접근성 트리와 ref 시스템으로 안정적인 브라우저 테스트를 수행합니다. "E2E", "브라우저 테스트", "agent-browser" 키워드에 활성화.

Create production-ready FastAPI projects with async patterns, dependency injection, and comprehensive error handling. Use when building new FastAPI applications or setting up backend API projects.

빅테크 스타일(Stripe, Vercel, Apple) UI 개발. 플래닝 → 구현까지 한 번에. "프론트엔드", "UI 만들어", "페이지 만들어" 키워드에 활성화.

세션 종료 전 HANDOFF.md 작업 인계 문서 생성. "인계", "handoff", "세션 정리" 키워드에 활성화.

REQUIRED for all image generation requests. Generate and edit images using Nano Banana (Gemini CLI). Handles blog featured images, YouTube thumbnails, icons, diagrams, patterns, illustrations, photos, visual assets, graphics, artwork, pictures. Use this skill whenever the user asks to create, generate, make, draw, design, or edit any image or visual content.

복잡한 작업 전 계획 수립. Plan 모드에서 사용하거나 "계획", "플랜", "어떻게 구현" 등의 키워드에 자동 활성화.

Implement comprehensive testing strategies with pytest, fixtures, mocking, and test-driven development. Use when writing Python tests, setting up test suites, or implementing testing best practices.

현재 브랜치의 변경사항 코드 리뷰. "리뷰", "review", "검토" 키워드에 활성화.

Complete shadcn/ui component library guide including installation, configuration, and implementation of accessible React components. Use when setting up shadcn/ui, installing components, building forms with React Hook Form and Zod, customizing themes with Tailwind CSS, or implementing UI patterns like buttons, dialogs, dropdowns, tables, and complex form layouts.

코드 단순화 및 리팩토링. "단순화", "simplify", "리팩토링" 키워드에 활성화.

Stitch 프로젝트를 분석하여 DESIGN.md 파일을 생성합니다. 디자인 시스템을 시맨틱하고 자연스러운 언어로 문서화하여 일관된 UI 생성을 지원합니다. "Stitch", "디자인 시스템", "DESIGN.md" 키워드에 활성화.

모호한 UI 아이디어를 Stitch에 최적화된 상세 프롬프트로 변환합니다. 구체성 향상, UI/UX 키워드 추가, 디자인 시스템 컨텍스트 주입. "프롬프트 향상", "Stitch 프롬프트", "UI 아이디어" 키워드에 활성화.

Stitch를 사용하여 자율적으로 멀티 페이지 웹사이트를 생성하는 반복 빌드 루프 패턴. "Stitch 루프", "웹사이트 생성", "멀티 페이지" 키워드에 활성화.

Stitch 스크린을 React 컴포넌트 시스템으로 변환합니다. 디자인 토큰 일관성과 자동 검증을 포함합니다. "Stitch React", "컴포넌트 변환", "React 변환" 키워드에 활성화.

Build scalable design systems with Tailwind CSS, design tokens, component libraries, and responsive patterns. Use when creating component libraries, implementing design systems, or standardizing UI patterns.

테스트 주도 개발 - 테스트 먼저 작성 후 구현. "TDD", "테스트 먼저", "테스트 주도" 키워드에 활성화.

UI/UX design intelligence. 50 styles, 21 palettes, 50 font pairings, 20 charts, 9 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui). Actions: plan, build, create, design, implement, review, fix, improve, optimize, enhance, refactor, check UI/UX code. Projects: website, landing page, dashboard, admin panel, e-commerce, SaaS, portfolio, blog, mobile app, .html, .tsx, .vue, .svelte. Elements: button, modal, navbar, sidebar, card, table, form, chart. Styles: glassmorphism, claymorphism, minimalism, brutalism, neumorphism, bento grid, dark mode, responsive, skeuomorphism, flat design. Topics: color palette, accessibility, animation, layout, typography, font pairing, spacing, hover, shadow, gradient. Integrations: shadcn/ui MCP for component search and examples.

React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js code to ensure optimal performance patterns. Triggers on tasks involving React components, Next.js pages, data fetching, bundle optimization, or performance improvements.

작업 완료 후 코드 검증 (타입체크, 린트, 테스트, 빌드). "검증", "verify", "테스트", "빌드" 키워드에 활성화.