Vibe Studio · 교사 실습 과정

교원 바이브코딩 연수

중·고등학교 선생님을 위한 90분 연수. 출석부를 만들고, 결석·지각한 학생만 체크하도록 고친 뒤 웹에 공개해요.

  • 8차시 · 총 90분
  • 노트북 실습
  • 공개 링크 완성
연수 전에 확인할 것

Canva에서 발표자 뽑기를 만들며 시작해요. AI Studio에서 출석부 HTML 한 파일을 받고, Antigravity로 출결 확인을 빠르게 고쳐요. GitHub Pages와 Vercel에 직접 올려 공개하고, 같은 작업을 Antigravity에게 부탁하는 방법을 알아봐요. 설치와 로그인은 연수 전에 준비해요.

이런 분께
준비할 것
만들 결과
8차시

과정 흐름

8차시 자세히 보기
  1. 1

    시작

    로그인과 설치 상태를 확인하고 오늘 만들 결과를 알았어요.

  2. 2

    Canva 뽑기

    중복 없이 다음 사람이 나오고 다시 시작이 돼요.

  3. 3

    출결 만들기

    6명 중 출석·지각·결석이 각 1명, 미확인이 3명이에요. CSV에 날짜·이름·상태가 있어요.

  4. 4

    HTML 받기

    내 PC에 index.html이 있고 더블클릭하면 출결 앱이 열려요.

  5. 5

    Antigravity

    결석·지각한 학생만 바뀌고 나머지는 출석이에요.

  6. 6

    GitHub·Pages

    내 GitHub Pages 주소에서 출결 앱이 열려요.

  7. 7

    Vercel 배포

    내 Vercel 주소에서 출결 앱이 열려요.

  8. 8

    다시 올리기·Agent 요청·제작과 공개 사이클

    제작·수정 → 코드 올리기 → 주소로 공개하기의 순서를 설명할 수 있어요.

실제 결과 예시

실제 사례

다른 자료 보기