바이브코딩, MCP, 관계형 DB — 핵심 개념

1. 바이브코딩이란?

예전 방식: AI 서비스 투어

ChatGPT 열기 → 상황 설명 → 답변 복사
    ↓
Claude 열기 → 또 상황 설명 → 답변 복사
    ↓
내 작업 환경으로 돌아와서 붙여넣기
    ↓
안 되네? → 다시 AI한테 가서 설명...

문제점:

🔄 컨텍스트 스위칭 지옥 — 브라우저 탭 왔다갔다
📋 복붙 노가다 — 코드 복사, 에러 복사, 결과 복사…
🧠 매번 처음부터 설명 — “나는 PM이고, 이 프로젝트는…”
🚫 AI가 내 파일을 못 봄 — 스크린샷 찍어서 올려야 함

지금 방식: AI가 내 작업 환경에 들어옴

VSCode에서 작업 중
    ↓
"이거 해줘" (자연어로 말함)
    ↓
Claude가 직접 파일 읽고 → 수정하고 → 실행까지
    ↓
결과 확인 → 마음에 안 들면 "다시 해줘"

비유

예전 = 전문가한테 전화해서 물어보기 → 설명 듣고 → 직접 해보기
지금 = 전문가가 옆에 앉아서 같이 작업 → “이거 해줘” → 바로 해줌

그래서 “바이브코딩”

Vibe = 분위기, 느낌, 의도

코드를 한 줄 한 줄 짜는 게 아니라, “이런 느낌으로 해줘” 라고 의도만 전달하면 AI가 구현합니다.

❌ 예전: "fetch API로 GET 요청 보내고 response.json()으로 파싱해서..."
✅ 지금: "이 API에서 데이터 가져와서 표로 보여줘"

”코딩” 안 해도 바이브코딩입니다

직무	바이브코딩 예시
PM	”이 PRD 문서 읽고 유저 스토리 정리해줘”
리서처	”인터뷰 녹취록 5개 읽고 인사이트 뽑아줘”
마케터	”경쟁사 분석 자료 만들어줘”
누구나	”회의록 정리해줘”, “보고서 초안 써줘”

🎯 핵심: 여러분은 무엇을 원하는지만 말하세요. 어떻게 하는지는 Claude가 알아서 합니다.

2. MCP란?

한 줄 정의

MCP = AI용 USB-C 포트

USB-C 하나로 충전기, 모니터, 키보드 다 연결하듯이, MCP 하나로 Airtable, Gmail, 브라우저 등 다양한 서비스에 연결합니다.

MCP 안에는 뭐가 있나요?

각 MCP 서버 안에는 **Tools(도구)**가 들어있습니다.

💡 비유: MCP는 “앱”, Tools는 앱 안의 “기능 버튼”

MCP 예시 3개

📊 Airtable MCP — 데이터베이스 연결

Claude가 Airtable DB를 직접 읽고 쓸 수 있게 해줍니다. 오늘 실습에서 사용!

Tool	설명
`list_bases`	내 Airtable에 있는 베이스 목록 조회
`list_records`	특정 테이블의 데이터 조회
`create_record`	새 레코드 추가
`update_record`	기존 레코드 수정
`search_records`	조건에 맞는 레코드 검색

"프로그램 테이블에서 모집중인 것만 보여줘"
→ Claude가 Airtable MCP의 search_records Tool을 호출
→ 결과를 정리해서 보여줌

🌐 Playwright MCP — 웹 브라우저 제어

Claude가 웹 브라우저를 직접 열고 조작할 수 있게 해줍니다.

Tool	설명
`browser_navigate`	특정 URL로 이동
`browser_click`	버튼/링크 클릭
`browser_type`	텍스트 입력
`browser_screenshot`	현재 화면 스크린샷
`browser_snapshot`	페이지 구조 파악

"네이버에서 '소셜임팩트' 검색 결과 스크린샷 찍어줘"
→ Claude가 Playwright MCP로 브라우저를 열고 → 검색하고 → 캡처

📚 Context7 MCP — 공식 문서 검색

Claude가 최신 라이브러리/프레임워크의 공식 문서를 실시간으로 검색합니다.

Tool	설명
`resolve-library-id`	라이브러리 이름으로 ID 조회
`get-library-docs`	공식 문서에서 관련 내용 검색

"Airtable API에서 레코드 생성하는 방법 공식 문서에서 찾아줘"
→ Claude가 Context7 MCP로 최신 공식 문서를 검색
→ 정확한 코드 예시와 함께 답변

💡 이 외에도 Gmail, Google Calendar, Slack, GitHub 등 수백 개의 MCP 서버가 있습니다. 필요한 서비스가 있으면 MCP를 설치하면 Claude가 바로 사용할 수 있어요.

