CLI 컴퓨트 자동화 - AI가 터미널을 제어하다

학습 시간: 45분 필요 도구: Node.js, 터미널, AI API 키 (무료 플랜 가능) 난이도: 중급~고급 (개발자 대상)

📚 학습 전 준비 5장. 자동화에서 Vibe Coding의 개념을 먼저 학습하세요. 이 가이드는 개발자를 위한 CLI 기반 자동화 도구입니다.

CLI 컴퓨트 자동화란?

2026년 개발자 워크플로우의 핵심은 AI가 터미널에서 직접 작업하는 것입니다.

기존 방식의 문제점

수동 코딩

테스트 실행 → 에러 확인 → 수정 → 다시 실행 반복
Git 워크플로우 수동 관리
브라우저 테스트를 일일이 클릭

GUI 자동화 도구 (n8n, dify 등)

드래그 앤 드롭 인터페이스
CI/CD 통합 어려움
개발자에게는 오히려 비효율적

CLI 자동화 사용 시

✅ 자연어 명령: claude "테스트 실행하고 에러 고쳐"
✅ CI/CD 통합: 스크립트에 바로 삽입 가능
✅ agentic workflow: AI가 독립적으로 작업 수행
✅ 헤드리스 실행: 비대화형 자동화

도구 분류

1. AI 코딩 에이전트

터미널에서 코드를 작성하고 시스템을 제어하는 AI 도구

Claude Code Anthropic의 공식 터미널 에이전트
Gemini CLI Google의 오픈소스 AI CLI
OpenAI Codex CLI: GPT 기반 코딩 도구

2. 브라우저 자동화 CLI

AI 에이전트가 웹브라우저를 제어하는 도구

agent-browser: AI 최적화 헤드리스 브라우저
Playwright: 검증된 전통적 프레임워크
Browser MCP: MCP 프로토콜 기반 브라우저 제어

🤖 AI 코딩 에이전트

Claude Code ⭐ (가장 추천)

공식 사이트: claude.com/product/claude-code GitHub: github.com/anthropics/claude-code

특징

Anthropic의 공식 터미널 에이전트
코드베이스 전체를 이해하고 작업
Git 워크플로우 자동화 (commit, PR 생성)
자연어로 복잡한 코딩 작업 수행
헤드리스 모드로 CI/CD 통합 가능

설치 및 기본 사용

# 설치
npm install -g @anthropic-ai/claude-code

# API 키 설정
export ANTHROPIC_API_KEY="sk-ant-..."

# 기본 사용
claude "Add dark mode to settings page"
claude "Fix all TypeScript errors"
claude "Write unit tests for auth module"

컴퓨트 자동화 기능

1. 로그 모니터링 자동화

# 로그에서 이상 감지 시 Slack 알림
tail -f app.log | claude -p "Slack me if you see any anomalies"

2. 번역 자동화 + PR 생성

# 새로운 문자열을 자동 번역하고 PR 생성
claude -p "Find new text strings, translate to French, raise PR for @lang-fr-team"

3. CI/CD 통합 (헤드리스 모드)

# 비대화형 실행
claude -p "Run tests and fix failures" --output-format stream-json

4. Pre-commit 훅

# .git/hooks/pre-commit
#!/bin/bash
claude -p "Check for linting errors and fix them" --output-format json

활용 사례

