요약 슬라이드

요약요약
요약요약
요약요약
요약요약
요약요약

시동 걸기 — 첫 번째 Hello World

주차장에서 가볍게 시동을 걸어봅니다. AI에게 첫 명령을 내리고 실제 웹페이지가 만들어지는 순간을 경험합니다.

첫 번째 명령: 프롬프트 입력

AI에게 내리는 지시문을 '프롬프트(Prompt)' 라고 합니다. 내비게이션에 목적지를 말하듯, 우리가 원하는 결과물을 설명하는 과정입니다.

  1. Antigravity에서 [New Project] 버튼을 클릭합니다.
  2. 프로젝트 이름을 hello-world로 입력합니다.
  3. 하단 채팅창에 아래 문장을 입력하고 엔터를 누릅니다.
    Hello World 웹페이지 만들어줘
    

엔진 가동: 코드 자동 생성

엔터를 누르면 화면에 복잡한 영어 코드들이 나타납니다.

  • HTM/CSS/JS: 웹사이트를 구성하는 재료들입니다.
  • 운전자의 입장: 엔진 내부의 폭발 행정을 몰라도 시동 소리만 들으면 되듯, 이 코드를 이해할 필요는 없습니다. "AI가 열심히 길을 찾고 있구나"라고 생각하시면 됩니다.

시동 완료: 결과 확인

생성이 끝나면 보통 화면 오른쪽에 미리보기(Preview) 창이 나타납니다.

Hello World 결과 화면

  • 화면에 "Hello World" 라는 문구가 보인다면 성공입니다.
  • 단 한 줄의 코드도 직접 쓰지 않고 오직 말로만 웹페이지를 만든 첫 순간입니다.

1부 마일스톤 정리 (준비 완료)

분주했던 1부의 준비 과정을 모두 마쳤습니다.

  • 콘셉트 이해: 바이브코딩이 무엇인지 알게 됨 (편 1-1)
  • 도구 준비: Antigravity, Node.js 설치 (편 1-2)
  • 준비 가동: 계정 연동 및 정책 설정 (편 1-3)
  • 첫 성공: Hello World 출력 완료 (편 1-4)

이제 주차장을 나갈 준비가 되었습니다. 2부부터는 진짜 도로 위에서 나만의 프로젝트를 하나씩 완성해 나갑니다.