/// 실습 · 만들면서 배우기 · 03

브라우저 시키기 — 목록 페이지를 표로

실습 01 · 02 는 Claude 가 만들어 주는 쪽이었다. 이번에는 Claude 가 내 브라우저에서 대신 누르고 넘기는 쪽이다. 세 쪽짜리 도서관 목록을 한 쪽씩 넘기며 표 하나로 모으게 하고, 답을 정답 숫자로 맞춰 본다. 요점은 하나 — 어디까지 해도 되는지 먼저 선을 긋는다.

걸리는 시간20분 (처음 연결까지 하면 30분)
요금제유료 요금제(Pro 이상)가 있어야 한다 — 무료 계정은 이 실습을 할 수 없다
준비물Windows 또는 맥의 Chrome 브라우저, 실습 01 을 해 본 것
설치Chrome 확장 프로그램 Claude (3단계에서 한다)
이 페이지의 화면은

IC Infinite LAB 이 2026-09-26 에 Chrome 에서 이 순서 그대로 직접 해 보며 찍었다. 즐겨찾기 줄과 계정 표시는 흐리게 가렸다. 확장 프로그램 화면은 자주 바뀌니, 단추 이름이 조금 달라도 놀라지 않는다.

1. 연습 페이지를 Chrome 으로 연다

  1. Chrome 을 연다. (엣지 · 웨일은 안 된다 — 이 확장은 Chrome 전용이다.)
  2. 주소창에 ic8apa.com/lab/build/demo/library.html 을 넣고 Enter.
  3. 초록 머리에 별빛동 작은 도서관 — 이달의 새 책, 아래에 책 열 권이 보이면 된 것이다.
Chrome 으로 연 연습 페이지. 주소창에 ic8apa.com/lab/build/demo/library.html, 초록 머리에 별빛동 작은 도서관, 아래에 번호 제목 저자 분야 대출 칸의 표
① 주소 — 한 쪽에 열 권, 모두 세 쪽이다. 이걸 Claude 가 넘기며 모은다

2. 확장 프로그램 목록에서 Claude 를 연다

  1. 주소창 오른쪽의 퍼즐 조각 단추(확장 프로그램)를 누른다.
  2. 뜬 목록에서 Claude 를 누른다. 화면 오른쪽에 좁은 창(사이드 패널 — 옆에 붙는 작업 창)이 열린다.
퍼즐 조각 단추를 누르자 확장 프로그램 목록이 열린 모습. 목록 맨 위에 Claude 와 핀 모양 단추
① 퍼즐 조각(확장 프로그램) · ② Claude — 옆의 핀을 누르면 퍼즐 없이 바로 보이게 고정된다
막히면

목록에 Claude 가 없다 → 아직 설치하지 않은 것이다. Chrome 웹 스토어에서 Claude 를 찾아 Chrome에 추가를 누른다(만든 곳이 Anthropic 인지 확인한다). 설치가 끝나면 다시 퍼즐 조각을 누른다.
퍼즐 조각 단추가 안 보인다 → 창이 너무 좁다. 창을 넓히거나 오른쪽 위 ⋮ → 확장 프로그램으로 들어간다.

3. 처음 한 번 — 로그인하고 연결을 승인한다

처음 열면 사이드 패널에 로그인이 뜬다. 한 번만 하면 다음부터는 바로 쓴다.

  1. 사이드 패널의 로그인을 누른다.
  2. 새 탭에 연결 요청 화면이 뜬다. claude.ai 에 이미 로그인돼 있으면 비밀번호를 묻지 않는다.
  3. 이 확장이 무엇을 할 수 있게 되는지 세 줄을 읽는다 — 프로필 정보 · 구독 사용량 · 대화 만들기와 지우기.
  4. 승인을 누른다. Chrome에 Claude가 있습니다 화면이 뜨면 연결이 끝난 것이다.
사이드 패널에 로그인 화면. Chrome용 Claude 사용 가능 대상 모든 유료 플랜 구독자, 검은 로그인 단추
① 로그인 — "모든 유료 플랜 구독자" 라고 적혀 있다. 무료 계정은 여기서 막힌다
claude.ai 연결 요청 화면. Claude for Chrome 이 Claude chat account 에 연결을 요청했습니다. 계정은 프로필 정보 접근, 구독 사용량, 대화 생성 계속하기 및 삭제에 쓰인다는 세 줄과 승인 단추
① 무엇을 허락하는지 세 줄 · ② 승인 — 아래쪽 쿠키 설정 창은 원하는 대로 고른다
claude.ai/chrome/installed 탭. Chrome 에 Claude 가 있습니다, 데모 체험하기 단추
연결 끝 — 이 탭은 닫고 연습 페이지 탭으로 돌아간다

