이 새로운 기능으로 Claude Code가 모든 것을 바꿨습니다

채널 아이콘
Leon van Zyl 구독자 59,400명

요약

이 영상에서는 Claude Code의 플러그인 및 플러그인 마켓플레이스 기능을 소개하고, 이를 활용해 팀이나 오픈 소스 커뮤니티와 워크플로우를 손쉽게 공유하는 방법을 단계별로 보여줍니다. 먼저 Anthropic 공식 마켓플레이스를 설치·관리하는 과정을 시연하고, 이어서 UI 컴포넌트 MCP 서버를 포함한 개인 플러그인 데모로 기능을 확장하는 예제를 설명합니다. 마지막으로 빈 프로젝트에서 marketplace.json과 plugin.json을 작성해 자체 플러그인·마켓플레이스를 구축하고 GitHub에 배포해 자동 업데이트를 적용하는 법을 다룹니다. 이 기능을 통해 커스텀 슬래시 커맨드, 서브 에이전트, 훅, MCP 서버를 경량 패키지로 묶어 언제든 최신 상태로 유지할 수 있습니다.

주요 키워드

Claude Code 플러그인 마켓플레이스 슬래시 커맨드 서브 에이전트 MCP 서버 매니페스트 라이브 리로드 GitHub

하이라이트

  • 🔑 Claude Code의 플러그인 시스템은 슬래시 커맨드, 서브 에이전트, 훅, MCP 서버를 하나의 경량 패키지로 묶어 공유할 수 있게 해줍니다.
  • 🚀 /plugin 명령어 하나로 GitHub 저장소 기반 마켓플레이스를 추가하고 원하는 플러그인만 골라 설치·제거·비활성화할 수 있습니다.
  • ⚡️ 설치한 플러그인은 Claude Code 재실행만으로 자동 업데이트되어 별도 재설치 없이도 최신 변경사항이 즉시 반영됩니다.
  • 📌 공식 Anthropic 마켓플레이스 구조(.cloud-plugin/marketplace.json)와 plugins 폴더 배치 방식을 이해하면 다른 사용자의 워크플로우를 쉽게 가져올 수 있습니다.
  • 🌟 개인 저장소에 mcp.json을 포함한 UI 컴포넌트 플러그인을 만들어 팀원에게 공유하고 활성화하는 과정을 직접 확인할 수 있습니다.
  • 📦 자체 마켓플레이스 구축은 marketplace.json 매니페스트 파일에 이름, 버전, author, 포함 플러그인 목록만 정의하면 간단히 시작할 수 있습니다.
  • 🛠️ plugin.json으로 플러그인 매니페스트를 설정하고 commands·agents·mcp·hooks 폴더에 커스텀 도구를 추가해 기능을 확장하는 방법을 배웁니다.
  • 🔄 GitHub에 공개 저장소로 배포한 후 변경사항이 자동으로 프로젝트에 반영되도록 연결해두면 유지보수와 워크플로우 공유가 훨씬 수월해집니다.

용어 설명

플러그인(Plugin)

슬래시 커맨드, 서브 에이전트, 훅, MCP 서버 등을 하나로 묶어 경량 패키지 형태로 공유하는 단위

마켓플레이스(Marketplace)

여러 플러그인을 모아 배포·관리하는 저장소로, GitHub 리포지토리 형태로 구성됨

슬래시 커맨드(Slash Command)

Claude Code 내에서 사용하는 커맨드 입력 방식(예: /plugin, /mcp)

서브 에이전트(Sub-Agent)

특정 기능을 수행하도록 분리된 에이전트 모듈

훅(Hook)

작업 완료 등 이벤트에 맞춰 자동화 스크립트나 알림을 실행하는 구성 요소

MCP 서버(MCP Server)

외부 프로세스나 서버와 연동해 기능을 확장하는 Claude Code 구성 요소

매니페스트 파일(Manifest File)

marketplace.json 또는 plugin.json처럼 마켓플레이스·플러그인 정보를 정의하는 JSON 파일

라이브 리로드(Live Reload)

플러그인 변경사항을 별도 재설치 없이 Claude Code 재실행만으로 즉시 반영하는 기능

[00:00:00] 소개 및 새로운 플러그인 기능 개요

새롭게 추가된 플러그인 및 마켓플레이스 기능을 간략히 소개합니다. 슬래시 커맨드, 서브 에이전트, 훅, MCP 서버를 묶어 공유하는 개념과 주요 사용 사례를 설명합니다.

