[Claude Code] 바이브 코딩 초보자의 우당탕탕 과제하기 - 데이터 시각화

📝 한줄 요약

바이브코딩의 'ㅂ'도 모르던 왕초보가 Claude Code와 함께 엑셀 데이터를 Airtable에 올리고, 대시보드까지 만들어 인터넷에 배포하기까지 — 코딩 한 줄 모르던 초보자의 새벽 3시간 분투기.

바쁘시면 이것만 읽어도 돼요:

• 교육 통계 1,477건을 Claude Code로 Airtable에 자동 업로드

• "GitHub는 나랑 무관한 사이트"라고 생각했는데, 오늘 거기서 대시보드를 배포했다

• 오류가 나도 Claude한테 그대로 보여주면 알아서 해결해준다

• 똑같이 했는데 갑자기 되는 경우도 있다 — 당황하지 말 것

• 천천히 한 걸음씩 따라하면 누구나 할 수 있다

🎯 이런 분들께 도움 돼요

• 바이브코딩 스터디를 신청했는데 설치부터 막혀서 막막하신 분

• 엑셀로 데이터를 관리하다가 한계를 느끼는 비개발자

• AI 도구가 신기하긴 한데 '나는 못 하겠지'라고 생각하는 분

• GitHub, Airtable이 뭔지는 알지만 한 번도 써본 적 없는 분

😫 문제 상황 (Before)

밀려만 가던 과제들과 대면이 필요해진 상황

숫자로만 보던 통계자료를 시각화 - > 보기 좋은 이미지로 배포

🛠️ 사용한 도구

• 도구: Claude Code

• 모델: Claude Sonnet 4.6

• 데이터: 2021년 교육실적 엑셀 파일 (1,477행, 22개 컬럼)

• 특이사항: GPT도 중간중간 같이 물어보며 진행

🔧 작업 과정

Airtable, 일단 첫번째 실습부터 하나하나 차근차근!

나는 비영리 단체에서 교육프로그램을 운영하고 있어.
지금까지 엑셀로 프로그램, 강사, 참가자를 관리했는데 Airtable로 옮기고 싶어. 도와줘!

Claude는 바로 "어떤 데이터를 관리하세요?"라고 물어봤고, 제가 3가지(교육프로그램 / 강사 / 지원서)를 설명하자 관계형 구조를 설계해줬어요. 한 프로그램에 강사가 여러 명 연결되고, 지원서도 여러 개 달릴 수 있는 구조로요. 테이블 설계를 이렇게 대화로 할 수 있다는 게 신기했어요.

우당탕 1: MCP 연결했는데 오류가?

Airtable MCP를 연결하고 나서 이런 메시지가 떴어요.

에어테이블과 MCP 연결이 안 된 것 같아서 다시 했는데 이런 메세지가 떠.

MCP server airtable already exists in local config — 처음엔 뭔가 잘못된 줄 알고 당황했어요. 근데 Claude 曰: "에러가 아니에요. 이미 등록되어 있어서 중복 추가를 막아준 거예요." 라고 했지만, 그런데 왜 넌 작동을 안하는거야? 하며 답답했죠, 그래도 여러번의 시도 끝에 성공을 했답니다. 그런데 앞선 방법으로 똑같이 했는데 이번엔 성공을 해서 한편으로는 '시간이 필요했나보다..' 싶기도 했어요 ㅎ

우당탕 2: 토큰을 두 번 발급 받다

API 토큰 설정도 한 번에 되지 않았어요. 토요일 오프모임을 못가서 세션을 다시 들으며 실습을 해봤는데 Context7 API 키를 터미널에 붙여넣었는데 저장될 때 깨져 있었다고 하고, GitHub 토큰은 Fine-grained로 만들었더니 권한이 부족해서 Classic으로 다시 발급받아야 한다고 했어요.

토큰 생성 화면인데 이 부분은 뭐라고 셋팅해?

앞에서 에어테이블 파트에서 단련이 되어서 이제는 뭐 당황스럽지도 않았어요 사실, 이런 과정에 익숙해지니 오히려 더 쉽게 풀리는 것도 같았습니다.
막히는 문구나 화면을 스크린샷을 보내며 물어봤더니 어떤 옵션을 선택해야 하는지 딱 알려줘서더 좋았어요.

감탄 1: 엑셀 1,477개가 그대로 올라갔다

에어테이블에도 엑셀 업로드 기능이 있어서 바로 올려봤는데, 에어테이블은 다소 실망스러웠어요. 기준값이나 이런것들이 좀 기존 파일과 다르게 업로드가 되더라구요. 그래서 엑셀파일을 폴더에 넣고 파일을 읽고 에어테이블에 업로드 하도록 프롬프트를 썼고, Claude가 파일 구조를 분석하고해서 기존 파일과 동일한 데이터를 입력해줬어요.

