개발자 없이 교회 앱 만들기 — 시편 챌린지 관리 시스템 구현기

# [Claude Code] 개발자 없이 교회 앱 만들기 — 시편 챌린지 관리 시스템 구현기

## 📝 한줄 요약
매주 카톡으로 일일이 확인하던 아이들의 시편 읽기 현황을, Claude Code로 자동 집계·관리 웹앱으로 만들었습니다.

**바쁘시면 이것만 읽어도 돼요:**
- Airtable로 시작했는데 Claude가 알아서 "Next.js 앱이 낫다"고 방향 제안
- 보상 조건(30일 연속·150편 완독) 자동 계산, 관리자 CSV 내보내기까지 한 번에 구현
- API 토큰 오류도 Claude가 원인 찾아서 해결
- 개발 지식 없어도 "이런 기능이 필요해"라고 설명하면 구현까지 됨
- 현재 Supabase 연동 시도 중 — 배포까지 도전 계속 중

---

## 🎯 이런 분들께 도움돼요
- 교회 사역자, 교사처럼 비개발자인데 관리 업무가 많은 분들
- AI로 반복 업무를 자동화하고 싶은 분들
- 개발자 없이 뭔가 만들어보고 싶은 분들

---

## 😫 문제 상황 (Before)

교회에서 아이들이 매일 시편을 읽고 녹음해서 카톡으로 보내주는 프로그램을 운영하고 있었습니다. 아이들이 열심히 참여해줬는데, 관리하는 사람 입장에서는 고민이 생겼습니다.

누가 오늘 읽었는지, 몇 편까지 읽었는지, 30일을 다 채웠는지 — 이걸 카톡 메시지를 일일이 뒤져서 확인해야 했습니다. 보상 기준도 있었습니다. 30일 연속으로 읽으면 상품권(고학년 3만원, 저학년 1만원), 시편 150편을 다 읽으면 추가 보상(고학년 5만원, 저학년 3만원). 이 기준을 누가 달성했는지 수기로 계산하는 건 한계가 있었습니다.

부모님들도 "우리 아이 몇 편까지 읽었어요?"라고 물어볼 때마다 일일이 확인해서 답해줘야 했습니다. 이걸 자동화할 수 없을까 싶어서 Claude Code한테 말을 걸었습니다.

---

## 🛠️ 사용한 도구
- **도구**: Claude Code
- **모델**: Claude Sonnet 4.6
- **환경**: Windows 11, VSCode

---

## 🔧 작업 과정

### Airtable로 시작했다가 — 방향을 바꾼 이야기

처음에는 에어테이블로 관리하면 되겠다 싶었습니다. Claude한테 구조를 짜달라고 했더니, 학생 테이블·부모님 테이블·읽기 기록 테이블 3개로 설계해줬습니다. 에어테이블 MCP를 연결해서 테이블도 직접 만들어줬습니다.

```
새 베이스(요셉의 매일시편) 만들어줘.
부서 구분은 없고, 학생 이름·학년·읽은 시편 편수·날짜 관리하고 싶어.
```

그런데 진행하다 보니 문제가 생겼습니다. "아이들이 자기가 얼마나 읽었는지 진행률을 보고 싶어"라고 하자, Claude가 솔직하게 말했습니다. "에어테이블에서 그런 시각적 화면은 유료 플랜이 필요해요. Next.js 앱으로 만들면 무료로 더 예쁘게 만들 수 있어요."

도구를 직접 바꿔준 게 아니라, 더 나은 방향을 알려준 것이었습니다. 처음부터 완벽한 도구를 고르지 않아도 괜찮다는 걸 그때 알았습니다.

---

### API 토큰 오류 — Claude가 원인을 찾아줬다

에어테이블 작업 중 계속 권한 오류가 났습니다. 토큰을 수정했는데도 오류가 반복됐습니다.

```
스코프랑 베이스 설정은 완벽한데 왜 계속 오류가 나지?
```

Claude가 설정 파일을 뒤져서 원인을 찾아냈습니다. MCP 서버가 사용하는 토큰이 제가 수정한 토큰이 아닌 다른 토큰이었던 것입니다. 저는 에러 메시지만 붙여넣었을 뿐인데, Claude가 어느 토큰을 고쳐야 하는지까지 알려줬습니다.

오류가 나도 당황하지 말고 Claude한테 그대로 보여주면 됩니다.

---

### 기능 하나 추가했더니 — 생각보다 많이 나왔다

보상 조건을 추가해달라고 했습니다.

