본문 바로가기
실습 강의

바이브코딩 실습 3편 — 망쳐도 되돌리는 안전벨트: Git

실습 1에서 만든 메뉴 룰렛을 일부러 부순 다음, 한국어 한 문장으로 완벽하게 되살린다. git 명령어는 하나도 외우지 않고 세이브·복구·클라우드 백업을 전부 Claude에게 말로 시켜본다. 오늘 이 안전벨트를 매면 이제부터 뭘 눌러도 무섭지 않다.

개발자가 겁 없이 이것저것 시도하는 이유는 실력이 좋아서가 아니라, 언제든 되돌릴 수 있기 때문이다. 오늘 그 안전벨트를 매면 실수는 더 이상 사고가 아니게 된다.

이 글 3줄 요약

  • Git은 프로젝트의 세이브 기능이다. 게임의 세이브 포인트처럼, 지금 상태를 통째로 기억해 두고 언제든 그 지점으로 되돌아갈 수 있다.
  • 실습 1에서 만든 메뉴 룰렛을 일부러 부순 뒤, "아까 그 저장 상태로 되돌려줘" 한 문장으로 완벽하게 되살린다. git 명령어는 하나도 외우지 않고 전부 Claude에게 한국어로 시킨다.
  • 마지막엔 프로젝트를 GitHub(인터넷 위의 클라우드 금고)에 통째로 올려, 컴퓨터가 고장 나도 안전하고 어디서든 꺼낼 수 있는 내 저장소를 갖는다.

이 글은 AI 바이브코딩 실습 9편 시리즈의 3편이다. 코드를 한 줄도 몰라도 AI에게 일을 시켜 실제로 쓸 물건을 만드는 과정을 손으로 따라 한다. 앞 편인 실습 2편에서 만든 메뉴 룰렛을 오늘 그대로 이어서 쓴다. 왜 이렇게 되돌리기가 되는지 원리가 궁금하면, 짝을 이루는 이론 3편에서 확인하면 된다. 이번 편의 목표는 하나다. 이제부터 뭘 눌러도, 뭘 지워도 무섭지 않게 만드는 것이다.

오늘 이걸 해낸다 — 부순 룰렛을 한 문장으로 되살린다

먼저 오늘의 완성 장면부터 보자. 화면이 완전히 깨진 상태, 그러니까 버튼도 사라지고 룰렛도 없이 텅 빈 화면에서 시작한다. 여기서 Claude에게 "아까 그 저장 상태로 되돌려줘" 한마디를 던지면, 멀쩡하게 돌아가던 룰렛이 순식간에 복구된다. 반쯤 지워진 코드가 원래대로 채워지고, 새로고침 한 번이면 "오늘 뭐 먹지?" 룰렛이 다시 돌아간다.

그리고 마지막엔 이 프로젝트를 통째로 GitHub에 올린다. GitHub은 개발자들이 쓰는 클라우드 금고라고 보면 된다. 여기에 한 번 복사해 두면 인터넷 어디서든 꺼낼 수 있는 내 저장소가 생긴다. 오늘 만날 새 단어는 딱 셋이다. Git, 커밋, GitHub. 전부 "세이브·복구·클라우드 백업"을 개발자 말로 바꾼 것뿐이라, 지금 뜻이 안 와닿아도 몸으로 한 번 해보면 바로 이해된다.

준비물 — 이 네 개면 바로 시작한다

시작 전에 필요한 건 네 가지뿐이다. 새로 설치하거나 외울 것은 없다.

준비물상태설명
실습 1 룰렛 폴더필수 · 이어서 진행실습 2편에서 만든 메뉴 룰렛 폴더가 컴퓨터에 있어야 한다. 오늘은 이걸 갖고 논다.
이메일 1개무료 가입GitHub 가입에 쓴다. Gmail이든 네이버든 아무거나 좋다. 인증 메일 한 번만 받으면 끝.
Claude Code이미 있음실습 0편에서 이미 깔았다. 추가 설치 없이 룰렛 폴더에서 켜기만 하면 된다.
시간 40분한 번에 완주세이브 → 부수기 → 복구 → 업로드까지 한 번에. 오늘은 오히려 망칠수록 좋다.