Claude Code의 새로운 플러그인과 플러그인 마켓플레이스 기능을 소개합니다. 이는 커스텀 명령어, 서브 에이전트, 훅, MCP 서버들을 번들로 묶어 팀이나 오픈소스 커뮤니티와 쉽게 공유할 수 있는 우아한 솔루션입니다.
영상에서는 두 가지 주요 내용을 다룹니다: 첫째, 플러그인을 다운로드하고 프로젝트에서 사용하는 방법, 둘째, 직접 플러그인과 마켓플레이스를 구축하는 방법을 설명합니다.
플러그인의 작동 원리를 설명합니다. 슬래시 플러그인 명령어를 통해 다른 개발자의 플러그인을 설치할 수 있고, Claude Code 마켓플레이스 URL을 전달하면 사용 가능한 모든 플러그인을 확인하고 원하는 것을 선택하여 자동 설치할 수 있습니다.
플러그인의 중요성과 미래 비전을 설명합니다. 플러그인은 Claude Code 커스터마이제이션의 표준 번들링 및 공유 방법이 될 것이며, 더 많은 확장 포인트가 추가되면서 지속적으로 발전할 예정입니다.
플러그인의 실용적인 사용 사례들을 제시합니다. 팀 멤버들과 MCP 서버와 에이전트의 큐레이트된 목록을 쉽게 공유하고, GitHub 배포를 통해 오픈소스 메인테이너들이 올바른 사용법을 보장하며, 숙련된 개발자들의 워크플로우를 공개적으로 공유할 수 있는 새로운 기회를 창출합니다.
[00:02:12] 공식 Anthropic 마켓플레이스 탐색

Anthropic 공식 GitHub 저장소 기반 마켓플레이스를 가져오는 과정을 살펴봅니다. 프로젝트 구조와 plugins 폴더, .cloud-plugin/marketplace.json의 역할을 확인합니다.

실제 프로젝트에서 마켓플레이스와 플러그인을 사용하는 방법을 살펴보고, 이어서 직접 플러그인과 마켓플레이스를 만드는 방법을 시연할 예정임을 안내합니다.
Anthropic에서 개발한 Claude Code 마켓플레이스 GitHub 저장소를 소개하며, plugins 폴더 내에 agent SDK, commit commands, feature dev 등 다양한 플러그인들이 포함되어 있음을 보여줍니다.
프로젝트 루트의 .cloud plugin 폴더 안에 있는 marketplace.json 파일이 이 GitHub 저장소가 Claude Code 마켓플레이스임을 나타내며, 이 URL을 통해 마켓플레이스를 설치할 수 있음을 설명합니다.
[00:03:27] 플러그인 설치 및 관리

/plugin 명령으로 마켓플레이스 URL을 추가하고 플러그인을 설치하는 과정을 단계별로 시연합니다. 설치·제거·비활성화 방법과 재시작 후 인터페이스 반영 과정을 다룹니다.

/plugin 명령어로 마켓플레이스를 추가하는 방법을 시연하며, GitHub 저장소 URL을 붙여넣어 마켓플레이스를 로딩하고 사용 가능한 플러그인들을 확인하는 과정을 보여줍니다.
플러그인 선택 및 설치 과정을 시연하며, 스페이스바로 플러그인을 선택하고 'i'를 눌러 설치한 후 Claude를 재시작하면 커스텀 명령어들이 사용 가능해지는 것을 확인합니다.
플러그인 관리 및 제거 기능을 시연하며, 설치된 플러그인을 확인하고 필요에 따라 추가 설치하거나 제거할 수 있음을 보여주고, agent SDK 명령어와 서브에이전트들이 정상적으로 작동하는 것을 확인합니다.
에이전트 SDK와 피처 개발 플러그인을 포함한 다양한 플러그인들을 소개하고, 플러그인을 제거하고 비활성화하는 방법을 설명합니다.
플러그인 관리 메뉴에서 플러그인을 비활성화하거나 마켓플레이스 전체를 제거하는 과정을 단계별로 보여줍니다.
Anthropic 예시에는 없는 훅과 MCP 서버 기능을 데모하기 위해 자체 제작한 클로드 코드 마켓플레이스를 소개합니다.
[00:05:52] 커스텀 MCP 서버 데모

직접 만든 UI 컴포넌트용 mcp.json을 포함한 개인 저장소 기반 플러그인을 추가해 공유 MCP 서버를 설치·활성화하는 과정을 보여줍니다.

UI 컴포넌트 플러그인의 mcp.json 파일과 shared cn MCP 서버 설치 과정을 실습으로 보여줍니다.
GitHub 리포지토리 URL을 통해 플러그인을 설치하고, MCP 서버가 정상적으로 작동하는 것을 확인하는 과정을 진행합니다.
[00:07:02] 자체 마켓플레이스 및 플러그인 제작

빈 프로젝트에서 marketplace.json과 plugins 폴더 구조를 설계하는 방법을 설명합니다. 필수 매니페스트 속성(name, owner, metadata, plugins 목록)을 정리합니다.

클로드 코드 플러그인과 마켓플레이스 사용법을 마스터했으니, 이제 직접 플러그인과 마켓플레이스를 구축하고 GitHub에 배포하는 방법으로 넘어갑니다.
새로운 플러그인 개발을 위한 기본 구조를 설명하며, .claude-plugin과 plugins 폴더의 역할을 소개합니다.
마켓플레이스 매니페스트 파일인 marketplace.json의 구조를 설명합니다. 필수 속성으로는 마켓플레이스 이름, 소유자 정보(이름, 이메일), 메타데이터(설명, 버전), 플러그인 목록이 있습니다.
각 플러그인은 고유한 이름, 폴더 경로, 설명을 가지며, 선택적으로 버전, 카테고리, 키워드를 설정할 수 있습니다. website-dev라는 샘플 플러그인 폴더를 생성합니다.
로컬 마켓플레이스를 테스트하기 위해 Claude Code를 열고 './`로 현재 디렉토리의 마켓플레이스를 추가합니다. 마켓플레이스 이름에 공백이 있어 케밥 케이스로 수정한 후 성공적으로 가져왔습니다.
[00:09:08] 마켓플레이스 테스트 및 정리