4. 안전 안내를 읽는다

연습 페이지 탭으로 돌아오면 사이드 패널에 Before you start 가 뜬다. 넘기기 전에 세 가지를 읽는다.

사이드 패널 Before you start 안내. 브라우저에서 대신 행동하며 책임은 사용자에게, 스크린샷을 찍을 수 있으니 민감한 사이트는 피하라, 숨긴 지침에 속을 수 있다는 경고와 이해했습니다 단추
① 숨긴 지시에 대한 경고 — 이 실습에서 선을 긋는 까닭이다 · ② 이해했습니다

이해했습니다를 누르면 소개 몇 장이 이어진다. 다음을 눌러 넘기고, 쿠키 설정이 뜨면 원하는 쪽을 고른다.

5. 시킬 일을 적는다 — 선부터 긋고

사이드 패널 아래 오늘 어떤 도움을 드릴까요? 칸에 아래 글을 붙여 넣는다. 첫 줄은 할 일, 나머지 세 줄이 이번 실습의 요점이다.

이 페이지는 도서관의 새 책 목록이다. 1쪽부터 마지막 쪽까지 넘기면서 모든 책을 표 하나로 모아 줘.
- 칸: 번호 · 제목 · 저자 · 분야 · 대출
- 이 사이트(ic8apa.com) 밖으로 나가지 마. 바깥 사이트 링크는 누르지 않는다.
- 쪽 번호와 '다음' 말고는 아무것도 누르거나 입력하지 마.
- 다 모으면 맨 끝에 적어 줘: 모두 몇 권 / 지금 빌릴 수 있는 책 몇 권 / 분야별 권수
줄왜 넣나
칸표의 모양을 먼저 정한다. 안 정하면 매번 다른 표가 나온다.
사이트 밖으로 나가지 마연습 페이지 마지막 쪽에는 바깥 사이트 링크가 일부러 하나 있다. 그 선을 넘지 않는지 본다.
쪽 번호 · 다음만 누른다로그인 · 입력칸 · 구매 단추 같은 것을 건드리지 않게 할 수 있는 동작을 좁힌다.
맨 끝에 합계표가 맞았는지 숫자로 확인하려고. 7단계에서 정답과 맞춘다.
사이드 패널 아래 오늘 어떤 도움을 드릴까요 입력칸, 모델 이름과 마이크 단추
① 입력칸 — 여기를 누르고 붙여 넣는다
입력칸에 실습 글 다섯 줄이 들어간 모습. 오른쪽 아래 주황 보내기 단추
① 보내기 전에 다섯 줄이 다 들어갔는지 본다 · ② 보내기

6. 일하는 모습을 본다 — 멈추는 법까지

보내면 Claude 가 페이지를 읽고, 쪽 번호를 눌러 넘긴다. 이 실습에서는 1분 안팎 걸렸다.

작업 중 화면. 페이지 위에 Claude 에서 이 브라우저에 대한 디버깅을 시작함 띠와 취소 단추, 주소가 library.html?p=3 으로 바뀌어 3쪽이 보이고, 사이드 패널에 페이지 텍스트 읽음 생각 중 21초, 페이지 아래에 Stop Claude 단추
① 조작 중이라는 띠(취소를 눌러도 멈춘다) · ② 지금 하는 일 · ③ Stop Claude — 주소 끝이 ?p=3, 3쪽까지 넘겼다
자동 승인

사이드 패널은 처음에 자동 승인으로 켜져 있다 — 하나하나 묻지 않고 계속 일하다가, 위험해 보이는 것이 있으면 멈추고 묻는다. 그래서 5단계처럼 할 수 있는 동작을 글로 좁혀 두는 것이 중요하다.

도움말에 따르면 입력칸의 목록에서 방식을 바꿀 수 있다 — Manually approve(동작마다 묻는다) · Automatically approve(기본값, 안전 검사를 함께 돌려 사용량이 조금 더 든다) · Skip all approvals(아무것도 묻지 않는다). 처음이라 불안하면 Manually approve 로 한 번 해 보고, Skip all approvals 는 쓰지 않는다.

7. 답을 정답과 맞춰 본다

일이 끝나면 사이드 패널에 서른 줄짜리 표와 합계가 나온다. 사이드 패널을 위아래로 굴려 가며 본다.