2021교육실적_2022.03.28.xlsx 파일에 있는 데이터를 모두 에어테이블에 새 테이블에 입력해줘.

결과: 1,477개 레코드 업로드 완료, 실패 0건.

감탄 2: 대시보드가 이렇게 예쁠 줄이야

데이터가 다 올라가고 나서 시각화를 요청했어요.

데이터가 채워지지 않은 열의 값은 생략해주고,
이 데이터를 기반으로 대시보드를 만들어줘. 데이터 시각화를 포함시켜서 만들어줘.

관련해서 git hub를 연결하는 과정도 필요했는데 알아서 척척척 세부 버튼, 경로 하나하나 알려줘서 어렵지 않았어요. 닿님이, 세션중에 '다 알지 않아도 돼요' 라고 하신 부분이 이런거구나 싶었어요. git hub 사이트 보면 마치 우주에 와 있는 듯 낯설기만 한데 이렇게 콕 집어서 알려주니까 너무 쉽게 느껴지더라구요!

감탄 3 (그리고 깨달음): GitHub로 배포하다

대시보드를 만들고 나서 "외부에서도 볼 수 있게 배포해줘"라고 했어요. Claude가 GitHub Pages, Netlify, surge.sh 세 가지 옵션을 비교해줬고, GitHub 계정이 있다고 하니 바로 그걸로 진행했어요.

저는 평생 GitHub는 개발자들만 쓰는 사이트라고 생각해왔거든요. 그런데 Claude가 토큰 발급 방법부터 차근차근 알려주면서 — 레포 만들고, 파일 올리고, Pages 설정하는 걸 다 자동으로 처리해주고 몇분만에 URL 을 만들어주는 걸 보니까 예상보다 더 금방 되네? 정말 바이브 코딩이 쉽다는걸 체감할 수 있었어요.

✅ 결과 (After)

Before vs After

결과물

• Airtable 20NN교육실적 테이블: 1,477건 데이터

• 인터랙티브 대시보드: 기관의 자료라서 일부만 캡쳐로 공개합니다.

ALT

한국 회사의 대시보드

💬 이 과정에서 배운 AI 활용 팁

효과적이었던 것

1. 오류 메시지를 그대로 복붙하기 — 뭔지 몰라도 일단 Claude한테 보여주면 설명해줌

2. 스크린샷으로 질문하기 — "이 화면에서 뭐 선택해?"도 된다

3. "도와줘" 한 마디면 충분 — Claude가 필요한 정보를 알아서 물어봄

4. 막히면 한 번 더 — 똑같이 했는데 되는 경우가 생각보다 많음

이렇게 하면 안 돼요

1. 혼자 끙끙거리지 말기 — 모르면 바로 물어볼 것

2. 오류를 보고 포기하지 말기 — 오류처럼 보여도 정상인 경우도 있음

3. "나는 못 하겠지" 하고 시작도 안 하기 — 일단 말을 걸면 된다

저는 사전 준비를 강의 전에 끝내지 못해서 도미노처럼 실습과 과제를 밀리게 되었는데,

사전과제를 꼭!!!!!!! 완벽하게 준비하셔서 강의 들어가시길 추천드려요.^^

🌍 다른 업무에 적용한다면?

• 참가자 신청서 → Airtable 자동 정리 + 선발 현황 대시보드

• 프로그램별 강사 매칭 현황을 한눈에 보는 뷰 만들기

• 연간 보고서용 통계 차트를 매번 새로 만들지 않고 대시보드로 대체

• 보고자료 제작 시 웹페이지로 활용

🚀 앞으로의 계획

사실 이번 통계 작업은 제가 원래 해보고 싶었던 파트는 아니에요. 다른 업무 자동화를 더 해보고 싶은 게 있거든요. 이번 작업이 그걸 위한 마중물이 된 것 같아요.

2주치 밀린 과제를 해치우고 나니 "다음 건 좀 덜 밀리겠다"는 자신감이 생겼어요. 다시보기가 있어서 다행이고, 천천히 한 걸음씩 계속 나아가 보려고 합니다.

📋 재사용 가능한 프롬프트

프롬프트 1: 엑셀 데이터를 Airtable에 올릴 때

[파일명.xlsx] 파일에 있는 데이터를 Airtable [베이스 이름]에 새 테이블로 만들어줘. 빈 값은 생략하고, 숫자 컬럼과 텍스트 컬럼을 구분해서 올려줘.

프롬프트 2: 데이터 대시보드 만들 때

이 데이터를 기반으로 대시보드를 만들어줘. [보고 싶은 항목들 — 예: 지역별 현황, 연도별 추이]을 시각화에 포함시켜줘.

프롬프트 3: 오류가 났을 때

이런 오류가 떴어: [오류 메시지 그대로 붙여넣기] 어떻게 해결하면 돼?