로컬 디렉터리에서 ./ 명령으로 테스트 설치 시 발생하는 kebab-case 규칙 오류를 해결한 뒤, 테스트 후 마켓플레이스를 제거해 초기 상태로 되돌리는 과정을 다룹니다.

웹사이트 개발 플러그인 설정 중 빈 폴더로 인한 문제 해결 과정을 보여주며, 마켓플레이스를 제거하고 첫 번째 플러그인 설정을 시작합니다.
[00:10:15] 플러그인 구성 및 매니페스트 설정

plugins 폴더에 .claude-plugin 폴더와 plugin.json을 생성해 플러그인 이름·버전·author 등을 정의하는 법을 보여줍니다. marketplace.json과 이름 일치 중요성을 강조합니다.

Claude Code의 플러그인 정의와 구조를 설명합니다. 플러그인은 에이전트, 훅, MCP 서버, 슬래시 명령어의 모음이며, 특정 기능별로 그룹화됩니다.
마켓플레이스는 여러 플러그인을 포함할 수 있으며, 보안 도구, UI/UX 도구 등 기능별로 분리된 플러그인을 가질 수 있습니다.
플러그인 구성을 위해 .claude-plugin 폴더와 plugin.json 파일을 생성합니다. 이름은 마켓플레이스 파일과 일치해야 하며, 설명과 버전 정보를 포함해야 합니다.
플러그인에 첫 번째 도구 추가를 시작합니다. commands 하위 폴더를 생성하고 website-starter.md라는 간단한 명령어 파일을 만들어 사용자 정의 명령어를 저장합니다.
[00:12:00] 사용자 정의 커맨드 추가

commands 폴더에 MD 파일로 커맨드를 등록해 간단한 HTML 생성 커맨드를 만들고, Claude Code 재실행 시 즉시 갱신되는 라이브 리로드 기능을 확인합니다.

플러그인에 커스텀 명령어를 추가하는 방법을 설명합니다. 명령어에는 설명과 프롬프트가 필요하며, HTML 웹페이지 생성 같은 기본적인 예제를 보여줍니다.
터미널에서 Claude를 실행하고 마켓플레이스에서 플러그인을 설치하는 과정을 시연합니다. 플러그인 설치 후 Claude 코드를 재시작하여 새로운 명령어를 확인할 수 있습니다.
플러그인의 자동 업데이트 기능을 시연합니다. 새로운 명령어를 추가하면 Claude 코드를 재시작할 때 자동으로 반영되며, 마켓플레이스나 플러그인을 다시 설치할 필요가 없습니다.
플러그인의 에이전트 기능으로 넘어갑니다. 플러그인 폴더에 agents 하위 폴더를 생성하고 웹사이트 스타일러 에이전트를 만드는 과정을 시작합니다.
[00:14:10] 서브 에이전트(Agent) 통합

agents 폴더에 서브 에이전트 정의 파일을 추가해 웹사이트 스타일러 에이전트를 생성하고, 인터페이스에서 에이전트를 검색·실행하는 과정을 다룹니다.

에이전트 설정을 설명합니다. 각 에이전트에는 이름, 설명, 모델이 필요하며, 설명은 오케스트레이터 에이전트가 서브 에이전트를 언제 사용할지 결정하는 데 사용됩니다.
웹사이트 스타일러 에이전트의 역할과 기능을 설명합니다. 이 에이전트는 웹사이트의 모양과 느낌을 개선하고, CSS 파일을 만들고, 그라데이션과 색상 토큰을 구현하는 역할을 담당합니다.
플러그인에 원하는 만큼 에이전트를 추가할 수 있다고 설명하며, Claude Code를 다시 시작해서 새로 추가된 웹사이트 스타일러 에이전트를 확인하는 방법을 보여줍니다.
플러그인 폴더에 MCP 서버를 추가하는 방법을 설명합니다. .mcp.json 파일을 생성하고 shared cn MCP 서버 같은 구성을 추가하는 과정을 보여주며, Windows와 Mac/Linux 환경의 차이점도 언급합니다.
[00:15:34] MCP 서버와 훅(Hook) 추가

plugin 폴더에 dot mcp.json과 hooks 폴더를 생성해 MCP 서버 설정과 커스텀 훅 추가 방법을 설명합니다. 자동화 알림·사운드 재생 등 활용 예시를 제시합니다.

플러그인을 통해 MCP 서버가 자동으로 Claude Code에 연결되는 것을 확인하고, 팀 멤버들과 공통 플러그인을 쉽게 공유할 수 있다는 장점을 강조합니다.
훅(Hooks) 기능을 설명합니다. 플러그인 내에 hooks 하위 폴더를 만들고 hooks.json 파일을 생성하여 변경 완료 시 소리 재생이나 휴대폰 알림 같은 기능을 구현할 수 있다고 설명합니다.
[00:16:47] GitHub 배포 및 자동 업데이트

