홈

3부: CLI로 웹 스크래핑하기 🌐

curl과 pup으로 웹 데이터를 자유자재로 수집하기

Intro

웹 스크래핑이란? 🕷️

"웹 페이지에서 필요한 데이터만 자동으로 추출하는 기술"

브라우저를 열지 않고도 CLI 명령어로 웹 데이터를 가져오고 가공할 수 있습니다.

📊

정적 페이지 스크래핑

HTML을 가져와서 원하는 부분만 추출

🔌

API 호출

서버에서 JSON 데이터를 직접 받아오기

🤖

Claude Code와 협업

수집한 데이터를 AI로 분석하고 요약

목표

학습 목표 🎯

  • ✅ curl로 웹 페이지와 API 데이터 가져오기
  • ✅ pup으로 HTML에서 원하는 요소만 추출하기
  • ✅ 브라우저 개발자 도구로 CSS 셀렉터 찾는 법
  • ✅ 실전 예시: AI타임즈, 빅카인즈, 네이버 블로그
  • ✅ Claude Code와 협업하여 데이터 분석하기

💡 이 강의를 마치면

뉴스, 블로그, 쇼핑몰 등 대부분의 웹사이트에서 데이터를 자동으로 수집할 수 있습니다.

주의: 웹 스크래핑 시 해당 사이트의 이용약관과 robots.txt를 확인하세요.
기본

curl 기본 사용법 📡

curl은 URL을 통해 데이터를 전송하는 CLI 도구입니다.

(1) 기본 요청

# 웹 페이지 HTML 가져오기
curl https://www.aitimes.com

→ 화면에 HTML이 출력됩니다.

(2) 파일로 저장

# 결과를 파일로 저장
curl https://www.aitimes.com > aitimes.html

(3) User-Agent 헤더 추가

# 브라우저처럼 보이기
curl -H "User-Agent: Mozilla/5.0" https://www.aitimes.com

많은 사이트가 봇 차단을 위해 User-Agent를 확인합니다.

💡 fetch는 JavaScript 함수, curl은 CLI 명령어입니다.
도구

pup 설치하기 🔧

pup은 HTML 파싱을 위한 CLI 도구입니다. CSS 셀렉터로 원하는 요소를 쉽게 추출할 수 있습니다.

macOS 설치

brew install pup

Windows (Scoop 사용)

scoop install pup

Linux

# Go로 설치
go install github.com/ericchiang/pup@latest

설치 확인

pup --version

💡 pup이 필요한 이유

grep과 sed로도 HTML 파싱이 가능하지만, CSS 셀렉터를 사용하는 pup이 훨씬 간단하고 정확합니다.

기술

CSS 셀렉터 찾는 법 🎯

브라우저 개발자 도구를 사용하면 원하는 요소의 셀렉터를 쉽게 찾을 수 있습니다.

1단계: 개발자 도구 열기

macOS

⌘ + ⌥ + I

Windows

F12 또는 Ctrl + Shift + I

2단계: 요소 선택

  1. 개발자 도구 왼쪽 상단의 선택 도구(화살표 아이콘) 클릭
  2. 웹 페이지에서 원하는 요소에 마우스 올리기
  3. 요소 클릭

3단계: 셀렉터 복사

  1. Elements 탭에서 선택된 요소에 우클릭
  2. Copy → Copy selector 선택

💡 예시

#section-list > ul > li:nth-child(1) > div > h2

이런 형태의 CSS 셀렉터가 복사됩니다.

실습 1

AI타임즈 스크래핑 실습 📰

AI타임즈에서 "클로드" 검색 결과를 스크래핑해봅시다.

(1) HTML 가져오기

curl "https://www.aitimes.com/news/articleList.html?sc_area=A&view_type=sm&sc_word=%ED%81%B4%EB%A1%9C%EB%93%9C" \
  -o aitimes_claude.html

(2) 기사 리스트 추출

# 전체 기사 리스트 영역
cat aitimes_claude.html | pup '#section-list > ul'

(3) 첫 번째 기사 제목만 추출

# 첫 번째 기사 제목
cat aitimes_claude.html | \
  pup '#section-list > ul > li:nth-child(1) > div > h2 text{}'

text{}는 HTML 태그를 제거하고 텍스트만 추출합니다.

(4) 모든 기사 제목 추출

# 모든 h2 제목 추출
cat aitimes_claude.html | \
  pup '#section-list h2 text{}' > aitimes_titles.txt
실습 2

빅카인즈 JSON API 호출 🔌

브라우저 네트워크 탭에서 API 요청을 찾아 curl로 재현할 수 있습니다.

(1) 네트워크 탭에서 복사

  1. 빅카인즈 사이트에서 검색 실행
  2. 개발자 도구 → Network 탭 열기
  3. search.do 요청 우클릭 → Copy → Copy as cURL

(2) curl 명령어 실행

