39단계Claude Code, 연결자와 나눠 맡기기

걸리는 시간 · 읽기 약 10분 · 따라 하기 약 60분 · 난이도 ★★★ 심화 · 처음엔 건너뛰어도 되는 단계 · 화면 확인 2026.09.27

이 단계를 마치면

• 같은 일을 브라우저로 할지, 연결자로 할지, Claude Code로 할지 구분할 수 있다.
• 제3부에서 만든 웹페이지를 Claude in Chrome으로 사용자처럼 눌러 보고 문제 목록을 받을 수 있다.
• 브라우저에서 찾은 문제를 Claude Code에 넘겨 고치는 흐름을 만들 수 있다.

망치를 새로 산 사람 눈에는 모든 것이 못으로 보인다고 한다. Claude in Chrome을 처음 써 본 사람도 비슷해진다. 무엇이든 브라우저로 시키고 싶어진다. 그런데 한 번 생각해 보자. 메일함에서 지난달 거래처 메일을 모두 찾는 일을, Claude가 메일 화면을 한 페이지씩 넘기며 읽게 하는 편이 나을까, 메일 시스템에 직접 연결해 검색하게 하는 편이 나을까?

화면으로 할 일, 데이터로 할 일

브라우저 조작은 사람이 쓰는 화면을 그대로 쓰는 방식이다. 어떤 사이트든 사람이 볼 수 있으면 Claude도 볼 수 있다는 것이 장점이다. 대신 느리다. 화면이 뜨기를 기다리고, 메뉴를 찾고, 한 페이지씩 넘긴다. 사이트 디자인이 바뀌면 어제 되던 일이 오늘은 헤맬 수도 있다.

연결자는 다르게 일한다. 사내 도구가 기계끼리 대화하도록 열어 둔 통로(API)로 곧장 데이터를 주고받는다. 화면을 거치지 않으니 빠르고, 디자인이 바뀌어도 영향을 덜 받고, 어떤 권한으로 무엇을 읽고 쓸지도 분명하게 나뉜다. 연결자가 무엇이고 어떻게 연결하는지는 제7부에서 자세히 다룬다. 여기서는 판단 기준만 가져가자.

순서로 정리하면 이렇다. 연결자가 있는지 먼저 본다. 없으면 내려받기가 되는지 본다. 둘 다 안 될 때 브라우저 조작을 쓴다. 브라우저는 가장 넓게 쓸 수 있는 도구이지만, 가장 먼저 꺼낼 도구는 아니다.

만든 사람과 써 보는 사람

Claude in Chrome이 가장 빛나는 곳 가운데 하나는 제3부와의 연결이다. 제3부에서 우리는 Claude Code로 사내 도구를 만들고 배포했다. 33단계에서는 "다 됐다"는 보고를 그대로 믿지 말고 배포된 주소를 직접 열어 눌러 보라고 했다. 그 확인을 Claude in Chrome에게 맡길 수 있다.

역할을 나누면 이렇다. Claude Code는 만드는 사람이다. 코드를 쓰고, 고치고, 배포한다. Claude in Chrome은 써 보는 사람이다. 배포된 주소를 열고, 처음 쓰는 사용자처럼 입력하고 눌러 보고, 이상한 점을 목록으로 적는다. 만든 사람이 자기 작품을 검사하면 놓치는 것이 생긴다. 사람 개발팀에서 만드는 사람과 시험하는 사람을 나누는 이유다.

Claude Code가 브라우저를 직접 다루도록 연결하는 방법도 있다. 이렇게 하면 Claude Code가 코드를 고친 뒤 스스로 브라우저를 열어 결과를 확인하는 흐름이 가능해진다. 연결 방법과 지원 범위는 버전에 따라 달라지니 Claude Code 공식 문서에서 확인하자. 연결 기능을 쓰지 않더라도, 이 단계의 흐름은 두 창을 오가며 사람이 결과를 옮겨 주는 방식으로 충분히 따라 할 수 있다.

문제 목록을 주고받는 방식