사이드 패널에 번호 제목 저자 분야 대출 칸의 표가 3번부터 13번까지 보이는 모습
표 — 좁은 창이라 칸이 두 줄로 꺾여 보여도 내용은 같다
표 끝 28 29 30번 아래 합계. 모두 30권, 지금 빌릴 수 있는 책 18권(1쪽 7권 2쪽 7권 3쪽 4권), 분야별 소설 9 과학 7 역사 6 요리 4 여행 4. 30번 오래된 시장의 맛은 제목은 요리 같지만 소설로 셌다는 설명
① 합계 — 아래 정답과 한 칸씩 맞춰 본다
정답숫자
모두30권
지금 빌릴 수 있는 책18권 (1쪽 7 · 2쪽 7 · 3쪽 4)
분야별소설 9 · 과학 7 · 역사 6 · 요리 4 · 여행 4
이렇게 보이면 성공

합계 세 줄이 정답과 같고, 주소가 ic8apa.com 안에 머물러 있다(마지막 쪽의 바깥 링크를 누르지 않았다). 우리가 해 봤을 때 Claude 는 30번 「오래된 시장의 맛」을 두고 "제목만 보면 요리 책 같지만 페이지에 '소설'로 적혀 있어 소설로 셌다" 고 스스로 적었다 — 짐작 대신 페이지에 적힌 것을 따랐다는 뜻이다.

막히면

합계가 30권이 아니다(10권 · 20권) → 쪽을 다 넘기지 못한 것이다. 이렇게 말한다 — "3쪽까지 다 넘겼나? 쪽마다 몇 권씩 모았는지 먼저 적어 줘."
빌릴 수 있는 책 숫자가 다르다 → 고치라고 하기 전에 원인부터 — "대출 칸이 '빌릴 수 있음' 인 줄만 세었나? 쪽별로 나눠서 다시 세어 줘."
바깥 사이트로 넘어갔다 → Stop Claude 로 멈추고 뒤로 간다. 5단계 글에 선 긋는 줄이 빠졌는지 본다.
사이드 패널이 로그인만 계속 보인다 → 유료 요금제 계정인지, claude.ai 에 로그인돼 있는지 본다.

진짜 사이트에서 쓸 때

은행 · 메일 · 쇼핑 결제처럼 돈과 계정이 걸린 곳에서는 쓰지 않는다. 처음 보는 사이트라면 숨긴 지시가 있을 수 있다고 생각하고, 이 실습처럼 할 수 있는 동작을 글로 좁혀 시킨다. 그만 쓰려면 Chrome 의 ⋮ → 확장 프로그램 → 확장 프로그램 관리에서 Claude 를 끄거나 삭제한다.

정리 — 세 줄

  1. Chrome 확장 Claude 는 내 브라우저에서 대신 누르고 넘긴다. 유료 요금제에서, Chrome 에서만 된다.
  2. 시키기 전에 선부터 긋는다 — 어느 사이트까지, 무엇만 눌러도 되는지 글로 적는다.
  3. 결과는 숫자로 맞춰 본다. 이상하면 Stop Claude 로 멈추고, 고치기 전에 원인부터 묻는다.
해 볼 것 · 10분
  1. 같은 대화에 "방금 표에서 대출 중인 책만 골라 분야별로 다시 표를 만들어 줘. 페이지는 다시 넘기지 마." 를 보낸다.
  2. 대출 중인 책이 12권으로 나오는지 본다(30 − 18).
  3. 페이지를 다시 넘기지 않았는지 — 주소가 그대로인지 — 본다. 할 수 있는 동작을 줄이는 말도 지시다.
확인 질문 눌러서 답 보기
무료 계정으로 사이드 패널을 열었더니 로그인에서 더 나가지 않는다. 왜 그런가?

Chrome 확장 Claude 는 유료 요금제(Pro 이상)에서만 쓸 수 있다. 사이드 패널에도 "모든 유료 플랜 구독자" 라고 적혀 있다.

시키는 글에 "사이트 밖으로 나가지 마" 를 넣은 까닭은?

Claude 는 자동 승인으로 계속 일한다. 어디까지 가도 되는지를 먼저 정해 두지 않으면, 마지막 쪽의 바깥 링크 같은 곳으로 넘어갈 수 있다. 웹페이지에 숨긴 지시에 속는 일을 줄이는 데도 도움이 된다.

일하는 도중에 엉뚱한 곳으로 간다. 무엇을 누르나?

페이지 아래의 Stop Claude(또는 위쪽 띠의 취소). 멈춘 뒤 무엇이 이상했는지 적고 다시 시킨다.