git이 뭔지 미리 안 외워도 되냐고 걱정할 수 있다. 안 외워도 된다. 새로 설치할 것도, 암기할 명령어도 없다. 필요한 건 그때그때 Claude에게 한국어로 부탁하면 되고, 뜻은 진행하면서 하나씩 알게 된다. 오늘의 지도는 이렇다. 세이브하고(STEP 1·2) → 일부러 부수고(STEP 3) → 되살리고(STEP 4) → 금고에 넣는다(STEP 5·6).

STEP 1 — 룰렛 폴더에 '세이브 기능'을 켠다

먼저 세이브 기능부터 켠다. 실습 1에서 만든 룰렛 폴더 안 빈 곳에서 마우스 우클릭 후 "터미널에서 열기"를 누른다. 터미널이 뜨면 claude를 입력해 AI를 켠다. 실습 0편에서 했던 그 방법 그대로다. 그다음 > 뒤에 이 한 문장을 붙여넣는다.

이 폴더를 git으로 관리 시작해줘

그러면 Claude가 이 폴더를 Git 저장소로 만들겠다며 실행 여부를 물어볼 수 있다. 이때는 "예"를 누르면 된다.

체크포인트: Claude가 "Git 저장소를 초기화했습니다"라고 답하면 성공이다.

왜 이걸 먼저 하냐면, Git이 곧 게임의 세이브 포인트이기 때문이다. 세이브 없이 보스전, 그러니까 위험한 수정에 들어갔다가 잘못되면 처음부터 다시 해야 한다. 그걸 막으려고 무엇보다 먼저 세이브 기능부터 켜는 것이다.

STEP 2 — 지금 상태에 이름 붙여 저장하기

세이브 기능을 켰으니 이제 첫 세이브를 찍는다. 다음 문장을 붙여넣는다.

지금 상태를 '룰렛 완성 v1'이라고 저장해줘

여기서 '룰렛 완성 v1'은 세이브 파일의 이름표다. 원하는 이름으로 바꿔도 좋다. 예를 들어 "잘 되는 버전"처럼 나중에 알아보기 쉬운 이름이면 된다.

체크포인트: Claude가 "커밋 완료"라고 답하면 세이브 성공이다. 여기서 **커밋(commit)**이 바로 세이브 한 번을 뜻하는 개발자 용어다.

왜 굳이 이름을 붙여 저장할까. 나중에 세이브가 여러 개 쌓이면, 어느 지점으로 되돌릴지 알아보려면 이름표가 필요하기 때문이다. "룰렛 완성 v1"이라고 적어두면 나중에 "아, 그 잘 되던 지점" 하고 한눈에 찾을 수 있다.

STEP 3 — 이제, 룰렛을 신나게 부순다

세이브를 해뒀으니 마음 놓고 부술 차례다. 다음 문장을 던진다.

index.html 내용을 절반쯤 지워줘

그다음 브라우저에서 룰렛을 새로고침(F5)해 본다. 직접 부수고 싶으면, index.html을 메모장으로 열어 아무 줄이나 마구 지워도 된다. 화면이 텅 비거나 깨지면서 버튼도 룰렛도 사라진다.

체크포인트: 화면이 망가졌으면 성공이다. 오늘 딱 이 한 번만이다. 깨진 걸 확인했으면 다음 STEP에서 되살린다. 절대 당황하지 말자.

멀쩡한 걸 왜 부수냐면, 복구를 배우려면 먼저 사고가 나야 하기 때문이다. 실제 작업 중엔 실수로 이런 일이 벌어진다. 오늘은 안전한 연습장에서 미리, 일부러 겪어보는 것이다.

STEP 4 — 한 문장으로 되살아난다 (오늘의 하이라이트)

이제 오늘의 하이라이트다. 깨진 화면 앞에서 이 한 문장을 던진다.

아까 '룰렛 완성 v1' 저장 상태로 되돌려줘

되돌리기 전에는 텅 빈 화면이었지만, 이 한마디 뒤에 새로고침을 하면 멀쩡한 룰렛이 다시 나타난다. 반쯤 지워졌던 코드가 원래대로 채워지고 "돌리기" 버튼도 되살아난다.

체크포인트: 새로고침 후 룰렛이 정상으로 돌아왔으면 복구 성공이다.

어떻게 이게 되냐면, STEP 2에서 세이브(커밋)해 둔 지점을 Git이 통째로 기억하고 있었기 때문이다. "그 상태로 되돌려줘" 한마디면 Git이 그때 파일 그대로 되돌려 놓는다. 이게 바로 안전벨트의 정체다. 사라지는 건 세이브 이후에 망가뜨린 부분뿐이고, 세이브 지점까지의 작업은 그대로 남는다.

