에이전트에 새 능력 붙이기 (MCP·스킬)

에이전트는 놀라운 요리사예요. 그런데 오늘까지는 한계가 하나 있었어요. 무심코 지나쳤을 수도 있는 한계인데, 내 웹사이트를 한 번도 본 적이 없다는 거예요. 모든 줄을 직접 썼지만 "맛보고 조정"하는 단계에서 접시를 보는 사람은 나 혼자였어요. 웹사이트든, 웹에 올라온 PDF든, 브라우저 너머의 무엇이든 다 마찬가지였죠. 에이전트는 내 설명에만 기대서 눈을 감은 채 일해 온 셈이에요.

오늘은 첫 번째 가전을 꽂아 볼게요. 에이전트에 새 능력을 연결해 주는 표준, MCP예요. 오늘 달아 줄 건 에이전트가 스스로 조종하는 진짜 브라우저예요. 페이지를 열고, 읽고, 클릭하고, 스크린샷도 찍어요. (MCP가 정확히 뭔지는 전문용어 없이 다룬 별도 레시피에 있어요. 오늘은 그냥 써 볼게요.)

오늘 접시에 올릴 것

눈이 달린 에이전트예요. 증명은 이렇게 해요. 입문 코스 6강에서 만든 라이브 사이트를 열고, 방문자처럼 살펴본 다음, 내가 몰랐던 걸 하나 짚어 줄 거예요.

재료

first-kitchen 폴더, 에이전트 실행 중
입문 코스 6강에서 받은 라이브 URL
약 25분

조리

1. 브라우저 가전 설치하기

이번 가전의 이름은 Playwright MCP예요. Microsoft가 만든 공식 브라우저 서버인데, 초보 에이전트한테 줄 수 있는 업그레이드 중에 손꼽히게 커요. 설치도 에이전트한테 맡겨 볼게요.

너 자신에게 Playwright MCP 서버를 추가해 줘:

1. 먼저 `claude mcp list`를 실행해서 지금 뭐가 있는지 보여 줘
2. 그다음 추가해 줘: claude mcp add playwright npx @playwright/mcp@latest
3. 적용하려면 언제 너를 재시작해야 하는지 알려 줘

재시작하라고 하면 /exit를 치고, 다시 claude를 실행하세요. 새 세션이 새 손이에요.

2. 첫 시운전은 내 사이트에서

이 강의가 한 바퀴 돌아 제자리로 오는 순간이에요.

브라우저로 내 라이브 사이트 https://[your-name].pages.dev 를
열어 줘. 네가 썼다고 기억하는 내용 말고, 지금 실제로 보이는 걸
묘사해 줘. 그다음 폰 크기 화면으로 줄여서 솔직하게 말해 줘.
답답하거나, 깨졌거나, 이상한 데가 있어?

답을 꼼꼼히 읽어 보세요. 페이지를 만든 에이전트가 이제 그 페이지를 방문하고 있어요. 특히 폰 화면에는 놀랄 거리가 숨어 있곤 해요. 못생기게 줄바꿈되는 텍스트, 비좁게 몰린 버튼 같은 것들이요. 뭔가 찾아내면 이렇게 이어 가요.

찾은 걸 고치고, 새 버전을 배포하고, 라이브 사이트를 다시 열어서
수정이 실제로 보이는지 확인해 줘.

방금 한 걸 다시 봐요. 만들기 → 배포 → 자기 눈으로 검증. 프로의 워크플로를 말 한마디로 돌린 거예요.

3. 재주 하나 더, 바깥세상 읽기

이 눈은 내 사이트만 보라고 있는 게 아니에요.

[평소에 읽는 공개 페이지 아무거나: 뉴스 사이트, 문서 페이지]를
열어서 내용을 세 줄로 요약해 줘.

평소 같으면 직접 읽고 채팅창에 다시 옮겨 적었을 내용이에요. 이제는 에이전트가 알아서 가져와요. 손이 얼마나 덜 가는지 느껴 보세요.

4. 팬트리 규칙 (다들 건너뛰는 부분)

이 레슨을 마무리하는 정직한 경고 하나예요. MCP 서버는 수천 개나 있어요. 초보자가 자주 넘어지는 지점은 너무 적게 까는 게 아니에요. 스무 개를 깔아 놓고 에이전트가 왜 느리고 멍청해졌는지 갸웃거리는 쪽이죠. 설치한 가전마다 설명서가 있고, 그게 대화할 때마다 전부 같이 실려 다니거든요. 많이 쌓아 둔다고 유능해지는 게 아니에요.

CLAUDE.md에 규칙을 추가해 줘: 새 MCP 서버를 깔기 전에, 그게 뭘
더해 주고 컨텍스트 비용은 얼마인지 나한테 먼저 알려 줘. 결정은
내가 한다. 진짜 필요한 작업이 생기기 전까지 기본 답은 '아니오'야.

진짜 작업에 더 많은 게 필요해지는 날이 오면 스타터 팬트리 레시피를 참고하세요. 이 주방이 실제로 돌리는 서버 세 개를 다뤄요. 방금 설치한 브라우저, 그리고 둘 더요.

태워먹었을 때

새 도구가 안 보여요 — 재시작을 건너뛴 거예요. /exit → claude.
브라우저 창이 번쩍 떴다 사라지거나 아무것도 안 보여요 — 정상이에요. 가끔 헤드리스(화면에 안 보이는 모드)로 돌아가거든요. 창을 지켜보지 말고 에이전트가 주는 설명으로 판단하세요.
첫 실행에서 뭔가 잔뜩 내려받아요 — Playwright가 자기 브라우저를 한 번 받는 거예요. 끝날 때까지 두세요. 처음 한 번만 치르는 비용이에요.
사이트의 캐시된 옛 버전을 설명해요 — "설명하기 전에 페이지를 강력 새로고침해 줘"라고 한마디 덧붙이세요.

Order up

나가기 전에 하나씩 확인해요:

□ claude mcp list에 playwright가 설치됐다고 뜬다
□ 에이전트가 내 '라이브' 사이트를 설명했다 — 기억이 아니라 직접 보고
□ 뭔가를 끝까지 고쳤다(또는 문제없음을 확인했다): 수정 → 배포 → 검증
□ CLAUDE.md에 가전 규칙이 있다: 선반 자리는 벌어서 얻는다

다음 레슨 — 04 졸업 만찬. 이제 정해진 레시피는 없어요. 요리를 직접 고르고, 에이전트와 함께 계획하고, 만들고, 배포하고, 누군가에게 보여줘요. 지금까지 배운 전부를 한 접시에 담아요. 내 접시에요.

막히면 아래 질문 상자에 남겨 주세요 — 그러라고 있는 거예요.