Recipes

Claude Code를 위한 브랜드 및 웹사이트 라이프사이클 스킬 라이브러리

README 링크에서 발견 · 2 days ago

Research & KnowledgeSoftware & DevOps

브랜드, SEO, 개발, 운영, 성장을 아우르는 107개의 스택 독립적인 Claude Skills.

What they did

메인테이너들은 브랜드와 웹사이트를 구축하고, 출시하고, 성장시키는 전체 라이프사이클을 아우르는 107개의 Claude Skills를 담은, 관점이 뚜렷하고 스택에 구애받지 않는 카탈로그를 구성했습니다. 브랜드와 디자인, 콘텐츠, SEO, 개발, 운영, 성장, 리서치가 포함됩니다. 각 스킬은 SKILL.md(지침과 YAML 메타데이터)와 선택적 참조 파일(템플릿, 체크리스트, 예제 등)로 이루어진 폴더로, 요청이 설명과 일치하면 Claude가 필요할 때 해당 스킬을 로드합니다. 이들은 카탈로그를 Claude Code 플러그인 마켓플레이스로 패키징하여 전체 설치와 집중 서브셋(starter, SEO, PM), 그리고 큐레이션된 서브셋만 나열하는 더 가벼운 마켓플레이스를 제공했습니다. 또한 Ahrefs MCP 기반 SEO 감사 제품군, 권장 MCP, 작성 규칙, 저장소 구조, 신뢰/보안 관련 사항을 문서화했으며, 해당 스킬이 Next.js, WordPress, Shopify, Webflow, 순수 HTML에서 작동하는 모습을 보여주었습니다.

How it went

MIT 라이선스의 공개 repo로 배포되며, 작동하는 플러그인 마켓플레이스, 여러 설치 경로, 문서화된 107개 스킬 카탈로그를 갖추고 있습니다. awesome-claude-skills의 Business & Marketing 항목에 소개되었으며, 로고 디자인과 레퍼런스 빌드 같은 구체적인 예시를 포함합니다. 문서화와 패키징의 완성도는 높은 편이지만, 스킬 품질은 항목마다 차이가 있으며 기반 모델과 연결된 MCP에 따라 달라집니다.

Worth knowing

Skills는 프롬프트 및 참조 패키지이지 실행 가능한 코드가 아니므로, 출력 품질은 모델과 Ahrefs 같은 MCP가 구성되어 있는지에 따라 달라집니다. 카탈로그는 주관적이고 광범위하므로, 모든 것을 설치하면 집중된 하위 집합에 비해 컨텍스트 오버헤드가 추가됩니다. README는 스킬별 테스트나 버전 관리를 자세히 설명하지 않으며, SEO 감사 결과를 얻으려면 유효한 Ahrefs 자격 증명과 할당량이 필요합니다.

Wiring

Claude Code에서 `/plugin marketplace add rampstackco/claude-skills`를 실행한 다음, 전체 카탈로그를 원하면 `/plugin install rampstack-skills@rampstack`을, 일부만 원하면 `rampstack-starter@rampstack`, `rampstack-seo@rampstack`, `rampstack-pm@rampstack`을 실행하세요. 또는 더 가벼운 마켓플레이스 목록으로 엄선된 서브셋만 제공하는 `rampstackco/plugins`를 추가할 수도 있습니다. 스킬은 필요할 때 로드됩니다. 각 스킬은 Claude가 필요로 하기 전까지 대략 이름과 설명만 기여합니다. SEO 감사 제품군의 경우, 감사 스킬을 실행하기 전에 API 키로 Ahrefs MCP 서버를 구성하세요. 스킬은 스택에 구애받지 않으므로, Claude에게 Next.js, WordPress, Shopify, Webflow 또는 정적 HTML 리포지토리를 지정하면 설명을 기반으로 일치하는 스킬을 선택합니다.

Try it yourself

I can't install plugins or run commands in this conversation, and I don't have access to your repo, homepage copy, or metadata. So I can't actually load skills, read the catalog, or produce a real audit. Here's what I can do instead: give you the exact steps to run yourself, plus a framework for the brand/SEO pass you can apply once you paste in the relevant files.

## 1. Install the marketplace and starter subset

Run these in Claude Code (adjust if the repo name differs):

```bash
# Add the marketplace
/plugin marketplace add rampstackco/claude-skills

# Install the starter subset
/plugin install rampstack-starter@rampstack
```

Then verify with `/plugin` to see what's loaded. If `rampstack-starter` isn't the exact plugin name, list available plugins from the marketplace first.

## 2. How to pick skills from the catalog

Once installed, ask Claude Code to read the catalog (usually a `marketplace.json` or `README` in the plugin dir) and match skills to your repo. A reasonable selection heuristic for a brand/SEO pass:

- **Brand/voice skill** — if the catalog has one (e.g., `brand-voice`, `copywriting`), load it to audit homepage tone and positioning.
- **SEO/metadata skill** — for title tags, meta descriptions, headings, structured data.
- **Content strategy skill** — for the keyword and content plan.
- **Code-review/diff skill** — to keep changes minimal and file-scoped.

Ask it explicitly: *"Read the catalog, list skills relevant to a brand + SEO audit of a marketing homepage, and explain why each applies before loading."*

## 3. Brand & SEO pass — what to hand me

To do this for real, paste or point me at:

- Homepage component(s) — e.g., `app/page.tsx`, `pages/index.*`, or the marketing route
- Metadata source — `layout.tsx` metadata export, `next-seo` config, `_document`, `index.html` `<head>`, or a CMS content file
- `package.json` (to confirm framework and routing)
- Any existing `sitemap`, `robots.txt`, or OG image setup

## 4. Audit framework (apply once I have the files)

**Homepage copy**
- Value prop in first screen: who it's for, what it does, why it's different — in one sentence
- Headline clarity vs. cleverness; subhead that earns the click
- CTA hierarchy (primary vs. secondary), above the fold
- Proof (logos, metrics, testimonials) placement
- Consistency of product name/terminology (keep `runchr`, `Remingle`, `MCP`, `RAG` etc. as-is per glossary)

**Metadata**
- `<title>`: primary keyword + brand, ≤60 chars
- `meta description`: benefit + differentiator, ≤155 chars
- OG/Twitter cards: title, description, image present and correct
- Canonical URL, `lang`, favicon
- Structured data (Organization, WebSite, SoftwareApplication as applicable)

**Keyword & content plan**
- 1 primary + 3–5 secondary keywords mapped to homepage sections
- 3–5 supporting content pieces (docs, comparison, use-case) with target intent
- Internal linking from homepage to those pieces

**File-level changes (minimal diff)**
- List each file, the exact lines/sections to change, and why
- Prefer editing existing metadata exports over adding new files
- No refactors, no restyling — copy and metadata only unless a structural fix is required

## 5. What I need from you to proceed

Reply with the homepage file(s) and metadata source (or a link/paste), and confirm the framework (Next.js? Astro? plain HTML?). I'll then return:

- The skill list I'd load and why (based on the catalog you paste)
- A copy audit with specific rewrites
- A keyword/content plan
- A file-by-file diff proposal, kept minimal

If you'd rather I work from a description, paste the current homepage copy and `<head>` contents and I'll do the audit against that.

Source

English

Tools in this stack