Claude Code 자동화 개념 지도¶
비개발자를 위한 학습 가이드. 새로운 개념을 배울 때마다 이 폴더에 추가한다.
전체 구조¶
나(사용자)
│
├─ Claude Code (터미널에서 작업)
│ ├─ Skill ─────────── 반복 워크플로우 (매뉴얼)
│ ├─ Sub-agent ─────── 전문 팀원 (위임)
│ ├─ Agent Team ────── 팀 프로젝트 (협업)
│ └─ MCP Server ────── 외부 서비스 연결 (노션, GitHub 등)
│
└─ Cowork (Claude Desktop에서 작업)
└─ 일회성 파일/이미지 작업에 최적
웹 기초 과정 (체계 잡기, 2026-06 시작)¶
바이브코딩 경험을 개념 체계로 연결하는 12강 과정. 다음 강 생성 = "웹기초 ○강 만들어줘".
| 문서 | 내용 |
|---|---|
| 50-웹기초-커리큘럼 | 12강 로드맵 + 학습 사이클 (읽기→페인만→퀴즈→실물 해부) |
| 51-1강 큰 그림 | 주소창 엔터→화면까지 6단계, 식당 비유, 퀴즈 |
| 52-용어사전 | 핵심 용어 60여 개 (뜻+비유+내 프로젝트 실물) |
핵심 개념 요약¶
| 개념 | 한 줄 설명 | 비유 | 상세 문서 |
|---|---|---|---|
| Skill | 저장된 작업 매뉴얼 | 레시피북 | 01-skill.md |
| Skill 최적화 | 스킬 관리/재활용 설계 | 프랜차이즈 본사 | 07-skill-optimization.md |
| Sub-agent | 독립 전문 팀원 | 프리랜서 | 02-subagent.md |
| Agent Team | 팀원들의 협업 | 프로젝트팀 | 03-agent-team.md |
| MCP | 외부 서비스 연결 | 전화선 | 04-mcp.md |
| Cowork | GUI 파일 작업 도우미 | 옆자리 동료 | 05-cowork.md |
| Remotion Skills | 말로 시켜서 영상(MP4) 자동 생성 | AI 모션그래픽 디자이너 | 08-remotion-skills.md |
| 명령어 & 단축키 | 모드 전환, 모델 변경, 세션 관리 | TV 리모컨 | 09-claude-code-commands.md |
| Skills/Agents 비교 | Custom Skills, Agents, Sub-agents, Agent Teams 4가지 차이 | 레시피 vs 요리사 vs 심부름꾼 vs 프로젝트팀 | 13-skills-agents-비교.md |
| 자동화 판단 기준 | Claude가 할 것 vs 직접 할 것 | 외주 줄지 말지 판단표 | 10-automation-playbook.md |
| Agent 설계 가이드 | Sub-agent/Agent Team 설계 시 함정과 체크리스트 | 실수 방지 매뉴얼 | 11-agent-design-guide.md |
| Astro+Vercel 배포 | 웹사이트 만들고 무료 배포하는 과정 + 이메일 트러블슈팅 | 인쇄소에 원고 넘기기 | 08-astro-vercel-배포가이드.md |
| 웹 개발 패턴 | CSS Grid, iframe, GitHub Actions, API 활용, JSON, 외부 링크 자동 새탭(querySelectorAll+target_blank) | 공사+물류 운영 매뉴얼 | 12-web-dev-patterns.md |
| HWP COM 자동화 | DOCX를 한글 파일로 자동 변환 | "한글에서 열기 > 저장"을 코드로 | 14-hwp-com-automation.md |
| 멀티 디바이스 동기화 | 여러 노트북에서 작업 이어가기 | 이사할 때 핵심 서류만 챙기기 | 15-multi-device-sync.md |
| Selenium 자동화 | Python으로 크롬 브라우저 자동 조종 | 로봇 팔이 마우스/키보드 대신 | selenium-automation.md |
| 파일 포맷 다루기 | 엑셀/PPT/텍스트 파일 읽고 쓸 때 함정과 해결법 | 책 목차가 틀려도 실제 내용은 다 있다 | 16-file-format-tips.md |
| SEO 실전 팁 | API 발행 SEO 영향, 네이버 vs 구글, GSC 색인 진단·thin content 보강 | 배달 방법이 아니라 음식 맛이 평가 기준 | 17-seo-tips.md |
| 인스타 API 자동화 | 비공식 REST API로 타인 공개 프로필 데이터 수집 | 남의 가게 매출 조회하기 (공식 창구 X, 뒷문 O) | 18-instagram-api-automation.md |
| 모바일 TTS + 카톡 인앱 | Web Speech API 함정 + 카톡 인앱 브라우저 우회 | 카톡 안에서는 마이크가 막혀 있다, 밖에 나가서 써야 한다 | 19-mobile-tts-inapp-browser.md |
| MCP 자동화 연동 | ComfyUI MCP, Selenium, Playwright 등 자동화 도구 연동 | Claude를 허브로, 팔을 여러 개 붙이기 | 04-mcp.md 하단 |
| Cloudflare Pages 배포 | Astro 사이트를 Cloudflare Pages에 무료 배포 + R2 이미지 + 도메인 | 무료 웹호스팅 + 이미지 창고 | 09-cloudflare-pages-배포가이드.md |
| Streamlit Cloud 배포 | Python 앱을 무료로 웹에 배포. 데이터 분석 도구에 최적 | Python 앱 전용 인쇄소 | 19-streamlit-cloud-배포가이드.md |
| D1 마이그레이션 팁 | DB 컬럼 추가 시 --file보다 --command 인라인 명령이 안정적 |
등기우편 vs 카톡 메시지 | 21-d1-migration-tips.md |
| 팩트체크 교차 검증 | 공식 페이지 + 최신 언론 보도 + 충돌 시 판단법 | 전세 계약 전 등기부+오늘자 뉴스 둘 다 보기 | 20-팩트체크-교차검증.md |
| 웹앱 자동화 가이드 | Apps Script vs Cloudflare Workers 비교 + 실전 이전 패턴 | 연습장 vs 공식 문서 | 20-webapp-automation-guide.md |
| CF Pages Functions | 정적 사이트에 DB+파일저장+API 붙이기 (D1+R2) | 전단지 뒤에 접수 창구 | cloudflare-pages-functions.md |
| SMS/이메일/카톡 API | 웹서비스에서 고객에게 문자/이메일/카톡 보내기 | 자동 우체국 (문자=편지, 알림톡=카톡, 이메일=무료) | sms-email-api-guide.md |
| 맥북 기초 가이드 | 윈도우 유저가 맥북 처음 쓸 때 핵심 차이점 + 키보드 + 터미널 + 갤럭시 미러링 | 좌핸들 → 우핸들 바꾼 자동차 | 21-macbook-basics.md |
| 이미지 처리 팁 | 얼굴 블러(YuNet), EXIF 회전, 리사이즈, SEO 파일명 | 사진 출력 전 보정소 | 22-image-processing-tips.md |
| 문서 사이트 구축 | MkDocs vs Docsify vs VitePress 비교 + 실전 설정 | 위키 만들기 도구 | 23-docs-site-builder.md |
| 긴 HTML 문서 팁 | 태그 외부 매칭(형광펜 겹침 방지) + 스크롤 스파이(현재 장 자동 하이라이트) | 유튜브 타임스탬프 활성화 | 24-html-long-doc-tips.md |
| MCP Zapier 툴 레퍼런스 | Gmail/Docs/Drive/Calendar/Notion 실전 호출법 + escape 규칙 + 비용 관리 | MCP "전화 걸 때" 실전 수화기 사용법 | 26-MCP-Zapier-툴-레퍼런스.md |
| yt-dlp 영상 리서치 | 유튜브 영상 N개 자막 일괄 추출 + 메타데이터 + 콘텐츠 사전 조사 | 책 11권 다 읽지 않고 텍스트 검색 | 27-yt-dlp-subtitle-research.md |
| EPUB 구조와 빌드 | EPUB은 사실 zip + HTML, Python으로 통째 빌드 가능 | 압축파일에 확장자만 다른 것 | 28-epub-구조와-빌드.md |
| CSS specificity + wpautop | 셀렉터 권한 다툼 + 워드프레스 자동 줄바꿈 함정 | 도장 권한 차이 + 친절한데 사고 치는 비서 | 29-css-specificity-wpautop.md |
| Whisper STT (음성→텍스트) | OpenAI 무료 모델로 녹음 자동 받아쓰기 (오프라인, 한국어 90%) | 녹음기 옆 자동 받아쓰기 비서 | 30-whisper-stt-tips.md |
| ffmpeg GIF (영상→움짤) | 2단계 팔레트로 화질 살리고 용량 50% 압축 | 옷 사진 찍기 전 자주 쓰는 색 12개 미리 고르기 | 31-ffmpeg-gif-tips.md |
| 블로그 글 아카이빙 | 셀레니움 없이 발행 글 → 마크다운. iframe 우회 + invisible 문자 청소 + <a> 마크다운화 |
본문이 "감춘 방"에 있으면 진짜 주소 찾아 직접 들어가기 | 33-블로그-아카이빙.md |
| Git 커밋 30초 보험 | git status --short + git diff --cached로 placeholder/누락 함정 사전 차단 |
이사 박스에 라벨 붙은 것만 트럭이 가져감 | 34-git-commit-checklist.md |
| Astro 콘텐츠 컬렉션 패턴 | frontmatter의 photos[0]/title은 자동 hero 노출. 본문에 또 쓰면 중복 | 이력서 양식에 적은 이름이 명함에 자동 인쇄 | 35-astro-content-collection-patterns.md |
| PDF 텍스트 추출 한계 | PDF는 그래픽 명령어. 줄바꿈 시 띄어쓰기 정보 사라짐. PDF 페어 사전 매칭으로 추정. 0% 정확도는 InDesign 원본 필요 | 사진 찍은 책에서 글자 따오기 - 답은 사진 안 어디엔가 있음 | 36-pdf-텍스트-추출-한계.md |
| 파이썬 monkey-patch | 라이브러리 코드 안 건드리고 외부에서 모듈 상수 덮어쓰기. cafe_core.CAFE_ID = '...' 한 줄로 다른 카페에 재사용 |
가게 들어올 때만 라벨 바꿔치기 (본사는 그대로) | 37-monkey-patch-python.md |
| 카카오맵 도메인 인증 + SPA SDK | 401 = 도메인 미등록("JavaScript SDK 도메인" 필드 별도). SPA에선 autoload=false 필수 — document.write 함정 |
회사 출입 카드 등록 + 우편함 닫힌 후엔 손으로 옆에 넣기 | 38-카카오맵-도메인-인증과-SPA-SDK.md |
| WebFetch HTTPS 강제 → curl 우회 | WebFetch는 HTTP를 자동 HTTPS로 변환. HTTPS 없는 사이트(국내 중소 호텔/공공)는 TLS 에러 → curl -sk 한 줄로 우회 |
보안 우체국이 등기 봉투만 받는데, 일반 우체통밖에 없는 동네면 직접 부치기 | 39-webfetch-https-강제-우회.md |
| 사이트 런칭 풀스택 셋업 | 도메인 + 이메일(받기 Email Routing + 보내기 Gmail 별칭/SPF) + 검색엔진(구글/네이버) + 측정(CF/GA4) + AEO(llms.txt). 함정 12가지 + 체크리스트 + 코드 스니펫 | 가게 오픈할 때 간판·전화·전단지·CCTV·구글지도 등록을 한 번에 | 40-site-launch-fullstack.md |
| 다이내믹 워크플로 | Opus 4.8 기능. AI 여러 명을 서로 다른 입장으로 동시에 돌려 적대적 비평 → 수렴 → 결론. 혼자 판단보다 약점이 드러남 | 회의에 '반대 역할(레드팀)'을 일부러 앉히기 | 42-다이내믹워크플로.md |
언제 무엇을 쓰는가 (의사결정 트리)¶
"이 작업을 자동화하고 싶다"
│
├─ 반복하는 작업인가?
│ ├─ YES → Skill (/명령어로 실행)
│ └─ NO → Cowork (일회성 작업)
│
├─ 조사량이 엄청 많은가? (파일 50개 이상 읽기 등)
│ ├─ YES → Sub-agent (결과 요약만 받기)
│ └─ NO → Skill (직접 처리)
│
├─ 여러 독립된 관점이 필요한가?
│ ├─ YES → Agent Team (팀원들이 각자 조사 후 종합)
│ └─ NO → Skill 또는 Sub-agent
│
└─ 외부 서비스(노션, GitHub 등)에 연결해야 하는가?
├─ YES → MCP Server 연결 (어떤 도구와든 조합 가능)
└─ NO → 로컬에서 처리
학습 순서 추천¶
[1] Skill ──────── 가장 먼저, 가장 많이 쓰게 됨
[2] MCP ─────────── Skill과 조합하면 노션 등 외부 연동 가능
[3] Cowork ──────── 이미지/파일 작업에 보조적으로 활용
[4] Sub-agent ───── 대량 조사 등 특수 상황에 사용
[5] Agent Team ──── 출판사 에이전트 연합 같은 큰 프로젝트
외부 서비스 연동 현황¶
| 서비스 | 자동 업로드 | 방법 | 상세 |
|---|---|---|---|
| 노션 | O | Notion MCP | 읽기/쓰기 모두 가능 |
| 네이버 블로그 | X | API 종료 (2020) | 글 자동 생성 → 수동 복사 |
| 티스토리 | X | API 종료 (2024) | 글 자동 생성 → 수동 복사 |
| GitHub | O | GitHub MCP | PR, 이슈 등 |
| 워드프레스 | O | REST API | 자동 포스팅 가능 |
| 인스타그램 | △ | 비공식 REST API | 공개 프로필 읽기만 (쓰기 X). 공식 API는 자기 계정만 |
상세: 06-블로그-API-현황.md
이 폴더 구조¶
study/
├── 00-개념지도.md ← 지금 보고 있는 파일 (전체 맵)
├── 01-skill.md ← Skill 상세 개념
├── 02-subagent.md ← Sub-agent 상세 개념
├── 03-agent-team.md ← Agent Team 상세 개념
├── 04-mcp.md ← MCP 상세 개념
├── 05-cowork.md ← Cowork 상세 개념
├── 06-블로그-API-현황.md ← 네이버/티스토리/노션 연동 현황
├── 07-skill-optimization.md ← 스킬 통합 관리/최적화 설계
├── 08-remotion-skills.md ← Remotion Skills (코드로 영상 만들기)
├── 09-claude-code-commands.md ← 주요 명령어 & 단축키 레퍼런스
├── 10-automation-playbook.md ← 자동화 판단 기준 (Claude vs 직접)
├── 11-agent-design-guide.md ← Agent 설계 실전 가이드 (함정, 체크리스트, 사고 일지)
├── 12-web-dev-patterns.md ← 웹 개발 패턴 & 실수 방지 (CSS Grid, iframe, 구조 관리)
├── 13-skills-agents-비교.md ← Skills/Agents/Sub-agents/Agent Teams 4가지 비교
├── 14-hwp-com-automation.md ← 한글(HWP) COM 자동화 (DOCX→HWP 변환)
├── 15-multi-device-sync.md ← 여러 노트북에서 Claude Code 작업 이어가기
├── build-case-sigil-css-guide.md ← 빌드 케이스 #1: 시길 CSS 가이드
├── build-case-ai-prompt.md ← 빌드 케이스 #2: AI 프롬프트 사이트
├── build-case-subway-app.md ← 빌드 케이스 #3: 지하철 +/- 방향 표기 앱 (카카오맵+공공API)
├── 16-file-format-tips.md ← 파일 포맷 다루기 (엑셀/PPT/텍스트 함정+해결)
├── 17-seo-tips.md ← SEO 실전 팁 (API 발행, 네이버 vs 구글)
├── 18-instagram-api-automation.md ← 인스타그램 비공식 API 자동화 (프로필/좋아요/댓글 수집)
├── 19-streamlit-cloud-배포가이드.md ← Streamlit Cloud 배포 (Python 앱 무료 배포)
├── 20-webapp-automation-guide.md ← 웹앱 자동화 (Apps Script vs Cloudflare Workers)
├── build-case-meeting-scheduler.md ← 빌드 케이스: 미팅 예약 시스템 (의사결정 과정)
├── cloudflare-pages-functions.md ← CF Pages Functions + D1 + R2 (정적사이트에 API 붙이기)
├── sms-email-api-guide.md ← SMS(알리고)/이메일(Resend)/카카오 알림톡 API 가이드
├── 21-macbook-basics.md ← 맥북 기초 (윈도우→맥 전환, 키보드, 터미널, 갤럭시 미러링)
└── 22-image-processing-tips.md ← 이미지 처리 (YuNet 얼굴블러, EXIF 회전, SEO 파일명)
새로운 개념을 배울 때마다 파일을 추가한다.