언제 호출되나요?

Claude가 대화 중에 “이건 내 힘만으로 안 되겠다” 싶을 때 자동으로 호출합니다.

여러분이 하는 말	Claude가 호출하는 것
”Airtable에서 지원자 목록 보여줘”	Airtable MCP
”Gmail에서 오늘 온 메일 알려줘”	Gmail MCP
”이 사이트 열어서 스크린샷 찍어줘”	Chrome DevTools MCP

🎯 핵심: 여러분은 자연어로 요청만 하면 됩니다. 어떤 MCP의 어떤 Tool을 쓸지는 Claude가 알아서 판단합니다.

작동 방식

여러분 요청 → Claude 판단 → MCP 호출 → 외부 서비스 → 결과 반환

설치: MCP 서버를 컴퓨터에 설치 (한 번만)
인식: Claude가 설치된 MCP 목록을 자동으로 인식
사용: 대화 중 필요하면 Claude가 알아서 호출
결과: 외부 서비스 데이터를 가져오거나 작업 수행

💡 MCP 내부 작동 방식은 몰라도 됩니다. **“설치하면 Claude가 알아서 쓴다”**만 기억하세요.

3. 관계형 DB란?

왜 엑셀로는 한계가 오는지, 엑셀을 써온 분들이 많을 테니 예시로 보여드릴게요.

교육프로그램을 엑셀로 관리한다고 해볼게요.

처음엔 괜찮아요:

프로그램	강사이름	강사연락처	강사이메일
AI 업무자동화	송다혜	010-xxxx	dahye@…

그런데 강사가 2명이 되면?

프로그램	강사이름1	강사연락처1	강사이메일1	강사이름2	강사연락처2	강사이메일2	…

열이 두 배로 늘어남 😰 여기에 보조강사까지 붙으면? 강사이름3, 연락처3, 이메일3…

교육프로그램이 하나 더 생기면?

프로그램	강사이름1	강사이메일1	…
A프로그램	송다혜	dahye@gpters.org	…
B프로그램	송다혜	dahye@gpters.org	…

송다혜 강사가 A, B 둘 다 하니까 같은 정보가 2번 들어가요.

그런데 송다혜 강사가 이메일을 바꾼대요.

→ A프로그램 행에서 수정… B프로그램 행에서도 수정… 하나 빼먹으면? 2중 관리의 지옥 🔥

지원자도 마찬가지예요.

김철수 씨가 A프로그램, B프로그램 둘 다 지원했다면?

프로그램	…	지원자이름	지원자연락처	지원자이메일
A프로그램	…	김철수	010-1234	cs@…
B프로그램	…	김철수	010-1234	cs@…

같은 사람 정보가 또 중복. 김철수 씨 연락처가 바뀌면? 두 곳 다 수정… 20개 프로그램에 걸쳐 참여한 단골 지원자라면? 20곳을 다 찾아서 수정해야 해요 😩

“김철수 씨가 지금까지 참여한 프로그램 전부 보여줘” → Ctrl+F 노가다…

관계형 DB로 하면?

테이블을 나누고 링크로 연결합니다:

[프로그램] ──Link──→ [강사]
    │
    └──Link──→ [지원자]

프로그램 테이블	강사 테이블	지원자 테이블
A프로그램	송다혜 — dahye@…	김철수 — 010-1234
B프로그램	이은주 — eunju@…	박영희 — 010-5678

송다혜 정보는 딱 한 곳에만 → 이메일 바꾸면 자동 반영
김철수가 A, B 둘 다 지원해도 → 김철수 정보는 한 곳, Link만 2개
“김철수가 참여한 프로그램 전부” → 링크 타고 1초 만에 조회
지원자가 100명이어도 행만 추가하면 끝

이 차이, 직접 보여드릴게요! (Airtable 시연)

핵심 용어 4개

용어	쉬운 설명	예시
테이블	엑셀 시트 하나	”스터디” 테이블
레코드	행(row) 하나	”AI 업무자동화” 한 줄
필드	열(column)	스터디명, 날짜, 상태
Link	테이블끼리 연결하는 줄	스터디 → 스터디장 연결

🎯 오늘 실습에서 이 구조를 Claude한테 말로 설명해서 Airtable에 자동으로 만들어봅니다!

정리

개념	한 줄 설명	비유
바이브코딩	의도만 말하면 AI가 만들어줌	전문가가 옆에서 같이 작업
MCP	AI가 외부 서비스에 연결하는 포트	USB-C 포트
관계형 DB	테이블을 나누고 링크로 연결	엑셀 시트끼리 줄로 연결

💡 오늘 실습에서 Airtable MCP를 설치하고, Claude에게 말로 DB를 만들어봅니다. → 실습: Airtable MCP로 DB 만들기