STEP 5 — 내 세이브를 넣어 둘 '클라우드 금고' 만들기

여기까지 한 세이브는 전부 내 컴퓨터 안에만 있다. 컴퓨터가 고장 나면 같이 사라진다. 그래서 인터넷 위의 금고, GitHub에 가입한다. 순서는 이렇다.

  1. 크롬 주소창에 github.com을 입력해 접속한 뒤 Sign up을 누른다.
  2. 이메일 → 비밀번호 → 아이디 순서로 입력한다. 아이디는 나중에 내 주소가 되니 영문으로 정하고, 인증 메일을 한 번 확인한다.
  3. 요금제는 **Free(무료)**를 고른다. 유료를 안 골라도 오늘 하는 건 전부 무료로 된다.

체크포인트: 로그인 후 오른쪽 위에 내 프로필 아이콘이 보이면 가입 완료다.

왜 가입까지 하냐면, GitHub이 인터넷 위의 금고라서 여기에 복사해 두면 컴퓨터에 무슨 일이 있어도 안전하기 때문이다.

STEP 6 — 내 룰렛 프로젝트를 금고에 통째로 넣기

가입을 마쳤으면 프로젝트를 올린다. 터미널의 Claude에게 다음 문장을 던진다.

이 프로젝트를 내 GitHub에 올려줘

그러면 Claude가 GitHub 로그인(인증)을 안내한다. 화면에 나오는 대로 따라가기만 하면 된다. 어려운 설정은 없다.

체크포인트: github.com/내아이디/menu-roulette 주소에 들어가서 내 파일(index.html)이 보이면 업로드 성공이다.

한 가지 주의가 있다. 공개(Public) 저장소는 전 세계가 볼 수 있다. 실습 6편 배포에 쓰기 때문에 Public을 권장하지만, 전화번호·주소 같은 개인정보는 넣지 말자. 이렇게 올려두면 내 룰렛이 인터넷 어디서든 꺼낼 수 있는 상태가 되고, 다른 컴퓨터나 휴대폰에서도 접근된다.

골라서 더 해보기

안전벨트를 맸으니 이런 것도 시켜보자. 전부 Claude에게 한국어로 부탁만 하면 되고, git 명령어는 여전히 하나도 외우지 않는다.

  • 세이브 목록 보기 — 지금까지 저장한 지점들을 쭉 보여준다. 지금까지 세이브 목록 보여줘라고 하면 "룰렛 완성 v1(10분 전)", "첫 룰렛 만듦(어제)"처럼 이력이 시간순으로 뜬다.
  • 뭐가 달라졌는지 설명 — AI가 바뀐 부분을 한국어로 풀어준다. v1이랑 지금이랑 뭐가 달라졌는지 설명해줘라고 하면 "버튼 색을 파랑에서 초록으로, 메뉴 2개 추가, 배경 그림 삭제"처럼 짚어준다.
  • 실험용 복사본 만들기 — 원본은 그대로 두고 딴 데서 맘껏 실험한다. 실험용 복사본 만들어서 거기서 크게 바꿔줘라고 하면 실험용 가지(브랜치)를 만들어, 거기서 크게 바꿔도 원본(v1)은 안전하게 남는다.

막혔을 때 — 자주 나는 3가지

이 화면이 나와도 놀라지 말자. 증상별로 대처만 알면 된다.

증상 (이런 게 떴다면)원인대처
git이(가) 설치되어 있지 않습니다컴퓨터에 git이 아직 없음Claude에게 "git 설치해줘"라고 시키면 설치 방법을 안내해 준다. 따라만 하면 끝.
GitHub 인증(로그인) 창이 자동으로 안 뜸브라우저 인증이 자동 연결 안 됨터미널에 뜬 8자리 코드를 복사해서 github.com/login/device에 접속해 붙여넣으면 연결된다.
세이브를 안 했는데 파일을 이미 망가뜨렸다되돌릴 세이브 지점이 없음이번만은 "index.html 다시 만들어줘"로 재생성한다. 그리고 위험한 작업 전엔 꼭 먼저 세이브(STEP 2)!

대원칙은 하나다. 뭐가 안 되면 에러 메시지를 복사해서 Claude에게 "이거 왜 이래?"라고 붙여넣자. 대부분 그 자리에서 풀린다.

