클로드 코드를 시니어 개발자로 만드는 무료 플러그인 5개 — 설치 명령어·첫 프롬프트 정리

클로드 코드를 시니어 개발자처럼 일하게 만드는 무료 오픈소스 5개를 모았어요. 깃허브 별을 다 합치면 40만 개가 넘어요(2026-11-07 기준 402,083개).
각 도구마다 README에 적힌 공식 설치 명령어, 언제 쓰면 좋은지, 설치하고 바로 붙여 넣는 첫 프롬프트를 정리했어요.

한눈에 보기

설치 위치 팁: 아래 명령은 터미널에서 실행하는 것과 클로드 코드 안에서 입력하는 것(/plugin ...)이 섞여 있어요. 각 단계에 어디서 치는지 적어 뒀어요. 설치 후에는 클로드 코드를 껐다 켜야 새 스킬·명령어가 보여요.

1. 에이전트 스킬즈 (agent-skills) — 단계마다 맞는 스킬이 알아서 켜져요

무엇인지: 구글 출신 엔지니어링 리더가 만든 스킬 25개 묶음이에요. 시니어 엔지니어가 쓰는 작업 순서와 품질 기준(스펙 먼저, 작은 단위로, 테스트로 증명, 리뷰, 출시 체크리스트)을 클로드가 그대로 따르게 해 줘요. 구글 엔지니어링 문화(Software Engineering at Google 등)의 원칙이 들어가 있어요.

설치 (클로드 코드 추천 방법 — 클로드 코드 안에서 입력)

/plugin marketplace add addyosmani/agent-skills
/plugin install agent-skills@addy-agent-skills

더 빠른 방법 (터미널)

npx skills add addyosmani/agent-skills

• SSH 오류가 나면 첫 줄을 /plugin marketplace add https://github.com/addyosmani/agent-skills.git 으로 바꾸세요.

슬래시 명령어 9개

언제 쓰나요: 새 기능을 처음부터 만들 때, 클로드가 테스트·스펙을 건너뛰고 대충 짜는 게 불안할 때, 혼자 개발하는데 리뷰어가 없을 때.

첫 프롬프트 (복사해서 붙여 넣기)

/spec 동네 헬스장 회원권 예약 웹앱을 만들고 싶어. 회원은 수업을 예약·취소하고, 관리자는 수업을 열고 닫을 수 있어야 해. 모르는 건 하나씩 물어봐 줘

/plan 방금 만든 스펙을 하루 안에 끝낼 수 있는 작은 작업으로 쪼개 줘

/build auto

• /build auto는 계획을 한 번 승인하면 작업마다 테스트를 먼저 쓰고 하나씩 커밋하면서 끝까지 진행해요. 실패하거나 위험한 단계에서는 멈춰요.

2. 컨텍스트7 (context7) — 최신 공식 문서로 코딩해요

무엇인지: AI는 오래된 학습 데이터로 코드를 짜서, 이미 바뀐 문법이나 존재하지도 않는 API를 쓰는 일이 많아요. 컨텍스트7은 라이브러리의 최신·버전별 공식 문서와 예제 코드를 그 자리에서 가져와 클로드에게 넣어 줘요.

설치 (터미널, Node.js 22.13 이상)

npx ctx7 setup --claude

• 브라우저 로그인(OAuth) → API 키 자동 발급 → 스킬 설치까지 한 번에 해요. CLI + Skills 방식과 MCP 방식 중 고를 수 있어요.
• 무료 API 키를 쓰면 요청 한도가 넉넉해져요(context7.com/dashboard).
• 지우기: npx ctx7 remove

언제 쓰나요: Next.js, Supabase, Tailwind처럼 버전이 자주 바뀌는 라이브러리로 코드를 짤 때. 클로드가 짠 코드가 "그런 함수 없음" 오류를 낼 때.

첫 프롬프트

쿠키에 유효한 JWT가 있는지 확인하고, 없으면 /login 으로 보내는 Next.js 프록시를 만들어 줘. use context7

Supabase 이메일·비밀번호 회원가입 API 사용법을 최신 문서로 보여 줘. use library /supabase/supabase

