요즘 정보 수업에서 제가 가장 많이 듣는 질문 중 하나가 바로 “바이브 코딩이 뭐예요?”입니다.
AI가 코드를 만들어주는 시대, 우리는 코딩 교육을 어떻게 바라봐야 할까요?
오늘은 제가 현장에서 직접 느끼고 정리한 바이브 코딩(Vibe Coding)의 개념과 실제 적용 방법을 소개하려고 합니다.
바이브 코딩은 단순히 “AI로 코드를 대신 만든다”는 의미를 넘어 코딩 활동 전반에서 발생하는 경험과 상호작용에 중심을 두는 개념입니다.
•
기존 코딩 교육과의 차별점
구분 | 바이브 코딩 (Vibe Coding) | 전통적인 코딩 교육 |
목표 | 협력적 문제 해결 능력 및 창의적 자기 표현 | 코딩 문법 숙달 및 정답 찾기 |
활동 방식 | 팀 기반 프로젝트, 자유로운 아이디어 공유, 시행착오 과정 중시 | 개별 과제 수행, 정형화된 커리큘럼 이수 |
평가 초점 | 과정 참여도, 팀워크, 아이디어의 독창성 및 구현 노력 | 최종 결과물의 완성도 및 기능적 정확성 |
학습 분위기 | 개방적, 활동적, 긍정적 에너지 공유 | 조용하고 집중적인 개인 학습 환경 |
바이브 코딩을 실제 수업에 적용해 보면, 단순히 ‘코드를 AI로 쉽게 만든다’ 이상의 근본적인 변화가 일어납니다. 학생들은 서로의 생각을 공유하는 방식에서부터, 프로젝트에 진짜 자기 일처럼 몰입하는 태도, 심지어 실패를 대하는 감정까지 긍정적으로 달라집니다.
바이브 코딩 수업은 학생들이 서로의 코드와 아이디어를 자연스럽게 확인하고 공유하는 구조를 가지고 있습니다. 어떤 아이는 코드를 직접 짜보며, 또 다른 아이는 AI가 만든 코드를 분석해 보며 서로의 방식으로 의견을 교환하게 됩니다.
이 과정에서 학생들은 아이디어를 명확하게 설명하는 능력, 다른 친구의 의견을 경청하고 반영하는 태도, 서로의 코드 스타일을 비교하고 조율하며 협력하는 기술을 배우게 됩니다. 즉, 바이브 코딩은 ‘혼자 해결하는 코딩’이 아닌 ‘함께 만드는 문제 해결’이며, 이는 코딩을 넘어 어디서든 필요한 협력적 소통 능력 향상으로 이어집니다
바이브 코딩의 가장 큰 힘은 바로 학생의 흥미에서 출발한다는 점입니다. 우리가 흔히 하는 방식처럼 “이번 시간엔 ○○을 만듭니다”가 아니라, 학생이 “선생님, 저는 이걸 만들어보고 싶은데요?”라고 말하는 순간이 수업의 중심이 됩니다.
•
스스로 주제를 고르고
•
AI를 활용해 빠르게 프로토타입을 만들고
•
다시 수정하며 완성도를 높이는 경험
‘왜 배워야 해?’라는 질문 대신에 ‘이 기능 추가해볼까?’라는 질문이 자연스럽게 나오는 수업이 되는 것이죠. 바이브 코딩 수업에서 가장 중요한 시작점은 주제 선정입니다. 학생이 스스로 관심 있는 문제를 고를 수 있도록 해야 해야하는 것이죠.
예를 들어…
•
일상 속 불편함 해결하기
•
간단한 게임 만들기
•
웹툰 스토리를 코드로 구현하기
•
센서·IoT와 연계한 미니 프로젝트
여기에 접근성이 좋은 도구를 선택하면 됩니다.
•
캔바
•
구글 앱스 스크립트
•
웹 기반 에디터(Replit, Trinket 등)
중요한 건 복잡한 언어보다 ‘내가 만든 것이 바로 보인다’는 경험을 학생에게 주는 것입니다.
[실제 바이브 코딩 실습 1] 캔바
일정 관리 앱 만들기
학습 목표 : 명령 프롬프트로 나만의 프로그램 만들어 사용하기.
현재 상황을 분석하고 원하는 기능을 선정해 보기.
캔바의 인공지능 기능을 이용하여 말하듯이 명령을 내리면 프로그램 코드를 작성해 줍니다.
간단한 프로그램을 직접 만들 수 있습니다.
1.
문제 정의
명령 프롬프트를 작성하는 것도 막막하다면 Chatgpt에 원하는 것을 입력하면 프롬프트를 생성해 줍니다. 영어로 만들어 주기도 하는데요. 이럴 때는 한글로 다시 작성해 달라고 하면 한글 프롬프트를 생성해 줍니다.
생성해주 내용을 입력하고 제출 버튼을 눌러도 되고, 혹은, 아래와 같이 직접 요청 사항을 입력해도 됩니다.
실시간으로 코드가 생성됩니다.
상단의 “데이터”를 클릭하면 캔바 시트와 프로그램이 연동되는 걸 확인할 수 있습니다.
데이터 과학 수업을 할 때 이용하시면 용이하게 데이터 수집하는 프로그램을 만들 수 있습니다.
다만, 오류가 발생하기도 하고, 데이터 전송 시간에 지연이 발생하기도 하는 점 유의하셔야 합니다.
실제로 공유를 하여 프로그램을 운영할 수 있습니다.
어떠신가요? 간단히 프로그램을 만들고 데이터를 수집할 수 있게 되었습니다. ^^
[실제 바이브 코딩 실습 2] 구글 앱스 스크립트(Google Apps Script, GAS)”
수업 일기 작성 페이지 만들기
[문제 상황]
스크립트 생성은 재미나이에서 만든 후 Apps Script 에 코드를 복사하여 사용합니다.
공부 일기를 작성하여 입력하면 학생에게 피드백을 주고, 교사에게는 학생 분석 내용을 알려주는 프로그램을 만들어 보도록 하겠습니다.
제미나이에 다음과 같이 질의합니다.
학생들이 자신의 공부 내용을 기록하는 '공부 일기' 웹 앱을 제작합니다. 학생이 일지를 제출하면 AI가 학생에게는 따뜻한 피드백을 제공합니다. 모든 기록은 구글 스프레드시트에 자동으로 저장 및 관리됩니다. 이를 위해 구글 Apps Script로 프론트엔드와 백엔드로 구분해서 코드를 작성해 주세요.
구글 시트에 아래와 같이 시트를 만듭니다.
제미나이 API 키는 구글 AI 스튜디오에서 받습니다.
B2에 복사해서 넣습니다.
재미나이 키를 복사합니다.
이 키를 시트 B2에 넣은 후 시트에서 구글 앱스 스크립트 프로그램을 열도록 합니다.
[확장프로그램]-[앱스 스크립] 클릭
HTML의 파일이름은 index 로 합니다.
제미나이에서 생성한 두개의 코드를 복사해서 넣습니다.
Code.gs 는 백엔드 코드 넣기
HTML 은 프론트엔트 코드 넣기
입니다.
재미나이 API 키를 구글 앱스 스크립트 설정에 넣도록 하겠습니다.
톱니바퀴 클릭 후
API 속성명을 정확히 입력한 후
자신의 재미나이 API키를 복사해서 넣습니다.
이제 저장을 한 후 배포를 하도록 하겠습니다.
입력을 한 후 실행 결과가 잘 나오는 지 확인해 보세요 ~^^
구글 시트에 데이터가 잘 들어옵니다. 이때 시트는 새롭게 만들어져서 들어옵니다.
바이브 코딩의 한계점은 이 과정을 거치더라도 각자 만들어 지는 코드가 다 다르다는 것입니다. 그래서 바이브 코딩 수업에서 제가 꼭 넣는 활동이 바로 디버깅과 역설계입니다. 수업 중 일부러 오류가 있는 코드를 학생들에게 슬쩍 던져주고, 다음 두 가지를 요구합니다.
•
“에러가 왜 났는지, 실행 흐름을 따라 단계별로 설명해줘.”
•
“이 코드의 구조를 블록 다이어그램으로 다시 표현해볼래?”
이때 학생은 단순히 ‘고치는 것’이 아니라, 코드를 읽고 이해하며, 전체 로직을 구조화하는 경험을 하게 됩니다. 결과적으로 오류 분석 + 로직 이해라는 두 가지 역량을 동시에 키울 수 있죠.
AI가 코드를 대신 만들어주는 시대일수록, ‘왜 이렇게 동작하는지’ 이해하는 능력은 더 중요해지기 때문에 이 과정을 거치게 하는 것이 꼭 필요합니다.
바이브 코딩은 기존의 정보 수업을 ‘대체’하려는 방식이 아닙니다. 오히려 지금 우리가 하고 있는 수업을 더 풍부하게 만드는 보완적 코딩 스타일에 가깝습니다. 상황과 학생의 수준, 그리고 프로젝트의 성격에 따라 전통적인 코딩 방식과 바이브 코딩을 유연하게 오가며 설계한다면, 교실에서 훨씬 다양한 선택지가 생기고 대안적 접근법으로 활용할 수 있습니다.
결국 중요한 것은 학생의 경험을 어떻게 더 풍부하게 만들 것인가 하는 수업 설계의 관점입니다.
변화하는 시대에 맞게 다양한 정보 수업이 이루어 지면 좋겠습니다. ^^