오늘 배운 것 — 새 단어 3개 + 평생 쓸 습관 하나

오늘 몸으로 익힌 걸 정리하면 이렇다. 전부 말로 시켰다는 점이 핵심이다.

단어한 줄 정의
Git내 프로젝트의 세이브 기능. "관리 시작해줘"로 켰다.
커밋 (commit)이름 붙인 세이브 한 번. "'v1'으로 저장해줘"로 만들었다.
되돌리기저장한 지점으로 완벽 복구. "그 상태로 되돌려줘" 한 문장.
GitHub세이브를 넣어 두는 인터넷 클라우드 금고. "내 GitHub에 올려줘".

그리고 단어 셋보다 중요한 건 습관 하나다. 위험한 작업 전에는 먼저 세이브한다. 이 습관 하나가 앞으로 몇 번이고 여러분을 구한다. 오늘 배운 게 왜 이렇게 작동하는지 원리가 궁금하면 이론 3편에서 확인하면 된다.

다음 편에서는 드디어 진짜 쓸모 있는 물건을 만든다. 매출과 지출을 기록하는 나만의 장부 웹앱이다.

다음 편 — 실습 4편

자주 묻는 질문

git 명령어를 외워야 하나요? 개발자들은 다 외우던데요.

외우지 않아도 됩니다. 이 실습에서는 git 명령어를 단 한 개도 타이핑하지 않습니다. 대신 Claude에게 한국어로 부탁합니다. '이 폴더를 git으로 관리 시작해줘', '지금 상태를 저장해줘', '아까 그 상태로 되돌려줘'처럼 말이죠. 실제 git 명령은 Claude가 대신 만들어 실행하고, 여러분은 결과 화면만 확인하면 됩니다. 명령어 암기는 목표가 아니라 함정입니다.

멀쩡하게 잘 되는 걸 왜 일부러 부수나요?

복구를 배우려면 먼저 사고가 나야 하기 때문입니다. 실제 작업 중에는 실수로 파일이 반쯤 지워지거나 화면이 깨지는 일이 종종 벌어집니다. 그때 당황하지 않으려면 안전한 연습장에서 미리, 일부러 한 번 겪어보는 게 가장 확실합니다. 오늘 딱 한 번 부수고 되살려보면, 다음부터는 진짜 사고가 나도 손이 먼저 움직입니다. 그게 개발자가 겁 없이 시도하는 진짜 이유입니다.

되돌리면 그동안 한 작업이 전부 사라지나요?

되돌리기는 '세이브해 둔 지점'으로 돌아가는 것이라, 그 지점까지의 작업은 그대로 남습니다. 사라지는 건 세이브 이후에 망가뜨린 부분뿐입니다. 게임의 세이브 포인트와 똑같습니다. 저장한 곳으로 돌아가면 그전까지 진행은 유지되고, 그 뒤의 실수만 없던 일이 됩니다. 그래서 위험한 작업 전에 세이브를 해두는 습관이 중요합니다.

GitHub에 꼭 올려야 하나요? 부담스러운데요.

당장 안 올려도 되돌리기 연습은 다 됩니다. 다만 지금까지의 세이브는 내 컴퓨터 안에만 있어서, 컴퓨터가 고장 나면 같이 사라집니다. GitHub은 인터넷 위의 금고라, 여기에 한 번 복사해 두면 어떤 일이 있어도 안전하고 다른 기기에서도 꺼내 쓸 수 있습니다. 가입과 업로드 모두 무료이고, 나중에 실습 6편(배포)에서 이 저장소를 그대로 씁니다. 단, 공개 저장소는 전 세계가 보니 전화번호·주소 같은 개인정보는 넣지 마세요.

세이브를 안 했는데 파일을 이미 망가뜨렸어요. 어떡하죠?

이번 한 번은 Claude에게 'index.html 다시 만들어줘'라고 시켜 재생성하면 됩니다. 세이브해 둔 지점이 없으면 되돌릴 곳도 없기 때문에, 이 경우엔 새로 만드는 게 가장 빠릅니다. 그리고 이게 바로 오늘의 교훈입니다. 위험한 작업에 들어가기 전에는 반드시 먼저 세이브(커밋)를 해두세요. 세이브 한 번이 나중에 몇 시간을 살립니다.

관련 글