By rungchan2
프론트엔드 개발 생산성 스킬 모음: 프로젝트 구조 설정, CLAUDE.md 리팩토링, 스킬 생성 가이드, Notion 가이드 문서 생성
CLAUDE.md 메모리 파일 리팩토링 및 정리 스킬. 기존 CLAUDE.md 분석, 구조 개선, 컨텍스트 효율성 최적화를 수행합니다. 트리거: CLAUDE.md 리팩토링, CLAUDE.md 정리, 메모리 파일 개선, 프로젝트 가이드 최적화, CLAUDE.md 분석, 클로드 가이드 작성, CLAUDE.md 작성 도와줘.
Design System 문서 작성 가이드. 일관된 UI/UX를 위한 디자인 규칙과 컴포넌트를 정의한다. 사용자가 "디자인 시스템 만들어줘", "UI 가이드라인 정리해줘", "컬러/타이포그래피 정의해줘", "컴포넌트 스타일 가이드 만들어줘" 등을 요청할 때 사용한다.
Place 프로젝트 사용자 가이드를 Notion에 생성하는 스킬. 테이블, 색상, 코드블록, 화살표, 이모지를 활용한 가시성 높은 문서 생성. "가이드 만들어줘", "사용자 매뉴얼 작성해줘", "도움말 문서 생성해줘", "Notion에 문서 작성해줘" 요청 시 사용. Notion MCP (MCP_DOCKER) 필요.
MVP Roadmap 문서 작성 가이드. 개발 순서, 마일스톤, 스프린트 계획을 정의한다. 사용자가 "로드맵 만들어줘", "개발 일정 정리해줘", "MVP 계획 세워줘", "스프린트 계획 만들어줘" 등을 요청할 때 사용한다.
PRD(Product Requirements Document) 작성 가이드. 서비스의 핵심 가치, 타겟 사용자, 해결하려는 문제를 명확히 정의하는 문서를 생성한다. 사용자가 "PRD 만들어줘", "제품 요구사항 정리해줘", "서비스 기획서 작성해줘", "프로젝트 정의서 만들어줘" 등을 요청할 때 사용한다.
Own this plugin?
Verify ownership to unlock analytics, metadata editing, and a verified badge. GitHub access is read-only (username + org membership).
Sign in to claimOwn this plugin?
Verify ownership to unlock analytics, metadata editing, and a verified badge. GitHub access is read-only (username + org membership).
Sign in to claimBased on adoption, maintenance, documentation, and repository signals. Not a security audit or endorsement.
AI Native Engineer를 위한 프론트엔드 개발 생산성 스킬 모음.
Claude Code에서 반복적인 작업을 자동화하고, 프로젝트 설정 및 문서화를 효율화하는 커스텀 스킬들을 제공합니다.
| 스킬 | 설명 |
|---|---|
| skill-creator | 새로운 Claude 스킬 생성 가이드 및 도구 |
| claude-refactoring | CLAUDE.md 파일 분석, 리팩토링, 최적화 |
| project-scaffolder | 프론트엔드 프로젝트 구조 분석 및 아키텍처 문서화 |
| guide-maker | Notion에 사용자 가이드 문서 자동 생성 (MCP 필요) |
마켓플레이스에서 설치:
/plugin marketplace add <username>/frontend-skills
/plugin install frontend-skills@<username>-frontend-skills
또는 직접 설치:
/plugin install github:<username>/frontend-skills
설치 후 자연어로 스킬 사용:
"프로젝트 구조 잡아줘" → project-scaffolder
"CLAUDE.md 리팩토링해줘" → claude-refactoring
"새 스킬 만들어줘" → skill-creator
"가이드 문서 만들어줘" → guide-maker
frontend-skills/
├── .claude-plugin/
│ └── marketplace.json # 플러그인 설정
├── skills/
│ ├── skill-creator/ # 스킬 생성 가이드
│ ├── claude-refactoring/ # CLAUDE.md 리팩토링
│ ├── project-scaffolder/ # 프로젝트 구조화
│ └── guide-maker/ # Notion 가이드 생성
├── docs/ # 참고 문서
├── CLAUDE.md
└── README.md
skill-creator 스킬을 사용하거나 수동으로 생성:
# 스킬 초기화
python skills/skill-creator/scripts/init_skill.py my-skill --path ./skills
# 스킬 패키징
python skills/skill-creator/scripts/package_skill.py ./skills/my-skill
Apache 2.0
npx claudepluginhub rungchan2/frontend-skills --plugin claudemdFetch web pages and save them as clean Markdown files into docs/ directory.
rungchan2Notion 사용자 가이드 생성. 테이블, 색상, 코드블록을 활용한 가시성 높은 문서 생성. Notion MCP 필요.
rungchan2프론트엔드 프로젝트 구조 분석 및 AI 에이전트용 컨텍스트 문서 생성
rungchan2자연어 E2E 테스트 프레임워크. agent-browser CLI로 브라우저 테스트를 자동 실행. 시나리오 파일 기반, human-in-the-loop 지원.
rungchan2Frontend development skill with design and implementation checklists
JNLeiCreate skills from documentation folders and project codebases. Review, test, and package Anthropic Agent Skills for Claude.ai and Claude Code. 13 commands including from-docs, from-project, beginner tutorial, interactive wizard, templates, quality auditing, and distribution packaging.
vcode-shUltra-compressed communication mode. Cuts ~75% of tokens while keeping full technical accuracy by speaking like a caveman.
JuliusBrusseeFrontend design skill for UI/UX implementation
anthropicsComprehensive UI/UX design plugin for mobile (iOS, Android, React Native) and web applications with design systems, accessibility, and modern patterns
wshobsonMemory compression system for Claude Code - persist context across sessions
thedotmack