Next.js 16 기준으로 프록시 설정하는 법 알려 줘. use context7

• 프롬프트 끝에 use context7을 붙이면 최신 문서를 찾아와요. 라이브러리 ID(/supabase/supabase)를 알면 바로 지정할 수 있고, 버전을 말하면 그 버전 문서를 가져와요.

3. 그래피파이 (graphify) — 프로젝트 전체를 지도 하나로

무엇인지: 프로젝트의 코드, 문서, SQL 스키마(DB 구조), 설정, PDF까지 지식 그래프(지도) 하나로 묶어요. 클로드가 파일을 하나씩 grep 하는 대신 지도를 따라가며 질문에 답해요. 코드는 내 컴퓨터에서만 분석(AST)하고 밖으로 나가지 않아요. 벡터 DB가 아니라 진짜 그래프라 "A와 B가 어떻게 연결돼?" 같은 질문에 강해요.

설치 (터미널, Python 3.10+ 와 uv 또는 pipx 필요, 약 30초)

uv tool install graphifyy
graphify install

• 패키지 이름은 graphifyy(y 두 개)예요.
• graphify install이 클로드 코드를 알아서 찾아 /graphify 스킬을 등록해요. 이 저장소에만 깔고 싶으면 graphify install --project.

언제 쓰나요: 남이 만든 큰 저장소를 처음 받았을 때, 오래된 내 프로젝트 구조가 기억 안 날 때, "이 두 함수가 어떻게 이어져 있지?"를 알고 싶을 때.

첫 프롬프트 (클로드 코드 안에서)

/graphify .

그래프를 보고 이 프로젝트의 핵심 개념 5개와 서로 어떻게 연결되는지 한국어로 설명해 줘

로그인 기능에서 결제 기능까지 코드가 어떤 경로로 연결되는지 그래프로 추적해 줘

• 실행하면 graphify-out/ 폴더에 graph.html(브라우저로 열면 클릭되는 지도), GRAPH_REPORT.md(핵심 요약), graph.json(전체 그래프)이 생겨요.
• 터미널에서도 바로 물어볼 수 있어요: graphify explain "함수이름", graphify path "A" "B", graphify query "질문".

4. 매직 (magic-mcp → 21st MCP) — 컴포넌트 1만 개+ 검색해서 화면 만들기

무엇인지: 21st.dev의 리액트·테일윈드 컴포넌트 1만 개 이상을 클로드 코드 안에서 검색해서 가져다 쓰게 해 주는 MCP예요. "v0를 내 에디터 안에서 쓰는 느낌"이에요. 지금은 이름이 21st MCP로 바뀌었고, 예전 magic 설정도 계속 작동해요.

설치 (터미널)

npx @21st-dev/cli@latest init --client claude

플러그인으로 설치하는 방법 (터미널 → 클로드 코드)

claude plugin marketplace add 21st-dev/magic-mcp

그다음 클로드 코드 안에서 /plugin install 21st, API 키는 API_KEY_21ST 환경변수에 넣어요.

• 무료 API 키는 21st.dev/mcp 에서 받아요. 예전 Magic 키는 초기화돼서 새로 받아야 해요.
• 컴포넌트 검색·가져오기(search, get_component) 는 무료 키로 되고, 21st 쪽 AI 생성(generate) 은 AI 기능이 켜진 계정에서만 보여요. 그 경우엔 가져온 컴포넌트를 클로드가 직접 고쳐 쓰게 하면 돼요.

언제 쓰나요: 랜딩 페이지·대시보드 화면을 빨리 만들어야 할 때, 클로드가 만든 UI가 밋밋할 때.

첫 프롬프트

21st에서 가격표(pricing) 컴포넌트를 검색해서 3개 후보를 보여 주고, 제일 깔끔한 걸 우리 앱 /pricing 페이지에 넣어 줘