브라우저에서 찾은 문제를 Claude Code에 넘길 때는 형식을 맞춰 두면 편하다. 문제 하나마다 네 가지를 적게 한다.

1. 어디서: 페이지 주소와 화면 위치
2. 무엇을 했더니: 누른 버튼, 넣은 값
3. 무엇이 일어났나: 실제로 본 결과
4. 무엇을 기대했나: 원래 되어야 할 모습

이 네 가지가 있으면 Claude Code는 문제를 다시 만들어 보고 고칠 수 있다. "저장이 안 돼요"라는 말만 넘기면 Claude Code는 추측으로 고치고, 추측으로 고친 코드는 다른 곳을 망가뜨리기 쉽다.

고친 뒤에는 다시 브라우저로 돌아간다. 같은 순서로 눌러 보고, 문제가 사라졌는지, 다른 곳이 망가지지 않았는지 확인한다. 만들고, 써 보고, 고치고, 다시 써 보는 고리다.

실습할 때는 반드시 연습용 데이터로 한다. 배포된 도구에 실제 동료들의 기록이 쌓여 있다면, 시험 입력이 그 사이에 섞인다. 시험용 주소를 따로 두었다면 거기서 하고, 없다면 시험 입력에 "[테스트]"를 붙이게 한 뒤 끝나고 사람이 지운다.

현장 장면

한결상사 영업기획팀 윤서진 과장은 제3부에서 외근 방문 일지 페이지를 만들어 배포했다. 영업 사원들이 휴대폰으로 방문 기록을 남기는 페이지다. 발표는 성공적이었고, 2주째 열두 명이 쓰고 있었다.

어느 날 영업 2팀 막내가 슬쩍 말했다. "과장님, 휴대폰으로 날짜 고르는 게 좀 불편해요." 윤 과장은 자기 휴대폰으로 열어 봤지만 어디가 불편한지 딱히 알 수 없었다. Claude Code에 "날짜 선택 불편한 것 고쳐 줘"라고 했더니, Claude Code는 날짜 입력 방식을 바꿔 주었다. 그런데 다음 날 다른 사원이 말했다. "이제 날짜는 되는데 저장 버튼이 화면 밖으로 밀려났어요."

윤 과장은 방식을 바꿨다. Claude in Chrome에게 배포된 주소를 열게 하고 부탁했다. "처음 쓰는 영업 사원처럼 방문 기록 세 건을 입력해 봐. 이름에는 '[테스트]'를 붙이고, 화면 폭을 휴대폰 크기로 줄여서도 한 번 해 봐. 불편하거나 이상한 점을 '어디서, 무엇을 했더니, 무엇이 일어났나, 무엇을 기대했나' 형식으로 적어 줘."

돌아온 목록에는 네 건이 있었다. 휴대폰 폭에서 저장 버튼이 가려지는 문제, 날짜를 고르면 기본값이 오늘이 아니라 1월 1일로 돌아가는 문제, 거래처 이름을 영어로 넣으면 목록 정렬이 뒤섞이는 문제, 그리고 저장 뒤 성공 메시지가 너무 빨리 사라져 저장됐는지 알기 어렵다는 점이었다. 윤 과장이 들은 불만 두 가지가 모두 들어 있었고, 아무도 말하지 않았던 두 가지가 더 있었다.

윤 과장은 목록을 그대로 Claude Code에 붙여 넣었다. "이 네 건을 하나씩 고치고, 고칠 때마다 무엇을 바꿨는지 알려 줘." 수정이 끝나 배포되자, 다시 Claude in Chrome에게 같은 시험을 시켰다. 네 건 모두 해결됐다는 보고와 함께 새 문제 하나가 적혀 있었다. 성공 메시지를 오래 띄우도록 바꾸면서 메시지가 입력란 하나를 가리게 된 것이다.

한 번 더 고치고, 한 번 더 확인했다. 마지막으로 윤 과장은 자기 휴대폰으로 직접 기록 하나를 넣어 보고, "[테스트]"가 붙은 기록을 모두 지웠다. 삭제 버튼은 윤 과장이 직접 눌렀다.