```
30일 매일 읽으면 상품권 3만원(저학년 1만원), 150편 다 읽으면 5만원(3만원)이야.
한눈에 얼마나 읽었고 얼마나 남았는지도 볼 수 있으면 좋겠어.
```

결과물을 보니 예상보다 많았습니다. 진행률 바, 달성 여부 뱃지, 보상금 합계 자동 계산, 고학년·저학년 구분 적용까지 한 번에 들어와 있었습니다. 제가 요청한 건 "보여주면 좋겠다"는 말 한마디였는데, 어떻게 보여줄지는 Claude가 알아서 설계해줬습니다.

---

### 관리자 페이지도 한 번에

```
사역자가 전체 아이들 현황을 볼 수 있는 관리자 화면도 필요해.
```

이름 검색, 학년 필터, 보상 달성 여부 필터, CSV 내보내기까지 한 화면에 나왔습니다. 엑셀로 내보낼 때 한글이 깨지지 않도록 인코딩 처리도 되어 있었습니다. 제가 요청하지 않은 부분인데 알아서 챙겨준 것입니다.

---

### 지금은 — Supabase 연동 시도 중

앱 기능은 완성됐는데, Supabase 데이터베이스 연결이 아직 안 되고 있습니다. 배포도 아직입니다. Claude Code와 함께 계속 원인을 찾고 있습니다.

배포가 안 된 상태에서도 이 글을 쓰는 이유는, 완성보다 과정이 더 나눌 게 많기 때문입니다.

---

## ✅ 결과 (After)

### Before vs After
| 항목 | Before | After |
|------|--------|-------|
| 현황 확인 | 카톡 메시지 일일이 확인 | 앱에서 이름 검색 한 번 |
| 보상 대상자 파악 | 수기 계산 | 자동 집계 + 필터링 |
| 부모님 문의 대응 | 직접 확인 후 답변 | 부모님이 앱에서 직접 확인 |
| 배포 여부 | — | 연동 시도 중 |

### 결과물
- 시편 낭독 인증 제출 폼 (녹음 파일 업로드 / 링크 제출)
- 학생 개인 현황 대시보드 (연속일수, 누적편수, 보상 진행률)
- 관리자 대시보드 (전체 현황, 필터, CSV 내보내기)

---

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

### 효과적이었던 것
1. **처음부터 완벽한 도구를 고르지 않아도 됩니다** — Airtable로 시작했다가 Next.js로 바꿨는데, Claude가 더 나은 방향을 알아서 제안해줬습니다.
2. **오류 메시지를 그대로 붙여넣으면 됩니다** — 뭐가 문젠지 몰라도 괜찮습니다. Claude가 원인을 찾아줍니다.
3. **"이런 기능이 필요해"라고 설명하면 구현까지 됩니다** — 개발 용어를 몰라도, 어떤 상황인지만 설명하면 됩니다.

### 이렇게 하면 안 돼요
1. **오류 나면 포기하지 마세요** — 연동이 안 되는 것도 Claude한테 계속 물어보면 결국 해결됩니다. 아직 진행 중이지만, 그게 과정입니다.
2. **한 번에 완성하려고 하지 않아도 됩니다** — 기획 → 구조 설계 → 기능 추가 순서로 대화하듯 진행하면 됩니다.

---

## 🌍 다른 업무에 적용한다면?
- 출석 체크, 봉사 일정 관리, 헌금 집계 등 교회 행정 업무 전반에 같은 방식으로 적용 가능합니다.
- 학원, 독서 모임, 사내 챌린지 등 "누가 얼마나 했는지 추적해야 하는 모든 상황"에 쓸 수 있습니다.

---

## 🚀 앞으로의 계획
1. Supabase 연동 완료하고 실제 아이들이 쓸 수 있게 배포하기
2. 주간 현황을 부모님들께 자동으로 문자/카톡으로 보내주는 기능 추가
3. 다른 교회나 학교에서도 쓸 수 있게 확장하기

---

## 📋 재사용 가능한 프롬프트

### 프롬프트 1: 관리 시스템 기획 시작
> [대상]이 [활동]을 [주기]로 하고 있어. 이걸 데이터로 관리하면서 [누구]한테 공유하고 싶어. [확인하고 싶은 항목들]도 보고 싶고. 구현이 가능할까?

### 프롬프트 2: 오류 해결 요청
> [오류 메시지 전체 붙여넣기] 이 오류가 계속 나는데 원인이 뭐야? 해결해줘.

### 프롬프트 3: 기능 추가 요청
> [조건/규칙]이 있는데, 한눈에 [확인하고 싶은 것]을 볼 수 있으면 좋겠어.