21st에서 SaaS 랜딩 페이지 히어로 섹션 컴포넌트를 찾아서 우리 브랜드 색(#FF5A1F)으로 바꿔 줘

21st에서 로그인 폼 컴포넌트를 찾아서 지금 프로젝트의 테일윈드 설정에 맞게 붙여 줘

5. 스트릭스 (strix) — 내 앱을 직접 공격해 보안 구멍을 찾아요

무엇인지: 오픈소스 AI 침투 테스트(펜테스트) 도구예요. AI 에이전트들이 실제 해커처럼 앱을 직접 돌려 보고 공격해서 취약점을 찾고, 실제로 뚫리는지 증거(PoC)까지 확인한 다음 고치는 방법(패치)을 알려 줘요. SQL 인젝션, XSS, 권한 우회, 결제 로직 오류 등 OWASP Top 10을 봐요.

설치 (터미널, 도커 실행 중이어야 해요)

curl -sSL https://strix.ai/install | bash

export STRIX_LLM="vercel_ai_gateway/zai/glm-5.3"   # README 예시. 쓰는 AI 제공사/모델로 바꾸세요 (지원 목록: docs.strix.ai)
export LLM_API_KEY="내-API-키"
strix --target ./app-directory

클로드 코드에서 스킬로 쓰기 (터미널)

npx skills add usestrix/strix

• 펜테스트 실행, 발견한 문제 고치기, CI 스캔 설정용 스킬 9개가 깔려요.
• 도구 자체는 무료지만 AI 호출 비용은 내 LLM API 키로 나가요. 첫 실행 때 샌드박스 도커 이미지를 내려받아요. 결과는 strix_runs/ 폴더에 저장되고 strix view로 대시보드를 열 수 있어요.
• 내가 만들었거나 테스트 권한을 받은 앱에만 쓰세요. 남의 사이트를 허락 없이 스캔하면 불법이에요.

언제 쓰나요: 출시 직전, 로그인·결제가 있는 앱을 만들었을 때, PR마다 보안 검사를 자동으로 돌리고 싶을 때.

첫 프롬프트 (스킬 설치 후 클로드 코드에서)

strix로 이 저장소 코드를 보안 점검해 줘. 발견한 취약점은 심각도 순으로 정리하고, 하나씩 고쳐 줘

로컬에서 띄운 http://localhost:3000 을 strix로 블랙박스 테스트해 줘. 로그인 우회랑 결제 금액 조작을 특히 봐 줘

PR마다 strix 빠른 스캔(--scan-mode quick)이 돌도록 GitHub Actions 워크플로를 만들어 줘

이렇게 조합하면 좋아요

1. 그래피파이로 프로젝트 지도를 먼저 만들고 (/graphify .)
2. 에이전트 스킬즈 /spec → /plan으로 무엇을 만들지 정한 뒤
3. 코드를 짤 때 컨텍스트7(use context7)로 최신 문서를 쓰고
4. 화면은 매직(21st) 컴포넌트로 빠르게 채우고
5. 출시 전에 스트릭스로 보안 점검 → 에이전트 스킬즈 /review → /ship

자주 묻는 질문

• 설치했는데 명령어가 안 보여요 → 클로드 코드를 완전히 껐다 켜세요. /를 눌러 목록에 있는지 확인하세요. 클로드 앱(채팅)이 아니라 클로드 코드(터미널)용이에요.
• 특정 폴더에서만 보여요 → npx skills add를 프로젝트 폴더에서 실행하면 그 폴더에만 깔릴 수 있어요. 모든 프로젝트에서 쓰려면 /plugin install 방식이나 전역 설치(-g)를 쓰세요.
• 정말 다 무료예요? → 5개 모두 오픈소스예요. 다만 매직은 무료 API 키가 필요하고(컨텍스트7은 무료 키를 넣으면 사용 한도가 늘어나요), 스트릭스는 내 LLM API 키(또는 ChatGPT 구독·로컬 모델)로 돌아가요.
• /review가 두 개예요 → 에이전트 스킬즈 리뷰는 /agent-skills:review로 부르면 돼요.

링크

• 에이전트 스킬즈: https://github.com/addyosmani/agent-skills
• 컨텍스트7: https://github.com/upstash/context7
• 그래피파이: https://github.com/Graphify-Labs/graphify
• 매직(21st MCP): https://github.com/21st-dev/magic-mcp
• 스트릭스: https://github.com/usestrix/strix