따라 하기

1. 지금 하는 웹 업무 세 가지를 위의 판단 표에 대어, 각각 연결자·내려받기·브라우저·Claude Code 가운데 무엇이 먼저인지 적는다. 성공 기준: 세 가지 모두 이유와 함께 도구가 정해졌다. 연결자가 있는지 모르면 "제7부에서 확인"이라고 적는다.
2. 제3부에서 배포한 도구(없다면 공개된 연습용 웹 양식)의 주소를 연다. 성공 기준: 36단계의 허용 목록에 그 주소가 들어 있다.
3. 아래 프롬프트로 Claude in Chrome에게 사용자처럼 써 보게 한다. 성공 기준: 문제마다 "어디서, 무엇을 했더니, 무엇이 일어났나, 무엇을 기대했나"가 적힌 목록을 받았다.
4. 목록을 Claude Code에 넘겨 고치게 한다. 성공 기준: Claude Code가 문제별로 무엇을 바꿨는지 보고했다.
5. 배포된 뒤 Claude in Chrome에게 같은 시험을 다시 시킨다. 성공 기준: 처음 목록의 문제가 해결됐는지 건별로 확인했고, 새로 생긴 문제가 있으면 기록했다.
6. 마지막 확인은 사람이 직접 휴대폰으로 하고, 시험 데이터는 사람이 지운다. 성공 기준: "[테스트]"가 붙은 기록이 남아 있지 않다.

복사해 쓰는 프롬프트

Claude in Chrome에게 사용자 시험을 맡길 때:

[36단계의 기본 규칙을 여기에 붙인다]

이번 작업은 우리가 만든 웹페이지의 사용자 시험이야.

주소: [배포된 주소]
이 페이지의 목적: [한두 문장]
사용자: [누가, 주로 어떤 기기로 쓰는지]

해 볼 것:
- 처음 쓰는 사용자처럼 [가장 중요한 동작]을 [N]번 해 봐.
- 입력하는 이름이나 제목 앞에는 모두 "[테스트]"를 붙여.
- 가능하면 화면 폭을 휴대폰 크기로 줄여서도 한 번 해 봐. 줄일 수 없으면 그렇다고 알려 줘.
- 삭제 버튼은 누르지 마.

결과는 문제 목록으로 줘. 문제마다 아래 네 가지를 적어.
1. 어디서: 주소와 화면 위치
2. 무엇을 했더니: 누른 버튼, 넣은 값
3. 무엇이 일어났나
4. 무엇을 기대했나
문제가 아니라 불편한 점이면 "불편"으로 따로 표시해.
마지막에 입력한 테스트 기록 목록을 적어 줘. 지우는 건 내가 할게.

Claude Code에 넘길 때:

아래는 배포된 페이지를 사용자처럼 써 보며 찾은 문제 목록이야.
문제마다 원인을 먼저 설명하고, 한 번에 하나씩 고쳐 줘.
고칠 때마다 무엇을 바꿨는지, 다른 화면에 영향이 있을 수 있는지 알려 줘.
목록에 없는 곳은 고치지 마.

[문제 목록 붙여 넣기]

막히면 이렇게

스스로 점검

• ☐ 내 웹 업무 하나를 두고 연결자, 내려받기, 브라우저 가운데 무엇이 먼저인지 이유를 말할 수 있는가.
• ☐ 제3부에서 만든 페이지(또는 연습용 페이지)를 Claude in Chrome으로 시험해 문제 목록을 받았는가.
• ☐ 고친 뒤 같은 시험을 다시 해서 해결 여부를 건별로 확인했는가.

기억할 것

• 연결자가 있으면 연결자, 없으면 내려받기, 그것도 안 되면 브라우저다.
• 만드는 일은 Claude Code, 써 보는 일은 Claude in Chrome에게 나눠 맡긴다.
• 문제는 "어디서, 무엇을 했더니, 무엇이 일어났나, 무엇을 기대했나"로 넘긴다.