목록으로
교육·학습을 위한 AI 활용
100% 바이브코딩으로 이룬 공교육 디지털 전환: 오성중학교 '에듀테크 허브' 구축기
비개발자 교감이 오직 AI와의 대화(바이브코딩)만으로 학교 행정과 데이터 관리를 아우르는 맞춤형 통합 플랫폼을 구축해 낸 공교육 디지털 혁신 사례입니다.
🤖 활용 AI 도구
Claude, Gemini, Google Apps Script, 뤼튼
========================================================
① 어떤 상황에서 AI를 활용했나요?
========================================================
경기도 평택시에 위치한 오성중학교는 전교생 110명, 6학급의 소규모 학교입니다. 소규모 학교는 큰 학교와 같은 교육 목표를 추구하면서도, 예산·인력·인프라 모든 면에서 제약이 큽니다. 저는 교감으로서 학교 현장의 세 가지 핵심 문제를 해결하기 위해 AI를 활용하게 되었습니다.
첫 번째 문제는 기초학력 관리의 어려움이었습니다. 24명의 학생별 기초학력 진단 결과를 과목별·영역별로 분석하고 학부모에게 개별 리포트를 제공하는 일은 수작업의 연속이었습니다. Excel로 데이터를 정리하고, 일일이 그래프를 그리고, 한 명 한 명 소견을 작성하는 데 며칠이 걸렸습니다.
두 번째 문제는 학생 맞춤형 학습 도구의 부재였습니다. 시중의 에듀테크 앱은 대형 학교나 학원을 대상으로 설계되어 있어, 우리 학교 교육과정과 학생 수준에 꼭 맞는 도구를 찾기 어려웠습니다. 수학 기초 연산이 부족한 학생에게는 그 학생의 수준에 맞는 문제가 필요하고, 영어 학습에서는 우리 학교 교과서 진도에 맞춘 단어와 문장이 필요했습니다.
세 번째 문제는 학교 행정 업무의 비효율이었습니다. 가정통신문 발송·회수 추적, 학생 역할 관리, 동료 장학 기록, 목표제 운영 등 학교 행정 업무는 대부분 종이 문서와 수기 기록에 의존하고 있었습니다. 디지털 전환이 필요하다는 것은 알았지만, 학교에는 개발자가 없었습니다.
그리고 결정적인 제약이 있었습니다. 저는 프로그래밍 전공이 아니라 코딩을 모른다는 것이었습니다. 개발 외주를 맡기기에는 소규모 학교의 예산으로는 턱없이 부족했습니다. 바로 이 지점에서 "바이브 코딩(Vibe Coding)"이라는 새로운 가능성을 발견했습니다. AI에게 자연어로 "이런 앱을 만들어줘"라고 말하면, AI가 코드를 작성해주는 방식이었습니다.
========================================================
② 어떤 AI를 어떻게 활용했나요?
========================================================
활용한 AI는 Anthropic의 Claude, Google의 Gemini API, 그리고 보조적으로 OpenAI의 ChatGPT를 사용했습니다. 핵심은 이 AI들에게 자연어 프롬프트로 원하는 기능을 설명하고, AI가 생성한 코드를 실제 서비스로 배포하는 것이었습니다.
개발 과정은 다음과 같은 5단계 대화형 프로세스로 진행됩니다.
1단계: 요구사항을 자연어로 설명합니다. 예를 들어, "학생들이 영어 단어를 손글씨로 쓰면 AI가 채점하는 앱을 만들어줘"와 같이 구체적으로 전달합니다.
2단계: AI가 HTML, JavaScript, Google Apps Script 등의 코드를 자동으로 생성합니다.
3단계: 생성된 코드를 무료 플랫폼에 배포합니다. 프론트엔드는 GitHub Pages, 백엔드는 Google Apps Script를 사용합니다.
4단계: 학생과 교사가 실제로 사용해본 뒤 발견된 문제를 AI에게 자연어로 전달하여 수정합니다. 예를 들어, "iOS에서 음성이 안 나와요"라고 말하면 AI가 Web Speech API 호환성 문제를 해결해줍니다.
5단계: 이 과정을 반복하여 앱을 지속적으로 개선합니다.
기술 스택은 모두 무료 서비스로 구성했습니다. AI 코드 생성에는 Claude와 ChatGPT를, 앱 내 AI 튜터 기능에는 Gemini API를, 웹앱 호스팅에는 GitHub Pages를, 백엔드 데이터 처리에는 Google Apps Script를, 데이터베이스에는 Google Sheets를, 데이터 시각화에는 Chart.js를 사용했습니다.
이 방식으로 현재 총 38종의 웹 애플리케이션을 만들어 실제 학교에서 운영하고 있습니다.
[교과 학습 앱 — 4종]
(1) 오성 연산 마스터: 수학 기초연산 훈련 앱입니다. 학생별 수준을 진단한 후 맞춤형 문제를 출제합니다. 경험치(XP), 뱃지, 연속학습 스트릭 등 게이미피케이션 요소를 넣어 학생들의 학습 동기를 유발합니다. 분수의 시각적 표현(파이 차트)까지 자동 렌더링됩니다.
(2) English Quest: 게이미피케이션 영어학습 앱입니다. Canvas API로 손글씨 영어 쓰기를 인식하고, Web Speech API로 발음을 들려줍니다. 교사 대시보드에서 학생별 학습 진도를 실시간 확인할 수 있습니다.
(3) 올바른 언어생활: 국어 음운론·문법 자기주도 학습 앱입니다. Gemini AI가 튜터 역할을 하며, 학생이 틀린 문제에 대해 대화형으로 설명해줍니다.
(4) 오성역사톡!!: 역사 교육 앱입니다. AI와 역사 인물 대화, 역사 카드 수집, 랭킹 보드 등으로 역사 학습을 게임처럼 즐길 수 있습니다.
[학교 경영·행정 앱 — 6종]
(5) 기초학력 진단평가 대시보드: 24명 학생의 진단 결과를 10개 탭으로 분석합니다. 히트맵, 상관분석, 학부모 개별 리포트 자동 생성까지 원클릭으로 처리합니다.
(6) 가정통신문 배달부: 가정통신문 발송·열람 추적·아카이빙을 자동화합니다. 학부모가 몇 시에 열었는지, 미확인 가정은 어디인지 실시간 파악이 가능합니다.
(7) 1인 1역할 관리 시스템 v2.0: 학급별 역할 배정, 교체 일지, CSV 업로드, 학생부 기재용 문장 자동 생성 기능을 갖춘 학급 운영 도구입니다.
(8) 나의 목표제 관리 시스템: 관리자·멘토·학생 3역할 기반 목표 설정-추적-피드백 시스템입니다.
(9) 동료장학 관리 시스템: 교사 간 수업 참관 기록·피드백을 디지털화한 동료장학 운영 도구입니다.
(10) 장학금 관리 시스템: 장학금 신청-심사-지급 전 과정을 관리하는 행정 도구입니다.
[플랫폼·도구 — 5종]
(11) EduTech Hub 포털: 위 모든 앱을 한곳에서 접근할 수 있는 통합 포털 사이트입니다. GitHub API 기반 관리자 패널로 프로젝트를 동적으로 관리합니다.
(12) 한국어 타자 연습 게임: 학생들의 타이핑 실력 향상을 위한 게임형 도구입니다.
(13) 좌표 디펜스 게임: 수학 좌표 개념을 타워 디펜스 게임으로 학습하는 교과 통합 게임입니다.
(14) Pace Maker: 자기주도 학습 관리 앱입니다. Vue.js 기반, 다크 게이밍 테마, PWA를 지원합니다.
(15) LOTTO 분석 시리즈: Python 데이터 과학 학습 차원에서 제작한 확률·통계 분석 도구입니다. 교사 본인의 AI 역량 개발을 위해 제작했습니다.
========================================================
③ 활용 결과 어떤 변화가 있었나요?
========================================================
[정량적 변화]
기초학력 진단 분석 시간이 수작업 3일에서 대시보드 자동 분석 10분으로 약 97% 절감되었습니다.
가정통신문 발송·추적은 인쇄·배포·회수에 하루가 걸리던 것이 발송 즉시 실시간 추적이 가능해지며 100% 디지털 전환을 달성했습니다.
학부모 개별 리포트 작성은 24명 × 수작업 30분 = 12시간이 걸리던 것이 원클릭 자동 생성 5분으로 단축되었습니다.
학생부 기재 문장은 역할 활동 기반으로 시스템이 자동 생성합니다.
전체 시스템 운영 비용은 월 0원입니다. GitHub Pages, Google Apps Script, Google Sheets 모두 무료 서비스이기 때문입니다. 만약 이 15종의 앱을 외주 개발했다면 앱당 최소 500만 원 × 15종 = 약 7,500만 원 이상의 비용이 들었을 것입니다.
[정성적 변화 — 학생]
오성 연산 마스터와 English Quest의 게이미피케이션 요소(XP, 뱃지, 스트릭)로 학생들이 자발적으로 반복 학습하기 시작했습니다. "선생님, 오늘 연속 7일째예요!"라며 자랑하는 학생들이 생겼습니다.
오성역사톡에서 역사 인물과 AI 대화를 하며 "역사가 재미있어졌다"는 반응이 나왔습니다.
학생들이 교감선생님이 AI로 앱을 만드는 과정을 보며, "나도 만들 수 있겠다"는 자신감을 갖게 되었습니다.
[정성적 변화 — 교사]
기초학력 진단 대시보드를 통해 데이터 기반 학생 지도가 가능해졌습니다. 히트맵에서 특정 영역이 빨간색으로 보이면 해당 영역에 대한 보충 지도를 즉시 계획할 수 있습니다.
가정통신문 배달부로 학부모 소통 누락이 제로가 되었습니다. 미확인 학부모에게 자동 리마인더를 보낼 수 있게 되었습니다.
[정성적 변화 — 학교 경영]
"디지털 전환"이 거창한 예산과 전문 인력이 필요한 일이 아니라, 교육자 스스로 AI와 함께 만들어갈 수 있다는 것을 증명했습니다.
이 경험을 바탕으로 경기도평택바이브코딩교육연구회를 조직하여, 다른 교사들에게도 바이브 코딩을 전파하고 있습니다.
토요 방과후 창의메이커스반에서 학생들에게 3D 프린팅과 함께 바이브 코딩을 소개하며, 학생 스스로 AI로 앱을 만드는 경험을 제공하고 있습니다.
========================================================
④ 나만의 방식 또는 개선 포인트는 무엇인가요?
========================================================
단순히 AI에게 "앱 만들어줘"라고 하면 쓸 만한 결과가 나오지 않습니다. 수십 개의 앱을 만들면서 정립한 나만의 체계적 방법론이 있습니다. 이를 "바이브 코딩 5단계 방법론"이라 부릅니다.
[1단계] 현장 문제 정의 — "무엇이 불편한가?"
교실과 행정실에서 매일 반복되는 불편함을 구체적으로 기록합니다. "기초학력 진단 결과를 학부모에게 쉽게 전달하고 싶다"처럼 구체적인 문제에서 출발합니다.
[2단계] 프롬프트 설계 — "AI에게 정확히 말하기"
AI에게 요구사항을 전달할 때, 막연하게 말하지 않고 맥락·대상·기술 스택·배포 방식까지 구체적으로 제공합니다. 예를 들어, "영어 학습 앱 만들어줘"는 나쁜 프롬프트이고, "중학교 1학년 학생이 영어 단어를 Canvas에 손글씨로 쓰면 AI가 채점하는 웹앱을 만들어줘. 게이미피케이션 요소(XP, 뱃지)를 넣고, 교사가 학생별 진도를 확인할 수 있는 대시보드도 포함해줘. 백엔드는 Google Apps Script, 데이터 저장은 Google Sheets, 프론트엔드는 GitHub Pages에 배포할 단일 HTML 파일로 만들어줘"가 좋은 프롬프트입니다.
[3단계] 무료 기술 스택 조합 — "돈 안 드는 구조 만들기"
소규모 학교의 현실에 맞게, 모든 것을 무료 서비스로 조합합니다. 프론트엔드는 GitHub Pages(무료 정적 호스팅), 백엔드는 Google Apps Script(무료 서버리스), 데이터베이스는 Google Sheets(무료, 직관적), AI 기능은 Gemini API(무료 할당량), 시각화는 Chart.js(오픈소스)를 사용합니다.
[4단계] 반복 대화 개선 — "AI와 핑퐁하며 완성하기"
첫 번째 결과물은 완벽하지 않습니다. 실제로 학생들이 사용해보고 발견한 버그를 AI에게 구체적으로 전달하여 수정합니다. English Quest의 경우 "iOS에서 음성이 안 나옵니다"라는 문제를 "Web Speech API가 iOS Safari에서 사용자 인터랙션 후에만 작동합니다. 버튼 클릭 이벤트에 TTS를 연결해주세요"처럼 구체적으로 전달하면 AI가 해결책을 제시합니다.
[5단계] 패턴 재사용 — "한번 배운 구조를 반복 적용"
하나의 앱을 만들면서 배운 기술 패턴을 다음 앱에 재활용합니다. config.js 파일로 API 키를 분리하는 방법, GAS POST 요청 시 CORS 문제를 방지하는 text/plain 설정, Google Sheets에서 날짜 자동변환을 방지하는 setNumberFormat('@') 적용, 단일 HTML 파일 SPA 구조 등을 한번 익히면 모든 프로젝트에 반복 적용할 수 있습니다.
[핵심 개선 포인트 1 — "완전한 파일 교체" 전략]
AI가 생성한 코드를 부분 수정(패치)하면 오류가 누적됩니다. 저는 수정이 필요할 때 항상 전체 파일을 새로 생성하여 교체하는 방식을 사용합니다. 이것이 비전공자가 코드 품질을 유지하는 가장 확실한 방법입니다.
[핵심 개선 포인트 2 — "API 키 보안" 설계]
학생용 앱에 AI 기능을 넣을 때, API 키가 노출되지 않도록 Google Apps Script를 프록시 서버로 활용하는 구조를 설계했습니다. AI에게 "API 키를 클라이언트에 노출하지 않는 구조로 만들어줘"라고 요청하면 됩니다.
========================================================
⑤ 다른 사람도 따라 할 수 있나요?
========================================================
결론부터 말하면, 네, 누구나 할 수 있습니다.
저는 컴퓨터 전공자가 아닙니다. HTML과 JavaScript의 차이를 AI에게 물어보면서 시작했습니다. 그런 제가 15개의 웹 애플리케이션을 만들어 실제 학교에서 운영하고 있습니다.
[시작하기 위해 필요한 것]
- Claude 또는 ChatGPT 계정 (무료~월 2만 원)
- GitHub 계정 (무료)
- Google 계정 (무료)
- 코딩 지식 (불필요)
- 가장 중요한 것: "내 현장의 문제를 구체적으로 설명하는 능력"
[오늘 바로 시작할 수 있는 3단계]
Step 1. Claude(claude.ai)에 접속합니다.
Step 2. 이렇게 말합니다: "나는 ○○ 업무를 하고 있는데, △△이 불편합니다. 이것을 해결하는 간단한 웹앱을 만들어주세요. HTML 단일 파일로 만들어주세요."
Step 3. AI가 만들어준 코드를 GitHub Pages에 올리면 끝입니다.
[누구에게 추천하나요?]
교사·교육자에게 추천합니다. 우리 학교, 우리 학생에게 딱 맞는 학습 도구를 직접 만들 수 있습니다. 시중 앱에 없는 우리 교과서 진도에 맞는 퀴즈 앱, 우리 학교 행사에 맞는 관리 도구를 자유롭게 만들 수 있습니다.
학교 관리자에게 추천합니다. 가정통신문 추적, 학생 데이터 분석, 업무 자동화 등 행정 효율화 도구를 예산 없이 구축할 수 있습니다.
학부모에게 추천합니다. 자녀의 학습 관리 도구, 가계부, 일정 관리 앱 등 생활 속 도구를 AI 대화만으로 만들 수 있습니다.
소상공인에게 추천합니다. 재고 관리, 고객 관리, 예약 시스템 등 업무 도구를 외주 없이 직접 만들 수 있습니다.
코딩을 배우는 것이 아니라, AI에게 내 문제를 정확히 설명하는 능력 — 이것이 2026년에 필요한 진짜 디지털 리터러시입니다.
저는 이 경험을 더 많은 교육자에게 나누기 위해 경기도평택바이브코딩교육연구회를 운영하고, 토요 방과후 창의메이커스반에서 학생들에게도 바이브 코딩을 가르치고 있습니다.
AI는 도구입니다. 하지만 그 도구를 현장의 문제 해결에 연결하는 사람의 아이디어가 있을 때, 비로소 마법이 일어납니다.
자아, 한 번 입장해 보세요. https://kkbhong71.github.io/EduTech-Hub/
(실제 운영 중에 있다보니 , 민감 정보 등이 있어 관리자의 로그인 필요, 또는 무료 구축에 따른 로딩 시간이 필요한 웹앱이 있습니다. 양해 바랍니다. 지금도 앞으로도 계속 다양한 웹앱은 업로드 될 예정입니다.)
① 어떤 상황에서 AI를 활용했나요?
========================================================
경기도 평택시에 위치한 오성중학교는 전교생 110명, 6학급의 소규모 학교입니다. 소규모 학교는 큰 학교와 같은 교육 목표를 추구하면서도, 예산·인력·인프라 모든 면에서 제약이 큽니다. 저는 교감으로서 학교 현장의 세 가지 핵심 문제를 해결하기 위해 AI를 활용하게 되었습니다.
첫 번째 문제는 기초학력 관리의 어려움이었습니다. 24명의 학생별 기초학력 진단 결과를 과목별·영역별로 분석하고 학부모에게 개별 리포트를 제공하는 일은 수작업의 연속이었습니다. Excel로 데이터를 정리하고, 일일이 그래프를 그리고, 한 명 한 명 소견을 작성하는 데 며칠이 걸렸습니다.
두 번째 문제는 학생 맞춤형 학습 도구의 부재였습니다. 시중의 에듀테크 앱은 대형 학교나 학원을 대상으로 설계되어 있어, 우리 학교 교육과정과 학생 수준에 꼭 맞는 도구를 찾기 어려웠습니다. 수학 기초 연산이 부족한 학생에게는 그 학생의 수준에 맞는 문제가 필요하고, 영어 학습에서는 우리 학교 교과서 진도에 맞춘 단어와 문장이 필요했습니다.
세 번째 문제는 학교 행정 업무의 비효율이었습니다. 가정통신문 발송·회수 추적, 학생 역할 관리, 동료 장학 기록, 목표제 운영 등 학교 행정 업무는 대부분 종이 문서와 수기 기록에 의존하고 있었습니다. 디지털 전환이 필요하다는 것은 알았지만, 학교에는 개발자가 없었습니다.
그리고 결정적인 제약이 있었습니다. 저는 프로그래밍 전공이 아니라 코딩을 모른다는 것이었습니다. 개발 외주를 맡기기에는 소규모 학교의 예산으로는 턱없이 부족했습니다. 바로 이 지점에서 "바이브 코딩(Vibe Coding)"이라는 새로운 가능성을 발견했습니다. AI에게 자연어로 "이런 앱을 만들어줘"라고 말하면, AI가 코드를 작성해주는 방식이었습니다.
========================================================
② 어떤 AI를 어떻게 활용했나요?
========================================================
활용한 AI는 Anthropic의 Claude, Google의 Gemini API, 그리고 보조적으로 OpenAI의 ChatGPT를 사용했습니다. 핵심은 이 AI들에게 자연어 프롬프트로 원하는 기능을 설명하고, AI가 생성한 코드를 실제 서비스로 배포하는 것이었습니다.
개발 과정은 다음과 같은 5단계 대화형 프로세스로 진행됩니다.
1단계: 요구사항을 자연어로 설명합니다. 예를 들어, "학생들이 영어 단어를 손글씨로 쓰면 AI가 채점하는 앱을 만들어줘"와 같이 구체적으로 전달합니다.
2단계: AI가 HTML, JavaScript, Google Apps Script 등의 코드를 자동으로 생성합니다.
3단계: 생성된 코드를 무료 플랫폼에 배포합니다. 프론트엔드는 GitHub Pages, 백엔드는 Google Apps Script를 사용합니다.
4단계: 학생과 교사가 실제로 사용해본 뒤 발견된 문제를 AI에게 자연어로 전달하여 수정합니다. 예를 들어, "iOS에서 음성이 안 나와요"라고 말하면 AI가 Web Speech API 호환성 문제를 해결해줍니다.
5단계: 이 과정을 반복하여 앱을 지속적으로 개선합니다.
기술 스택은 모두 무료 서비스로 구성했습니다. AI 코드 생성에는 Claude와 ChatGPT를, 앱 내 AI 튜터 기능에는 Gemini API를, 웹앱 호스팅에는 GitHub Pages를, 백엔드 데이터 처리에는 Google Apps Script를, 데이터베이스에는 Google Sheets를, 데이터 시각화에는 Chart.js를 사용했습니다.
이 방식으로 현재 총 38종의 웹 애플리케이션을 만들어 실제 학교에서 운영하고 있습니다.
[교과 학습 앱 — 4종]
(1) 오성 연산 마스터: 수학 기초연산 훈련 앱입니다. 학생별 수준을 진단한 후 맞춤형 문제를 출제합니다. 경험치(XP), 뱃지, 연속학습 스트릭 등 게이미피케이션 요소를 넣어 학생들의 학습 동기를 유발합니다. 분수의 시각적 표현(파이 차트)까지 자동 렌더링됩니다.
(2) English Quest: 게이미피케이션 영어학습 앱입니다. Canvas API로 손글씨 영어 쓰기를 인식하고, Web Speech API로 발음을 들려줍니다. 교사 대시보드에서 학생별 학습 진도를 실시간 확인할 수 있습니다.
(3) 올바른 언어생활: 국어 음운론·문법 자기주도 학습 앱입니다. Gemini AI가 튜터 역할을 하며, 학생이 틀린 문제에 대해 대화형으로 설명해줍니다.
(4) 오성역사톡!!: 역사 교육 앱입니다. AI와 역사 인물 대화, 역사 카드 수집, 랭킹 보드 등으로 역사 학습을 게임처럼 즐길 수 있습니다.
[학교 경영·행정 앱 — 6종]
(5) 기초학력 진단평가 대시보드: 24명 학생의 진단 결과를 10개 탭으로 분석합니다. 히트맵, 상관분석, 학부모 개별 리포트 자동 생성까지 원클릭으로 처리합니다.
(6) 가정통신문 배달부: 가정통신문 발송·열람 추적·아카이빙을 자동화합니다. 학부모가 몇 시에 열었는지, 미확인 가정은 어디인지 실시간 파악이 가능합니다.
(7) 1인 1역할 관리 시스템 v2.0: 학급별 역할 배정, 교체 일지, CSV 업로드, 학생부 기재용 문장 자동 생성 기능을 갖춘 학급 운영 도구입니다.
(8) 나의 목표제 관리 시스템: 관리자·멘토·학생 3역할 기반 목표 설정-추적-피드백 시스템입니다.
(9) 동료장학 관리 시스템: 교사 간 수업 참관 기록·피드백을 디지털화한 동료장학 운영 도구입니다.
(10) 장학금 관리 시스템: 장학금 신청-심사-지급 전 과정을 관리하는 행정 도구입니다.
[플랫폼·도구 — 5종]
(11) EduTech Hub 포털: 위 모든 앱을 한곳에서 접근할 수 있는 통합 포털 사이트입니다. GitHub API 기반 관리자 패널로 프로젝트를 동적으로 관리합니다.
(12) 한국어 타자 연습 게임: 학생들의 타이핑 실력 향상을 위한 게임형 도구입니다.
(13) 좌표 디펜스 게임: 수학 좌표 개념을 타워 디펜스 게임으로 학습하는 교과 통합 게임입니다.
(14) Pace Maker: 자기주도 학습 관리 앱입니다. Vue.js 기반, 다크 게이밍 테마, PWA를 지원합니다.
(15) LOTTO 분석 시리즈: Python 데이터 과학 학습 차원에서 제작한 확률·통계 분석 도구입니다. 교사 본인의 AI 역량 개발을 위해 제작했습니다.
========================================================
③ 활용 결과 어떤 변화가 있었나요?
========================================================
[정량적 변화]
기초학력 진단 분석 시간이 수작업 3일에서 대시보드 자동 분석 10분으로 약 97% 절감되었습니다.
가정통신문 발송·추적은 인쇄·배포·회수에 하루가 걸리던 것이 발송 즉시 실시간 추적이 가능해지며 100% 디지털 전환을 달성했습니다.
학부모 개별 리포트 작성은 24명 × 수작업 30분 = 12시간이 걸리던 것이 원클릭 자동 생성 5분으로 단축되었습니다.
학생부 기재 문장은 역할 활동 기반으로 시스템이 자동 생성합니다.
전체 시스템 운영 비용은 월 0원입니다. GitHub Pages, Google Apps Script, Google Sheets 모두 무료 서비스이기 때문입니다. 만약 이 15종의 앱을 외주 개발했다면 앱당 최소 500만 원 × 15종 = 약 7,500만 원 이상의 비용이 들었을 것입니다.
[정성적 변화 — 학생]
오성 연산 마스터와 English Quest의 게이미피케이션 요소(XP, 뱃지, 스트릭)로 학생들이 자발적으로 반복 학습하기 시작했습니다. "선생님, 오늘 연속 7일째예요!"라며 자랑하는 학생들이 생겼습니다.
오성역사톡에서 역사 인물과 AI 대화를 하며 "역사가 재미있어졌다"는 반응이 나왔습니다.
학생들이 교감선생님이 AI로 앱을 만드는 과정을 보며, "나도 만들 수 있겠다"는 자신감을 갖게 되었습니다.
[정성적 변화 — 교사]
기초학력 진단 대시보드를 통해 데이터 기반 학생 지도가 가능해졌습니다. 히트맵에서 특정 영역이 빨간색으로 보이면 해당 영역에 대한 보충 지도를 즉시 계획할 수 있습니다.
가정통신문 배달부로 학부모 소통 누락이 제로가 되었습니다. 미확인 학부모에게 자동 리마인더를 보낼 수 있게 되었습니다.
[정성적 변화 — 학교 경영]
"디지털 전환"이 거창한 예산과 전문 인력이 필요한 일이 아니라, 교육자 스스로 AI와 함께 만들어갈 수 있다는 것을 증명했습니다.
이 경험을 바탕으로 경기도평택바이브코딩교육연구회를 조직하여, 다른 교사들에게도 바이브 코딩을 전파하고 있습니다.
토요 방과후 창의메이커스반에서 학생들에게 3D 프린팅과 함께 바이브 코딩을 소개하며, 학생 스스로 AI로 앱을 만드는 경험을 제공하고 있습니다.
========================================================
④ 나만의 방식 또는 개선 포인트는 무엇인가요?
========================================================
단순히 AI에게 "앱 만들어줘"라고 하면 쓸 만한 결과가 나오지 않습니다. 수십 개의 앱을 만들면서 정립한 나만의 체계적 방법론이 있습니다. 이를 "바이브 코딩 5단계 방법론"이라 부릅니다.
[1단계] 현장 문제 정의 — "무엇이 불편한가?"
교실과 행정실에서 매일 반복되는 불편함을 구체적으로 기록합니다. "기초학력 진단 결과를 학부모에게 쉽게 전달하고 싶다"처럼 구체적인 문제에서 출발합니다.
[2단계] 프롬프트 설계 — "AI에게 정확히 말하기"
AI에게 요구사항을 전달할 때, 막연하게 말하지 않고 맥락·대상·기술 스택·배포 방식까지 구체적으로 제공합니다. 예를 들어, "영어 학습 앱 만들어줘"는 나쁜 프롬프트이고, "중학교 1학년 학생이 영어 단어를 Canvas에 손글씨로 쓰면 AI가 채점하는 웹앱을 만들어줘. 게이미피케이션 요소(XP, 뱃지)를 넣고, 교사가 학생별 진도를 확인할 수 있는 대시보드도 포함해줘. 백엔드는 Google Apps Script, 데이터 저장은 Google Sheets, 프론트엔드는 GitHub Pages에 배포할 단일 HTML 파일로 만들어줘"가 좋은 프롬프트입니다.
[3단계] 무료 기술 스택 조합 — "돈 안 드는 구조 만들기"
소규모 학교의 현실에 맞게, 모든 것을 무료 서비스로 조합합니다. 프론트엔드는 GitHub Pages(무료 정적 호스팅), 백엔드는 Google Apps Script(무료 서버리스), 데이터베이스는 Google Sheets(무료, 직관적), AI 기능은 Gemini API(무료 할당량), 시각화는 Chart.js(오픈소스)를 사용합니다.
[4단계] 반복 대화 개선 — "AI와 핑퐁하며 완성하기"
첫 번째 결과물은 완벽하지 않습니다. 실제로 학생들이 사용해보고 발견한 버그를 AI에게 구체적으로 전달하여 수정합니다. English Quest의 경우 "iOS에서 음성이 안 나옵니다"라는 문제를 "Web Speech API가 iOS Safari에서 사용자 인터랙션 후에만 작동합니다. 버튼 클릭 이벤트에 TTS를 연결해주세요"처럼 구체적으로 전달하면 AI가 해결책을 제시합니다.
[5단계] 패턴 재사용 — "한번 배운 구조를 반복 적용"
하나의 앱을 만들면서 배운 기술 패턴을 다음 앱에 재활용합니다. config.js 파일로 API 키를 분리하는 방법, GAS POST 요청 시 CORS 문제를 방지하는 text/plain 설정, Google Sheets에서 날짜 자동변환을 방지하는 setNumberFormat('@') 적용, 단일 HTML 파일 SPA 구조 등을 한번 익히면 모든 프로젝트에 반복 적용할 수 있습니다.
[핵심 개선 포인트 1 — "완전한 파일 교체" 전략]
AI가 생성한 코드를 부분 수정(패치)하면 오류가 누적됩니다. 저는 수정이 필요할 때 항상 전체 파일을 새로 생성하여 교체하는 방식을 사용합니다. 이것이 비전공자가 코드 품질을 유지하는 가장 확실한 방법입니다.
[핵심 개선 포인트 2 — "API 키 보안" 설계]
학생용 앱에 AI 기능을 넣을 때, API 키가 노출되지 않도록 Google Apps Script를 프록시 서버로 활용하는 구조를 설계했습니다. AI에게 "API 키를 클라이언트에 노출하지 않는 구조로 만들어줘"라고 요청하면 됩니다.
========================================================
⑤ 다른 사람도 따라 할 수 있나요?
========================================================
결론부터 말하면, 네, 누구나 할 수 있습니다.
저는 컴퓨터 전공자가 아닙니다. HTML과 JavaScript의 차이를 AI에게 물어보면서 시작했습니다. 그런 제가 15개의 웹 애플리케이션을 만들어 실제 학교에서 운영하고 있습니다.
[시작하기 위해 필요한 것]
- Claude 또는 ChatGPT 계정 (무료~월 2만 원)
- GitHub 계정 (무료)
- Google 계정 (무료)
- 코딩 지식 (불필요)
- 가장 중요한 것: "내 현장의 문제를 구체적으로 설명하는 능력"
[오늘 바로 시작할 수 있는 3단계]
Step 1. Claude(claude.ai)에 접속합니다.
Step 2. 이렇게 말합니다: "나는 ○○ 업무를 하고 있는데, △△이 불편합니다. 이것을 해결하는 간단한 웹앱을 만들어주세요. HTML 단일 파일로 만들어주세요."
Step 3. AI가 만들어준 코드를 GitHub Pages에 올리면 끝입니다.
[누구에게 추천하나요?]
교사·교육자에게 추천합니다. 우리 학교, 우리 학생에게 딱 맞는 학습 도구를 직접 만들 수 있습니다. 시중 앱에 없는 우리 교과서 진도에 맞는 퀴즈 앱, 우리 학교 행사에 맞는 관리 도구를 자유롭게 만들 수 있습니다.
학교 관리자에게 추천합니다. 가정통신문 추적, 학생 데이터 분석, 업무 자동화 등 행정 효율화 도구를 예산 없이 구축할 수 있습니다.
학부모에게 추천합니다. 자녀의 학습 관리 도구, 가계부, 일정 관리 앱 등 생활 속 도구를 AI 대화만으로 만들 수 있습니다.
소상공인에게 추천합니다. 재고 관리, 고객 관리, 예약 시스템 등 업무 도구를 외주 없이 직접 만들 수 있습니다.
코딩을 배우는 것이 아니라, AI에게 내 문제를 정확히 설명하는 능력 — 이것이 2026년에 필요한 진짜 디지털 리터러시입니다.
저는 이 경험을 더 많은 교육자에게 나누기 위해 경기도평택바이브코딩교육연구회를 운영하고, 토요 방과후 창의메이커스반에서 학생들에게도 바이브 코딩을 가르치고 있습니다.
AI는 도구입니다. 하지만 그 도구를 현장의 문제 해결에 연결하는 사람의 아이디어가 있을 때, 비로소 마법이 일어납니다.
자아, 한 번 입장해 보세요. https://kkbhong71.github.io/EduTech-Hub/
(실제 운영 중에 있다보니 , 민감 정보 등이 있어 관리자의 로그인 필요, 또는 무료 구축에 따른 로딩 시간이 필요한 웹앱이 있습니다. 양해 바랍니다. 지금도 앞으로도 계속 다양한 웹앱은 업로드 될 예정입니다.)