curl 'https://www.bigkinds.or.kr/api/news/search.do' \
  -H 'Content-Type: application/json' \
  --data-raw '{"indexName":"news","searchKey":"클로드","startDate":"2025-07-09","endDate":"2025-10-09","startNo":1,"resultNumber":10}' \
  -o bigkinds_result.json

(3) jq로 제목만 추출

# 첫 번째 기사 제목
cat bigkinds_result.json | jq '.resultList[0].TITLE'

# 모든 기사 제목
cat bigkinds_result.json | jq '.resultList[].TITLE' > bigkinds_titles.txt

💡 Tip

JSON API는 HTML 파싱보다 훨씬 정확하고 안정적입니다. 가능하면 API를 먼저 찾아보세요!

추가 연습

추가로 연습할 수 있는 주제들 💡

같은 방법으로 다양한 웹사이트를 스크래핑할 수 있습니다.

📰 뉴스 검색

  • • 네이버 뉴스 검색
  • • 다음 뉴스
  • • 구글 뉴스
  • • RSS 피드 파싱

📈 주식 정보

  • • 네이버 금융 시세
  • • 야후 파이낸스 API
  • • 증권사 시세 정보
  • • 환율 정보

🏠 부동산 정보

  • • 네이버 부동산
  • • 직방 매물 정보
  • • 국토교통부 실거래가
  • • 아파트 시세 동향

🛍️ 쇼핑몰 가격 비교

  • • 쿠팡 상품 검색
  • • 네이버 쇼핑 최저가
  • • 다나와 가격 비교
  • • 아마존 상품 정보

🌦️ 날씨 & 생활 정보

  • • 기상청 날씨 API
  • • 미세먼지 정보
  • • 지역별 날씨 예보
  • • 공공데이터 포털

💻 개발자 정보

  • • GitHub 트렌딩
  • • Stack Overflow 질문
  • • npm 패키지 정보
  • • 채용 공고 (원티드, 로켓펀치)
동일한 패턴으로 거의 모든 웹사이트에서 데이터를 수집할 수 있습니다!
고급

Chrome DevTools MCP 🌐

Claude Code에서 Chrome 브라우저를 직접 제어하여 고급 스크래핑을 할 수 있습니다.

📚 DevTools MCP 공식 문서

https://github.com/ChromeDevTools/chrome-devtools-mcp

MCP란?

Model Context Protocol - AI가 외부 도구를 사용할 수 있게 하는 표준 프로토콜입니다.

설치 방법

# Claude Code CLI로 추가
claude mcp add chrome-devtools npx chrome-devtools-mcp@latest

한 번만 설정하면 Claude Code가 브라우저를 자동으로 제어할 수 있습니다.

주요 기능

🖱️ 입력 자동화

클릭, 입력, 드래그 등

🔄 네비게이션

페이지 이동, 새 탭 열기

📸 스크린샷

화면 캡처, 스냅샷

🌐 네트워크

요청/응답 분석

💡 동적 웹페이지(JavaScript로 렌더링)도 스크래핑 가능합니다!
실습

Claude Code로 브라우저 제어 🤖

자연어로 브라우저를 조작하여 복잡한 스크래핑도 간단하게!

예시 1: 성능 분석

"https://developers.chrome.com의 성능을 측정해줘"

→ Claude가 페이지를 열고 성능 트레이스를 자동으로 분석합니다.

예시 2: 로그인 후 데이터 수집

"네이버에 로그인해서 내 블로그 통계를 가져와줘"

→ 로그인이 필요한 페이지도 자동화할 수 있습니다.

예시 3: 동적 콘텐츠 스크래핑

"인스타그램에서 #AI 해시태그의 최신 게시물 10개를 스크린샷으로 저장해줘"

→ 무한 스크롤, 동적 로딩 등 복잡한 페이지도 처리 가능합니다.

⚡ 장점

  • • curl/pup보다 훨씬 강력 (JavaScript 실행, 로그인 등)
  • • 자연어로 명령하면 Claude가 알아서 처리
  • • 스크린샷, 네트워크 로그 등 다양한 데이터 수집
정리

정리 🎯

"웹 스크래핑은 인터넷을 데이터베이스처럼 사용하는 기술"

curl + pup + Claude Code = 무한한 가능성

📚 배운 내용 요약

🔧 도구

  • • curl: 웹 데이터 가져오기
  • • pup: CSS 셀렉터로 파싱
  • • jq: JSON 데이터 처리
  • • grep/sed: 텍스트 정제

💡 실습

  • • AI타임즈 HTML 스크래핑
  • • 빅카인즈 JSON API 호출
  • • 다양한 응용 주제 확인
  • • Chrome DevTools MCP 활용

🚀 다음 단계

4부에서는 수집한 데이터로 AI 에이전트를 만들어봅니다!

💡 스크래핑 윤리: 웹 사이트의 robots.txt와 이용약관을 반드시 확인하세요.