본문으로 건너뛰기
cccskills
무료GitHub에 공개

frontend-patterns

Context enrichment for frontend UI development using shadcn/ui and Tailwind CSS. Use when building component libraries, implementing UI designs, theming, or working with accessible React components.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

rsmdt/the-startup스타 575(GitHub 575 + cccskills 0)

실행 점수 미검증

설치 방법 보기

포함된 파일(1)

  • SKILL.md1.7 KB

SKILL.md(원문)

설치하기 전에 에이전트에게 전달되는 지시 내용을 확인할 수 있습니다.

Persona

Act as a frontend UI specialist who enriches implementation context with current component library documentation and design system patterns.

UI Target: $ARGUMENTS

Interface

FrontendContext { frameworks: string[] concern: COMPONENTS | THEMING | LAYOUT | FORMS | DATA_DISPLAY | ACCESSIBILITY }

State { target = $ARGUMENTS detectedFrameworks = [] }

Constraints

Always:

  • Detect which UI frameworks are in use before fetching documentation.
  • Recommend component composition over custom implementations when available.

Never:

  • Assume component APIs without consulting current documentation.
  • Recommend custom components when a library component exists for the use case.

References

  • shadcn/ui — Accessible React components, theming, form handling, CLI tooling, Radix UI primitives
  • Tailwind CSS — Utility-first CSS, responsive design, custom configuration, dark mode (no llms.txt available)

Workflow

1. Detect Framework Need

Identify which frameworks are relevant from the UI target. Fetch the corresponding reference documentation.

2. Synthesize Context

Combine fetched documentation into actionable guidance:

  • Available components and their APIs for the target use case.
  • Theming tokens and customization approach.
  • Accessibility features built into components.

3. Deliver Enriched Context

Provide framework-specific guidance integrated with the UI target.

리뷰

아직 리뷰가 없습니다. 사용해 본 소감을 남겨 주세요.

댓글

로그인 없이 쓸 수 있습니다. 사용 후기, 질문, 작동하지 않은 환경 등을 편하게 남겨 주세요.

아직 댓글이 없습니다. 첫 댓글을 남겨 보세요.

보내면 바로 공개됩니다. 이메일 주소나 전화번호 같은 개인 정보는 쓰지 마세요. URL은 2개까지입니다.

0 / 1,000자

이 양식은 reCAPTCHA로 보호되며 Google 개인정보처리방침 및 서비스 약관이 적용됩니다.

같은 저장소의 스킬

Context enrichment for agentic AI application development using LangChain, Vercel AI SDK, and assistant-ui. Use when building AI agents, chat interfaces, tool-calling pipelines, RAG systems, or multi-step AI workflows.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

rsmdt/the-startup5752026년 10월 25일 업데이트

analyze

무료

Deep-research analysis of a codebase, a topic, or both. Clarifies the question, agrees the research angles with you, then runs a dynamic workflow that gathers cited claims per angle, merges duplicates, has independent skeptics try to refute every claim, and writes one cited report from the claims that survived. Use for "how does X work", "map the Y flow", "research Z", or any mechanism-level question that must be evidence-backed.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

rsmdt/the-startup5752026년 10월 25일 업데이트

REST and GraphQL API design patterns, OpenAPI/Swagger specifications, versioning strategies, and authentication patterns. Use when designing APIs, reviewing API contracts, evaluating API technologies, or implementing API endpoints.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

rsmdt/the-startup5752026년 10월 25일 업데이트

System architecture patterns including monolith, microservices, event-driven, and serverless, with C4 modeling, scalability strategies, and technology selection criteria. Use when designing system architectures, evaluating patterns, or planning scalability.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

rsmdt/the-startup5752026년 10월 25일 업데이트

archive

무료

Consolidate a completed specification into a single archived record and remove its working directory. Use as the final stage after implementation — distills requirements + solution into .start/archive/[NNN]-[name].md and deletes the .start/specs/[NNN]-[name]/ directory.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

rsmdt/the-startup5752026년 10월 25일 업데이트

Required first step before any creative work — creating features, building components, adding functionality, or modifying behavior. Explores user intent, requirements, and design before implementation.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

rsmdt/the-startup5752026년 10월 25일 업데이트

rsmdt의 스킬 모두 보기

이 스킬의 문제 신고