작업	명령 예시
버그 수정	`claude "Fix the login redirect bug"`
리팩터링	`claude "Refactor UserService to use dependency injection"`
테스트 작성	`claude "Add e2e tests for checkout flow"`
Git 작업	`claude "Create commit and push to feature branch"`
자동화 스크립트	`tail -f logs

장점

✅ 코드베이스 이해력 최고 (전체 맥락 파악)
✅ Git 워크플로우 내장 (add, commit, push, PR)
✅ 헤드리스 모드로 자동화 가능
✅ JSON 출력으로 스크립팅 용이

참고 자료

Gemini CLI

공식 사이트: geminicli.com GitHub: github.com/google-gemini/gemini-cli

특징

Google의 오픈소스 터미널 AI 에이전트
Gemini 2.5 Flash/Pro 모델 지원
MCP (Model Context Protocol) 통합으로 확장 가능
Agent Skills 시스템 (2026.01 업데이트)
다국어 지원 우수

설치 및 사용

# 설치
npm install -g @google/gemini-cli

# API 키 설정
export GOOGLE_API_KEY="..."

# 기본 사용
gemini-cli "Analyze error logs and suggest fixes"

# JSON 출력 (스크립팅용)
gemini-cli --output-format json "Generate weekly report"

MCP 확장 (고급)

// ~/.gemini/settings.json
{
  "mcpServers": {
    "github": {
      "command": "npx",
      "args": ["-y", "@modelcontextprotocol/server-github"],
      "env": {
        "GITHUB_PERSONAL_ACCESS_TOKEN": "ghp_..."
      }
    },
    "slack": {
      "command": "npx",
      "args": ["-y", "@modelcontextprotocol/server-slack"],
      "env": {
        "SLACK_BOT_TOKEN": "xoxb-..."
      }
    }
  }
}

Agent Skills 활용

# Playwright Skill 추가
gemini-cli skill add playwright

# 브라우저 자동화
gemini-cli "Create e2e test for login with Playwright"

Claude Code와 비교

기능	Claude Code	Gemini CLI
코드베이스 이해력	⭐⭐⭐⭐⭐	⭐⭐⭐⭐
Git 통합	내장	수동
확장성 (MCP)	제한적	⭐⭐⭐⭐⭐
오픈소스	❌	✅
다국어	우수	매우 우수
무료 플랜	제한적	Google AI Studio 무료

참고 자료

OpenAI Codex CLI

공식 사이트: developers.openai.com/codex/cli

특징

OpenAI의 코딩 에이전트 (Rust 기반)
GPT-5-Codex 모델 사용 (2026년 현재)
자율적 작업 위임 (클라우드 기반)
ChatGPT Plus/Pro 플랜에 포함

Claude Code와 차이점

Claude Code 로컬 중심, developer-in-the-loop (개발자가 계속 관여)
Codex CLI: 자율적, 클라우드에 작업 위임 후 결과 수신

기본 사용

# 설치
npm install -g openai-codex-cli

# 사용
codex "Refactor this module to use async/await"
codex "Debug production issue from logs"

참고 자료

Claude Code vs Codex Comparison

기타 CLI 도구

Cursor CLI

Cursor IDE의 CLI 버전
IDE와 연동 강력

GitHub Copilot CLI

gh copilot suggest "find all large files"
gh copilot explain "git rebase -i HEAD~3"

Cline

오픈소스, 모델 중립적
Claude, GPT, Gemini, DeepSeek, Ollama 지원
GitHub: github.com/cline/cline

🌐 브라우저 자동화 CLI

agent-browser ⭐ (AI 에이전트 최적화)

GitHub: github.com/vercel-labs/agent-browser 개발: Vercel Labs

왜 agent-browser인가?

기존 Playwright/Puppeteer는 사람이 셀렉터를 작성합니다:

// 전통적 방식
await page.click('#login-button')

agent-browser는 AI가 이해하기 쉬운 형태로 웹페이지를 제공:

# AI 에이전트 방식
agent-browser snapshot https://example.com
# → 접근성 트리 + 참조 번호 반환
# → AI가 "@e2 요소를 클릭해"라고 지시

핵심 차이점

항목	전통적 도구 (Playwright)	agent-browser
타겟 사용자	개발자	AI 에이전트
선택자	CSS, XPath 수동 작성	참조 번호 (@e2)
컨텍스트 사용량	전체 HTML (크다)	스냅샷 (93% 감소)
성능	Rust 기반 (매우 빠름)	Node.js (보통)

설치 및 사용

# 설치
npm install -g agent-browser

# 브라우저 설치
agent-browser install

# Linux 시스템 의존성 포함
agent-browser install --with-deps

주요 명령어

1. 스냅샷 (페이지 분석)

# 웹페이지를 AI가 이해할 수 있는 형태로 변환
agent-browser snapshot https://example.com

# 출력 예시:
# @e1: button "로그인"
# @e2: input[type="text"] "이메일"
# @e3: input[type="password"] "비밀번호"

2. 클릭

# 스냅샷에서 받은 참조 번호로 클릭
agent-browser click @e1

3. 입력

agent-browser fill @e2 "user@example.com"

4. 네비게이션

agent-browser navigate https://example.com/login

AI와 통합 예제

# 1. Claude Code와 조합
agent-browser snapshot https://competitor.com > snapshot.json
claude "Analyze this competitor's pricing from snapshot.json"

# 2. Gemini CLI와 조합
agent-browser snapshot https://news.com > news.json
gemini-cli "Summarize today's top headlines from news.json"

# 3. 자동화 스크립트
#!/bin/bash
# daily-monitor.sh

# 경쟁사 사이트 스냅샷
agent-browser navigate https://competitor.com/products
agent-browser snapshot > data.json

# AI로 분석
claude -p "Compare prices from data.json with our products, alert if lower" \
  --output-format json > alert.json

# Slack 알림 (조건부)
if [ $(jq '.alert' alert.json) == "true" ]; then
  curl -X POST $SLACK_WEBHOOK -d @alert.json
fi

장점

✅ 컨텍스트 효율적: HTML 대비 93% 토큰 절약
✅ AI 친화적: 참조 번호 시스템
✅ 고성능: Rust 기반
✅ 다중 세션: 병렬 작업 가능

단점

⚠️ 러닝 커브: 전통적 셀렉터와 다른 패러다임
⚠️ 생태계: Playwright보다 플러그인 적음

참고 자료

Playwright (전통적 도구)

공식 사이트: playwright.dev

왜 여전히 중요한가?

✅ 검증된 안정성 (수년간의 프로덕션 사용)
✅ 다중 브라우저 (Chromium, Firefox, WebKit)
✅ AI 도구들이 내부적으로 Playwright 사용
✅ 방대한 플러그인 생태계

설치 및 사용

# 설치
npm install -g @playwright/test

# 브라우저 설치
npx playwright install

# 테스트 실행
npx playwright test

AI와 통합: Stagehand

Playwright에 AI 레이어를 추가한 프레임워크:

// 전통적 Playwright
await page.click('button[data-testid="submit"]')

// Stagehand (AI)
await page.act("Click the 'Submit' button")

장점

UI 변경에 강건 (셀렉터가 깨지지 않음)
자연어로 테스트 작성
Playwright의 모든 기능 유지

설치

npm install @browserbase/stagehand

Claude Code + Playwright

# Claude가 Playwright 코드 생성
claude "Create e2e test for checkout flow using Playwright"

# 생성된 파일 실행
npx playwright test

Browser MCP

공식 사이트: browsermcp.io

특징

MCP (Model Context Protocol) 기반
VS Code, Cursor, Claude Desktop과 통합
IDE에서 직접 브라우저 제어

설치 (VS Code 예시)

# MCP 서버 설치
npm install -g @modelcontextprotocol/server-browser

# VS Code settings.json
{
  "claude.mcpServers": {
    "browser": {
      "command": "mcp-server-browser"
    }
  }
}

사용 예시

VS Code에서 Claude에게:
"Browse to https://example.com and extract all product prices"

→ Browser MCP가 실제 브라우저 제어
→ 결과를 Claude에게 반환
→ Claude가 분석 후 응답

🔄 통합 워크플로우

패턴 1: Claude Code + agent-browser

시나리오: 경쟁사 분석 자동화

#!/bin/bash
# competitor-analysis.sh

echo "경쟁사 데이터 수집 중..."
agent-browser navigate https://competitor.com/products
agent-browser snapshot > competitor-snapshot.json

echo "AI 분석 중..."
claude -p "$(cat <<'EOF'
competitor-snapshot.json에서 다음 정보 추출:
1. 제품 목록
2. 각 제품의 가격
3. 우리 제품과 비교 분석
4. 가격 경쟁력 평가

JSON 형식으로 출력
EOF
)" --output-format json > analysis.json

echo "분석 완료!"
cat analysis.json | jq .

패턴 2: Gemini CLI + Playwright

시나리오: 자동화 테스트 생성 및 실행

# Step 1: Gemini가 테스트 코드 생성
gemini-cli "Write Playwright test for user login flow" > tests/login.spec.ts

# Step 2: 테스트 실행
npx playwright test tests/login.spec.ts

# Step 3: 실패 시 Gemini에게 수정 요청
if [ $? -ne 0 ]; then
  gemini-cli "Fix the failing Playwright test in tests/login.spec.ts"
fi

패턴 3: CI/CD 통합

GitHub Actions 예시

# .github/workflows/ai-automation.yml
name: AI Automation

on:
  push:
    branches: [ main ]

jobs:
  ai-test:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v3

      - name: Setup Node.js
        uses: actions/setup-node@v3
        with:
          node-version: '20'

      - name: Install Claude Code
        run: npm install -g @anthropic-ai/claude-code

      - name: Run AI automation
        env:
          ANTHROPIC_API_KEY: ${{ secrets.ANTHROPIC_API_KEY }}
        run: |
          claude -p "Run all tests and fix failures" \
            --output-format stream-json

      - name: Commit fixes
        run: |
          git config user.name "Claude Bot"
          git config user.email "bot@claude.ai"
          git add .
          git commit -m "fix: AI-generated fixes" || true
          git push

패턴 4: 로그 모니터링 + 자동 대응

#!/bin/bash
# monitor-and-fix.sh

tail -f /var/log/app.log | while read line; do
  # 에러 감지
  if echo "$line" | grep -q "ERROR"; then
    echo "에러 감지: $line"

    # Claude에게 분석 및 수정 요청
    claude -p "Analyze this error and fix if possible: $line" \
      --output-format json > fix.json

    # 수정 사항이 있으면 적용
    if [ $(jq -r '.fixed' fix.json) == "true" ]; then
      echo "자동 수정 완료"
      # 서비스 재시작
      systemctl restart app
    fi
  fi
done

📊 도구 선택 가이드

의사결정 플로우차트

목적이 무엇인가?
├─ 코드 작성/리팩터링?
│  ├─ 코드베이스 이해 중요? → Claude Code
│  ├─ 외부 서비스 연동 필요? → Gemini CLI (MCP)
│  └─ OpenAI 생태계? → Codex CLI
│
└─ 브라우저 자동화?
   ├─ AI 에이전트가 주체? → agent-browser
   ├─ 프로덕션 테스트? → Playwright
   └─ IDE 통합? → Browser MCP

상황별 추천

상황	1순위	2순위	이유
코드 자동화	Claude Code	Gemini CLI	코드베이스 이해력
Git 워크플로우	Claude Code	-	Git 통합 내장
외부 API 연동	Gemini CLI	-	MCP 확장성
오픈소스 선호	Gemini CLI	Cline	커스터마이징 가능
AI 에이전트 개발	agent-browser	Playwright + Stagehand	컨텍스트 효율
e2e 테스트	Playwright	Playwright + Stagehand	검증된 안정성
IDE 통합	Browser MCP	-	MCP 프로토콜
CI/CD 자동화	Claude Code	-	헤드리스 모드

💡 실전 활용 사례

사례 1: 자동 번역 워크플로우

#!/bin/bash
# auto-translate.sh

# 새로운 영문 문자열 찾기 및 번역
claude -p "$(cat <<'EOF'
1. src/ 디렉토리에서 새로 추가된 영문 문자열 찾기
2. 한국어로 번역
3. locales/ko.json에 추가
4. Git commit 및 PR 생성
   - 제목: "chore: Add Korean translations"
   - 본문: 번역된 문자열 목록
EOF
)" --output-format stream-json

결과: 개발자가 영문 추가 시 자동으로 번역 PR 생성

사례 2: 경쟁사 가격 모니터링 봇

#!/bin/bash
# price-monitor.sh
# Crontab: 0 9 * * * /path/to/price-monitor.sh

COMPETITORS=(
  "https://competitor1.com/products"
  "https://competitor2.com/products"
  "https://competitor3.com/products"
)

for url in "${COMPETITORS[@]}"; do
  echo "Checking $url..."

  # agent-browser로 데이터 수집
  agent-browser navigate "$url"
  agent-browser snapshot > /tmp/snapshot.json

  # Claude로 분석
  claude -p "Extract product prices from /tmp/snapshot.json, compare with our prices in db/prices.json, output JSON" \
    --output-format json > /tmp/analysis.json

  # 가격이 우리보다 낮으면 알림
  if [ $(jq -r '.lower_prices_found' /tmp/analysis.json) == "true" ]; then
    # Slack 알림
    curl -X POST $SLACK_WEBHOOK \
      -H 'Content-Type: application/json' \
      -d @/tmp/analysis.json
  fi
done

결과: 매일 아침 경쟁사 가격 자동 체크 및 알림

사례 3: 자동 코드 리뷰 봇

# .github/workflows/ai-review.yml
name: AI Code Review

on:
  pull_request:
    types: [opened, synchronize]

jobs:
  review:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v3
        with:
          fetch-depth: 0

      - name: Get changed files
        id: files
        run: |
          echo "files=$(git diff --name-only origin/${{ github.base_ref }}..HEAD | tr '\n' ' ')" >> $GITHUB_OUTPUT

      - name: AI Review
        env:
          ANTHROPIC_API_KEY: ${{ secrets.ANTHROPIC_API_KEY }}
        run: |
          claude -p "Review these files for: 1) bugs, 2) security issues, 3) performance problems. Files: ${{ steps.files.outputs.files }}" \
            --output-format json > review.json

      - name: Post comment
        uses: actions/github-script@v6
        with:
          script: |
            const fs = require('fs');
            const review = JSON.parse(fs.readFileSync('review.json', 'utf8'));
            github.rest.issues.createComment({
              issue_number: context.issue.number,
              owner: context.repo.owner,
              repo: context.repo.repo,
              body: review.comment
            });

결과: PR 생성 시 자동으로 AI 코드 리뷰

사례 4: 웹 스크래핑 + AI 분석

#!/bin/bash
# scrape-and-analyze.sh

# 1. agent-browser로 여러 페이지 수집
urls=(
  "https://news-site1.com"
  "https://news-site2.com"
  "https://news-site3.com"
)

for url in "${urls[@]}"; do
  agent-browser navigate "$url"
  agent-browser snapshot >> all-news.json
done

# 2. Gemini CLI로 트렌드 분석
gemini-cli "$(cat <<'EOF'
all-news.json에서:
1. 오늘의 주요 뉴스 3개 추출
2. 공통 키워드 분석
3. 트렌드 예측
4. 마크다운 리포트 생성
EOF
)" > daily-report.md

# 3. 리포트 자동 배포
git add daily-report.md
git commit -m "docs: Daily news report $(date +%Y-%m-%d)"
git push

결과: 매일 자동 뉴스 분석 리포트 생성

⚙️ 고급 설정

Claude Code 헤드리스 최적화

# ~/.claude/config.yml
mode: headless
output_format: stream-json
timeout: 300
max_retries: 3
log_level: info

Gemini CLI MCP 전체 설정

// ~/.gemini/settings.json
{
  "defaultModel": "gemini-2.5-pro",
  "temperature": 0.7,
  "mcpServers": {
    "github": {
      "command": "npx",
      "args": ["-y", "@modelcontextprotocol/server-github"],
      "env": {
        "GITHUB_PERSONAL_ACCESS_TOKEN": "ghp_..."
      }
    },
    "filesystem": {
      "command": "npx",
      "args": ["-y", "@modelcontextprotocol/server-filesystem"],
      "env": {
        "ALLOWED_DIRECTORIES": "/home/user/projects"
      }
    },
    "postgres": {
      "command": "npx",
      "args": ["-y", "@modelcontextprotocol/server-postgres"],
      "env": {
        "DATABASE_URL": "postgresql://..."
      }
    }
  },
  "agentSkills": {
    "playwright": {
      "enabled": true,
      "headless": false
    }
  }
}

agent-browser 세션 관리

// browser-session.js
import { Browser } from 'agent-browser';

const browser = new Browser({
  headless: true,
  slowMo: 100 // 디버깅용
});

// 세션 시작
await browser.start();

// 여러 작업...
const snapshot1 = await browser.snapshot('https://example1.com');
const snapshot2 = await browser.snapshot('https://example2.com');

// 세션 종료
await browser.close();

🔒 보안 및 베스트 프랙티스

API 키 관리

# .env 파일 사용 (절대 Git에 커밋 금지!)
# .env
ANTHROPIC_API_KEY=sk-ant-...
GOOGLE_API_KEY=...
OPENAI_API_KEY=sk-...

# .gitignore에 추가
echo ".env" >> .gitignore

# 사용
source .env
claude "Run tests"

헤드리스 모드 주의사항

# ✅ 좋은 예: 타임아웃 설정
timeout 300 claude -p "Long running task" --output-format json

# ✅ 좋은 예: 에러 핸들링
if ! claude -p "Deploy to production"; then
  echo "Deployment failed"
  # 롤백 로직
  exit 1
fi

# ❌ 나쁜 예: 무한 대기
claude -p "Wait for user input"  # 헤드리스에서 불가능

Rate Limiting

# 브라우저 자동화 시 rate limiting
for url in "${urls[@]}"; do
  agent-browser snapshot "$url"
  sleep 2  # 2초 대기 (서버 부하 방지)
done

윤리적 사용

✅ 해야 할 것:
- robots.txt 준수
- 서비스 이용약관 확인
- Rate limiting 설정
- User-Agent 명시

❌ 하지 말아야 할 것:
- CAPTCHA 무단 우회
- 개인정보 무단 수집
- DDoS 수준의 요청
- 저작권 침해

🐛 트러블슈팅

Claude Code

문제: 헤드리스 모드 실패

# 해결: JSON 출력 사용
claude -p "Task" --output-format stream-json

문제: 컨텍스트 부족 에러

# 해결: 파일 명시적 지정
claude "Fix bug in src/auth.js" --files src/auth.js,src/utils.js

Gemini CLI

문제: MCP 서버 연결 실패

# 디버깅
gemini-cli --debug "Test MCP connection"

# 설정 확인
cat ~/.gemini/settings.json | jq .mcpServers

문제: JSON 파싱 에러

# 해결: 명시적 플래그
gemini-cli --output-format json "Task"

agent-browser

문제: 브라우저 설치 실패

# Linux: 시스템 의존성 포함 설치
agent-browser install --with-deps

# 수동 의존성 설치 (Ubuntu/Debian)
sudo apt-get install -y \
  libnss3 libatk1.0-0 libatk-bridge2.0-0 \
  libcups2 libdrm2 libxkbcommon0 libxcomposite1

문제: 참조 찾기 실패

# 해결: 스냅샷 재생성 (페이지가 변경됐을 수 있음)
agent-browser snapshot https://example.com > new-snapshot.json

문제: 타임아웃

# 해결: 타임아웃 증가
agent-browser --timeout 60000 snapshot https://slow-site.com

Playwright

문제: 브라우저 크래시

# 해결: 헤드리스 모드 비활성화 (디버깅)
npx playwright test --headed

# 또는 slowMo로 속도 줄이기
npx playwright test --slow-mo 1000

📚 다음 단계

학습 경로

기초: 이 가이드로 CLI 도구 이해
실습: Claude Code 또는 Gemini CLI 설치 및 간단한 작업
중급: agent-browser로 브라우저 자동화
고급: CI/CD 통합 및 복잡한 워크플로우 구축

실무 적용

5장. 자동화: Vibe Coding 개념
무역/수출: 바이어 정보 자동 수집
개발 워크플로우: PRD/TDD 자동화

✅ 체크리스트

□ CLI 컴퓨트 자동화 개념 이해
□ AI 코딩 에이전트 vs 브라우저 자동화 차이 파악
□ Claude Code 또는 Gemini CLI 설치 완료
□ 간단한 명령 실행 테스트 완료
□ 헤드리스 모드 이해 및 테스트
□ agent-browser 기본 사용법 숙지
□ 실전 워크플로우 1개 이상 구현
□ CI/CD 통합 방법 이해
□ 보안 및 윤리적 고려사항 숙지

Sources

Claude Code

Gemini CLI

Browser Automation

Comparisons

1장. 마인드셋 - AI를 지휘하는 자세 →

CLI 컴퓨트 자동화 - AI가 터미널을 제어하다

CLI 컴퓨트 자동화란?

기존 방식의 문제점

CLI 자동화 사용 시

도구 분류

1. AI 코딩 에이전트

2. 브라우저 자동화 CLI

🤖 AI 코딩 에이전트

Claude Code ⭐ (가장 추천)

특징

설치 및 기본 사용

컴퓨트 자동화 기능

활용 사례

장점

참고 자료

Gemini CLI

특징

설치 및 사용

MCP 확장 (고급)

Agent Skills 활용

Claude Code와 비교

추천 사용 사례

참고 자료

OpenAI Codex CLI

특징

Claude Code와 차이점

기본 사용

추천 사용 사례

참고 자료

기타 CLI 도구

Cursor CLI

GitHub Copilot CLI

Cline

🌐 브라우저 자동화 CLI

agent-browser ⭐ (AI 에이전트 최적화)

왜 agent-browser인가?

핵심 차이점

설치 및 사용

주요 명령어

AI와 통합 예제

장점

단점

참고 자료

Playwright (전통적 도구)

왜 여전히 중요한가?

설치 및 사용

AI와 통합: Stagehand

Claude Code + Playwright

추천 사용 사례

Browser MCP

특징

설치 (VS Code 예시)

사용 예시

추천 사용 사례

🔄 통합 워크플로우

패턴 1: Claude Code + agent-browser

패턴 2: Gemini CLI + Playwright

패턴 3: CI/CD 통합

패턴 4: 로그 모니터링 + 자동 대응

📊 도구 선택 가이드

의사결정 플로우차트

상황별 추천

💡 실전 활용 사례

사례 1: 자동 번역 워크플로우

사례 2: 경쟁사 가격 모니터링 봇

사례 3: 자동 코드 리뷰 봇

사례 4: 웹 스크래핑 + AI 분석

⚙️ 고급 설정

Claude Code 헤드리스 최적화

Gemini CLI MCP 전체 설정

agent-browser 세션 관리

🔒 보안 및 베스트 프랙티스

API 키 관리

헤드리스 모드 주의사항

Rate Limiting

윤리적 사용

🐛 트러블슈팅

Claude Code

Gemini CLI

agent-browser