Git init으로 저장소 초기화 후 GitHub에 배포해 마켓플레이스를 연결합니다. 변경사항이 자동으로 프로젝트에 반영되는 워크플로우를 마무리합니다.

만든 플러그인을 전 세계와 공유하는 방법을 설명합니다. 폴더를 GitHub 저장소로 초기화하고, 터미널의 git init 명령이나 IDE의 저장소 초기화 기능을 사용하여 커밋을 생성하고 브랜치를 게시하는 과정을 보여줍니다.
GitHub에서 'Claude Code 플러그인 튜토리얼'이라는 이름으로 공개 저장소를 생성합니다. 테스트를 위해 기존 마켓플레이스를 제거한 후 GitHub URL을 사용하여 다시 마켓플레이스를 추가하는 과정을 시연합니다.
GitHub 마켓플레이스에 성공적으로 연결되었음을 확인하고, 저장소에서 플러그인을 변경하면 자동으로 프로젝트에 반영되는 자동 업데이트 기능을 강조합니다.
Claude Code가 방금 제가 가장 좋아하는 기능 중 하나를
출시했습니다.
바로 플러그인과 플러그인 마켓플레이스입니다.
플러그인은 여러분의 모든 커스텀
명령어, 서브 에이전트, 훅,
그리고 MCP 서버들을 번들로 묶어서
팀 멤버들이나
오픈소스 커뮤니티와 쉽게 공유할 수 있게 해주는
매우 우아한 솔루션입니다.
그뿐만 아니라 다른 마켓플레이스를 찾아서
다른 사용자들이 개발한 플러그인을
다운로드하고 설치할 수도 있습니다.
이번 영상에서는 두 가지를 다룰 예정입니다.
먼저 여러분의 프로젝트에서 플러그인을
다운로드하고 사용하는 방법을 보여드리고,
그 다음에는 여러분만의 플러그인과
마켓플레이스를 구축하는 방법을
보여드리겠습니다.
플러그인은 여러분의 슬래시 명령어,
서브 에이전트, MCP 서버, 그리고 훅의
모든 조합을 패키징하고 공유할 수 있는
경량화된 방법입니다.
물론 슬래시 플러그인 명령어를 사용해서
다른 개발자들의 플러그인을
쉽게 설치할 수도 있습니다.
기본적으로 IDE에서 이런 모습으로
보이게 됩니다.
잠시 후에 IDE에서 직접 살펴보겠지만,
기본적으로 작동 방식은
Claude Code 마켓플레이스가 포함된
URL을 가져와서
Claude Code에 전달하는 것입니다.
그러면 해당 마켓플레이스에서
사용 가능한 모든 플러그인을
보여줍니다.
원하는 것들을 선택하기만 하면
모든 기본 명령어, 서브 에이전트,
그리고 훅이 자동으로 설치됩니다.
앞으로 플러그인은
Claude Code 커스터마이제이션을
번들하고 공유하는 표준적인 방법이 될 것이며,
더 많은 확장 포인트를 추가하면서
형식을 계속 발전시켜 나갈 예정입니다.
이것은 정말로 Claude Code에 있어서
중요한 기능입니다.
사용 사례는 매우 명확합니다.
이를 통해 MCP 서버와
에이전트의 큐레이트된 목록을
팀 멤버들과 매우 쉽게 공유할 수 있습니다.
그리고 이러한 마켓플레이스는
GitHub에 배포될 수 있기 때문에,
오픈소스 메인테이너들은
명령어나 에이전트 같은 것들을
올바르게 사용되도록 변경할 수 있습니다.
물론 제가 기대하는 것은
다양한 워크플로우를 공유할 수 있는 능력입니다.
이러한 마켓플레이스를
GitHub 같은 곳에 배포하면,
공개적으로 공유할 수 있고
모든 사람들이
그 혜택을 받을 수 있습니다.
이것은 또한 숙련된 개발자들이
자신들의 워크플로우와 도구를
다른 모든 사람들과 공유할 수 있는
새로운 기회들을 열어줄 것입니다.
이제 실제로 프로젝트에서
마켓플레이스와 플러그인을 사용하는 방법을
살펴보겠습니다.
그리고 그 후에는 여러분만의
플러그인과 마켓플레이스를 만드는 방법을
보여드리겠습니다.
설명란에서 GitHub 리포지토리 링크를
설명란에서 이 GitHub 저장소에 대한 링크를 찾을 수 있습니다.
이것은 Anthropic에서 직접 개발한 Claude Code 마켓플레이스입니다.
다음 섹션에서 이 프로젝트 구조와
마켓플레이스를 구성하는
모든 파일들을 살펴보겠습니다.
하지만 개괄적으로 보면
plugins 폴더가 있고
여기에서 모든 다양한 플러그인들을 확인할 수 있습니다.
agent SDK용 플러그인이 있고
commit commands용 플러그인도 있습니다.
그리고 feature dev, PR 리뷰 툴킷
그리고 보안 가이던스도 있습니다.
물론 각 플러그인을 확장하면
그 안에 있는 모든 아티팩트를 볼 수 있습니다.
이 특정 플러그인에서는
커스텀 서브에이전트와
커스텀 명령어에 액세스할 수 있습니다.
만약 이 플러그인에 hooks와
MCP 서버가 포함되어 있다면
이 폴더에서도 볼 수 있을 것입니다.
그리고 이 프로젝트의 루트에는
.cloud plugin 폴더가 있고
클릭해보면
marketplace.json 파일을 볼 수 있습니다.
이것은 이 GitHub 저장소가
실제로 Claude Code 마켓플레이스임을 나타냅니다.
따라서 우리가 해야 할 일은
이 저장소의 URL을 가져와서
이 마켓플레이스를 설치하는 것입니다.
/plugin을 입력하고
엔터를 누르면
몇 가지 옵션이 나타납니다.
플러그인을 찾아보고
설치할 수 있습니다.
물론 아직 마켓플레이스를 설정하지 않았기 때문에
마켓플레이스 추가로 가보겠습니다.
GitHub 저장소를 붙여넣고
엔터를 누릅니다.
마켓플레이스를 로딩하고 있습니다.
이제 그 마켓플레이스에서
사용 가능한 모든 플러그인을 볼 수 있습니다.
플러그인을 선택하려면
단순히 스페이스바를 누르면 됩니다.
그런데 하나 이상을 선택할 수도 있습니다.
모든 것을 선택하고
i를 누르겠습니다.
좋습니다. 플러그인들을 설치했고
이제 Claude에서 나간 다음
다시 시작하면 됩니다.
이제 슬래시를 누르면
커스텀 명령어들이
벌써 나타나는 것을 볼 수 있습니다.
하지만 /plugin으로 가서
플러그인 관리 및 제거로 가보겠습니다.
엔터를 누르면
이미 설치한 모든 플러그인을
볼 수 있습니다. 실제로 이것은
설치한 적이 없는 것 같네요.
선택하고 변경사항 적용을 누르겠습니다.
물론 Claude를 다시 종료하고
재시작하면
이제 agent SDK 명령어에도
액세스할 수 있습니다.
물론 모든 에이전트에도
액세스할 수 있어야 합니다. add agent를 입력하면
서브에이전트들을 볼 수 있습니다.
Claude를 다시 시작하면
agent SDK 명령어들에 액세스할 수 있고
모든 에이전트들에도 액세스할 수 있어야 합니다.
add agent를 입력하면
서브에이전트들을 확인할 수 있습니다.
이제 이 모든 것들을 사용할 수 있게 되었습니다.
에이전트 SDK에서 가져온 것들,
피처 개발 플러그인과 그 외 여러 가지가 있습니다. 이제
플러그인을 제거하거나
비활성화하려면 단순히
다시 /plugin으로 가면 됩니다. 먼저
관리 및 제거
플러그인으로 가겠습니다. 엔터를 누르고, 이제
원하지 않는 것들을 간단히 비활성화하고
변경사항 적용을 누르면 됩니다. 이렇게
모든 플러그인이
비활성화되었습니다. 만약
마켓플레이스를 제거하고 싶다면 간단히
마켓플레이스 관리로 가서,
클로드 코드를 열고 마켓플레이스 제거를
클릭하면 됩니다. 그러면
확인만 하면 되고
이 모든 플러그인들을 제거하겠다고 확인하면 됩니다.
예라고 하겠습니다. 그러면 끝입니다.
마켓플레이스가 사라졌습니다.
클로드를 다시 시작하면 이 모든
커스텀 슬래시 명령어들이
사라집니다. 그리고 더 이상
해당 서브 에이전트들에 접근할 수 없습니다. 그런데
Anthropic의 예시에는 실제로
훅과 MCP 서버가
포함되어 있지 않습니다. 하지만 간단한
데모를 위해 제가
나만의 클로드 코드 마켓플레이스를
제 리포지토리에 만들었습니다. 실제로는
설치할 필요는 없고
단지 이 튜토리얼의 일부입니다.
하지만 UI 컴포넌트 같은 걸로 가면
이제 이 mcp.json 파일이 있습니다.
이 파일에서
shared cn MCP 서버를 볼 수 있습니다. 그래서
이걸 설치하고 싶다면
이 리포지토리의 URL을 간단히 복사하면 됩니다.
좋습니다. 이제 클로드를 다시 열어서
확인해보겠습니다. MCP로 가면
확인해보겠습니다. MCP로 가면
구성된 MCP 서비스가 없습니다.
그럼 plugin으로 가서
마켓플레이스 추가로 가겠습니다.
해당 리포지토리를 붙여넣겠습니다.
좋습니다. 이제 여기서 단순히
UI 컴포넌트를 선택하고
엔터를 누르겠습니다. 엔터를 눌러서
지금 설치하겠습니다. 완료되었습니다. 클로드를 종료하고
다시 들어가겠습니다.
이제 MCP로 가면 우리가 볼 수 있는 건
해당 플러그인에서 설치된
shared cn 컴포넌트입니다.
현재는 비활성화되어 있습니다. 제가
활성화하겠습니다. 그리고
완료되었습니다. 이제 우리는
shared cn MCP 서버에 접근할 수 있습니다. 모두
방금 설치한
플러그인 덕분입니다. 이제
클로드 코드 플러그인과 마켓플레이스를
사용하는 방법을 알았으니, 실제로
우리만의
플러그인과 마켓플레이스를 구축해보겠습니다. 그리고
GitHub에 배포해서 다른
사용자들이 설치하고
직접 사용할 수 있도록 하겠습니다. 가장 먼저 해야 할 일은
빈 프로젝트로
시작하는 것입니다. 모든 클로드
마켓플레이스는 최소 두 개의
폴더를 포함합니다. 바로 .claude-plugin과
plugins 폴더입니다. claude-plugin은
마켓플레이스 매니페스트를 포함할 것이고
plugins 폴더는
이 마켓플레이스에서 사용할 수 있는 모든 플러그인들이 포함됩니다.
매니페스트부터 시작해보겠습니다.
우리가 해야 할 일은 단순히
marketplace.json이라는 파일을 만드는 것입니다.
이 파일은 다음과 같은 필수 속성들을 가진 객체를 포함합니다.
첫 번째는 마켓플레이스의 이름입니다.
그 다음 소유자의 세부 정보를 제공해야 합니다.
이 객체는 마켓플레이스 관리자의
이름과 이메일 주소를 포함합니다.
선택적으로 소유자의 웹사이트나
GitHub 페이지 URL도 제공할 수 있습니다.
그리고 메타데이터 객체도
제공할 수 있습니다.
여기에는 마켓플레이스의 설명과
현재 버전 번호가 포함됩니다.
마지막으로 이 마켓플레이스에서
사용할 수 있는 플러그인들의 목록을
제공해야 합니다.
각각은 플러그인의 고유한 이름과
마켓플레이스 폴더 내 플러그인 폴더 경로를
포함하는 객체입니다.
실제로 지금 이 단계에서
해당 폴더를 만들 수 있습니다.
이름은 website-dev입니다.
그리고 이 도구에 대한 설명을
제공할 수 있습니다. 예를 들어 '웹사이트 구축을 위한 명령어, 에이전트 훅, 도구들'과 같이요.
각 플러그인에 대해 버전, 카테고리,
키워드도 제공할 수 있습니다.
이런 정보들은 실제로 에이전트에서 사용되지는 않지만
다양한 플러그인들을 정리하는 데
도움이 됩니다.
실제로 마켓플레이스를 설정하는 데
필요한 건 이게 전부입니다.
마켓플레이스에 더 많은 플러그인을
추가하고 싶다면 단순히 이 객체를 복사하고
플러그인에 다른 이름을 주고
해당 플러그인을 위한 폴더를
만들면 됩니다.
하지만 이 튜토리얼에서는
하나의 플러그인만 만들어보겠습니다.
지금 이 단계에서 마켓플레이스가
실제로 작동하는지 테스트할 수 있습니다.
그러기 위해 터미널을 열고
Claude Code를 실행해보겠습니다.
이 영상 초반에서 본 것처럼
플러그인으로 가서
마켓플레이스 추가를 선택할 수 있습니다.
이전에는 마켓플레이스
GitHub 저장소의 URL을
제공해야 했습니다.
물론 아직 배포하지 않았으므로
테스트 목적으로 이 마켓플레이스를 가져오려면
마침표와 슬래시를 입력하면 됩니다.
이렇게 하면 현재 디렉토리에서
마켓플레이스를 찾습니다.
그러면 마켓플레이스에 공백이 포함될 수 없으며
케밥 케이스를 사용해야 한다는
메시지가 표시됩니다.
좋네요. leon-demo-marketplace로
변경하겠습니다.
다시 실행해보면
이번에는 마켓플레이스를 가져오고 있습니다.
보시는 것처럼
마켓플레이스를 성공적으로
가져왔습니다.
website-dev라는 플러그인 하나가
구성되어 있는 것을 볼 수 있습니다.
참고로 website-dev는
아직 구현되지 않았기 때문에
실제로 사용할 수는 없습니다.
하지만 마켓플레이스 구조가
올바르게 작동한다는 것을 확인할 수 있습니다.
웹사이트 개발이라는
플러그인 하나가 구성되었습니다. 여기서 주목할 점은
웹사이트 개발
폴더가 아직 비어있다는 것입니다. 따라서
이것을 설치하려고 하면 제대로
작동하지 않을 겁니다. 그러니까 Escape 키를 눌러서
여기서 나가겠습니다. 그리고
실제로 깔끔하게 정리하기 위해서
마켓플레이스 관리로 가서
우리 마켓플레이스를 제거하겠습니다.
그 다음 Y를 눌러서 확인하겠습니다. 이제
첫 번째 플러그인을 설정해봅시다. Claude
Code에서 플러그인이란
정확히 무엇일까요? 이들은
에이전트, 훅, MCP 서버 그리고 슬래시
명령어의 모음입니다. 즉 각 플러그인은
특정 기능과 관련된 이런 객체들을
포함해야 합니다. 예를 들어
만약 여러분이
코드 보안 검사를 하는 플러그인을 만든다면
그때 보안
도구라고 불리는 플러그인을
만들 수 있습니다. 그러면 보안과 관련된 모든 에이전트, 훅
MCP 서버, 그리고 슬래시 명령어들이
이 플러그인에
추가될 것입니다. 이제 하나의 마켓플레이스는
하나 또는 여러 개의
다른 플러그인들을 포함할 수 있습니다. 따라서
보안 도구 플러그인을 가질 수 있고
모든 UI와 UX를 위한 별도의 플러그인도
가질 수 있습니다.
도구를 가질 수 있습니다. 그리고 우리는
이들 각각을 우리
플러그인에 추가하는 방법을 살펴볼 것입니다. 이
폴더를 Claude Code 플러그인으로 구성하려면
dot claude-plugin이라는
하위 폴더를 만들어야 합니다. 그리고
이 폴더 안에 새 파일을
plugin.json이라고 만들어야 합니다.
다시, 이 플러그인의 이름을
포함하는 객체를 만들겠습니다.
이것은 정말 중요합니다.
이 이름은 우리
마켓플레이스 파일의 이름과 일치해야 합니다. 따라서 이
이름을 우리가 website-dev라고
부르기 때문에 플러그인에서도
website-dev라고 불러야 합니다.
그 다음 우리는
설명도 제공해야 합니다. 단순히
하기 위해서, 우리는 실제로 이
마켓플레이스 파일에서 설명을 복사해서
여기에 붙여넣을 수 있습니다.
그 다음 버전을 제공해야 합니다. 다시
아마도 그냥
마켓플레이스 파일에서 복사할 수 있습니다.
그리고 마지막으로 우리는 이
작성자 객체를 제공해야 하는데, 우리의 이름과
이메일 주소를 포함해야 합니다. 정말
간단한 것들입니다. 이제 우리
플러그인 폴더에 첫 번째 도구를
추가하는 방법을 살펴봅시다. 우리
플러그인 폴더 안에 commands라는
하위 폴더를 만들겠습니다. 여기가
우리가 모든 사용자 정의
명령어를 저장할 곳입니다. 만약 이미 명령어 목록을
프로젝트에서
사용하고 있다면
이 파일에 단순히 복사해서 붙여넣기만 하면 됩니다.
하지만 이 튜토리얼에서는
정말 간단한 것을 만들어봅시다.
이것을 website-starter.md라고
부르겠습니다. 그 다음 우리
명령어에는 설명을 제공해야 합니다.
예를 들어, 기본 HTML 웹페이지 생성이라고 하면,
원하는 프롬프트를 제공할 수 있습니다.
사용자 요구사항에 따라 간단한 HTML 파일을 생성하라고 하는 것처럼요.
물론 이런 명령어들은 훨씬 복잡하게 만들 수도 있지만,
프롬프트 작성법에 너무 많은 시간을 쓰고 싶지는 않습니다.
이 튜토리얼은 마켓플레이스에 명령어를 추가하는 것에 관한 것이니까요.
이 최소한의 설정으로, 터미널로 돌아가서 Claude를 실행해봅시다.
플러그인으로 가서 우리 마켓플레이스를 추가해봅시다.
점과 슬래시를 입력합니다.
이 플러그인을 선택하고 I를 누릅니다.
플러그인이 설치되었다고 나오네요.
Claude 코드를 재시작해야 합니다.
이제 Claude 코드에서 슬래시를 누르고 website라고 타이핑하면,
우리가 만든 커스텀 명령어를 확인할 수 있습니다.
정말 멋지죠.
이 플러그인들의 정말 멋진 점은,
새로운 명령어를 생성하면,
예를 들어 랜덤 이름 생성
MD 파일을 만들고,
랜덤 이름 생성 같은 설명을 추가하고,
20개의 랜덤 이름 목록 생성 같은 프롬프트를 제공하면,
Claude 코드에서 어떤 일이 일어나는지 보세요.
Claude 코드를 종료하고,
바로 다시 실행하면,
슬래시를 누르고 website라고 타이핑했을 때
새로운 명령어가 이미 나타나는 것을 볼 수 있습니다.
마켓플레이스나 플러그인을
다시 설치할 필요가 없었습니다.
이 플러그인들의 멋진 점은 자동으로
모든 최신 변경사항을
가져온다는 것입니다.
이것은 실제 프롬프트 변경사항도 포함합니다.
지금 이 프롬프트를 변경하면,
다음에 Claude 코드를 시작할 때
모든 변경사항이 자동으로
마켓플레이스와 플러그인에서
가져와집니다.
정말 멋지다고 생각합니다.
이제 플러그인의
에이전트 기능으로 넘어가봅시다.
플러그인 폴더에서
agents라는 새로운
하위 폴더를 생성합니다.
새로운 에이전트를 만들고
웹사이트 스타일러
MD라고 부르겠습니다.
각 에이전트는 최소한 이름과 설명이 필요합니다.
선택적으로 모델도 제공할 수 있습니다.
이름은 웹사이트 스타일러라고 하고,
설명은 '이 에이전트를 사용해서
웹사이트에 아름다운 스타일을 만드세요'라고 합니다.
이 설명은 오케스트레이터 에이전트가
서브 에이전트를 언제 사용할지 결정하는 데 사용됩니다.
그다음 모델을 지정할 수 있고
Sonnet으로 가겠습니다.
프로젝트에 이미 서브 에이전트가 있다면
하위 폴더로 복사하면 됩니다.
정말 간단하게 유지해봅시다.
이것은
웹사이트의 외관과 느낌을 개선하는 역할입니다.
적절한 스타일링을 구현해서
아름다운 웹사이트를 만드는 것이죠.
이 설명을 통해 언제 이 에이전트를 사용할지
오케스트레이터가 판단할 수 있습니다.
모델을 지정하고
Sonnet으로 가겠습니다. 이미 프로젝트에 서브 에이전트가 있다면
하위 폴더로 복사하기만 하면 됩니다.
정말 간단하게 유지합시다.
이것은
정말 간단한 예제입니다.
당신의 역할은 웹사이트의
모양과 느낌을 개선하는 것입니다
적절한 스타일링을 구현하여
별도의 .CSS 파일이 존재하도록 하고
아름다운 그라데이션과
잘 어울리는 색상 토큰을
포함시키세요. 이런 식으로요.
물론 우리는 원하는 만큼 많은
에이전트를 추가할 수 있습니다. 하지만
지금은 간단하게 Claude Code를
다시 시작해보겠습니다. 이제 더하기 버튼을 누르고
에이전트를 검색하면
목록 하단에 웹사이트 스타일러
에이전트를 볼 수 있습니다. 이제
우리가 할 수 있는 다른 작업은
플러그인 폴더에 MCP 서버를 추가하는 것입니다
.mcp.json이라는 새 파일을 만드세요
이 파일에서는
다음과 같이 구성할 수 있습니다
여기 있는 shared cn MCP 서버처럼요
Windows를 사용하고 있기 때문에
이 CMD 명령을 추가해야 했습니다
하지만 Mac이나 Linux 또는 WSL을 사용한다면
간단히 npx만 사용하면 됩니다
모든 추가 옵션 없이요
이것은 Claude Code를 시작하고
MCP로 이동하면
shared cn MCP 서버가
우리 플러그인 때문에 가져와지는 것을 볼 수 있다는 뜻입니다
정말 멋지지 않나요?
팀 멤버들과 이런 공통 플러그인들을
공유하는 것이 정말 쉬워집니다
그리고 마지막으로 훅입니다
이 마켓플레이스에
포함시키고 싶은 훅이 있다면
다시 플러그인 내에
hooks라는 새 하위 폴더를 만드세요
그런 다음 이 폴더 안에
hooks.json이라는 새 파일을 만들고
이 훅과 관련된 코드를 추가하세요
훅으로는 정말 멋진 작업을 할 수 있습니다
변경이 완료될 때마다
소리를 재생하거나
심지어 휴대폰으로
알림을 보낼 수도 있습니다
이에 대한 전용 동영상이 있는데
이 동영상의 설명란에
링크를 걸어두겠습니다
그럼 이것을 전 세계와
어떻게 공유할까요? 우리가 해야 할 일은
이 폴더를
GitHub 저장소로 초기화하는 것입니다
터미널에서 git init을 실행하여
할 수도 있고, IDE를 사용한다면
간단히 저장소 초기화를
클릭할 수 있습니다. 어느 방법이든 이제
커밋을 생성하고
이 브랜치를 게시해야 합니다
IDE를 사용한다면 저장소의 이름이
무엇이어야 하는지
물어볼 것입니다
Claude Code 플러그인 튜토리얼이라고 하고
공개 저장소로 만들겠습니다
이제 GitHub에서
우리 마켓플레이스를 볼 수 있어야 합니다
모든 것을 테스트하기 위해
실제로 마켓플레이스를 제거해보겠습니다
마켓플레이스에서 실제로
이 마켓플레이스를 제거하고
Y를 누르겠습니다. 끝입니다
이제 이 URL을 복사하고
Claude Code를 시작한 다음
플러그인으로 가서
마켓플레이스 추가를 선택하겠습니다
이번에는
GitHub 저장소의 URL을 붙여넣겠습니다
좋습니다. 돌아가면
이제 GitHub의 마켓플레이스에
연결되었습니다. 물론
이전과 같이 플러그인을 설치하고 관리할 수 있습니다
하지만 중요한 부분은
이 저장소의 플러그인에
변경사항을 가하면 그 변경사항이
자동으로 우리 프로젝트에
적용된다는 것입니다
정말 멋지지 않나요? 이 동영상이 도움이 되었다면
좋아요 버튼을 누르고
구독 버튼을 눌러서
제 채널을 지원해주세요
Claude Code에 대한 많은 콘텐츠를 만들고 있으니
구독하시면
새 동영상이 나올 때마다 알림을 받을 수 있습니다
시청해주셔서 감사합니다
다음 영상에서 뵙겠습니다. 안녕히계세요