이 스터디는 이지스퍼블리싱 Do it! 스터디와 함께 합니다.
해당 도서를 보유하고 있는 누구나 디스코드 채널에서 참여 신청하실 수 있습니다.

책 발행 시점으로부터 변동된 사항이 있을 때 헤매지 않고 물어볼 상대가 있는 곳,
공부하다가 막히면 언제라도 저자 분께 직접 질문할 수 있는 곳!
게다가 스토디 완주자에게는 선물도 있다고 하니 관심 있는 분들은 참고 바랍니다.

현재는 《Do it! 바이브 코딩 + 안티그래비티》 및 《Do it! LLM을 활용한 AI 에이전트 개발 입문》
두 권의 스터디가 진행되고 있으며, 저는 《Do it! 바이브 코딩 + 안티그래비티》 스터디에 참여하고 있습니다.

[바이브코딩 스터디] 1주 차 with 《Do it! 바이브 코딩 + 안티그래비티》

01 안티그래비티와 프롬프트 기초

AI 챗봇은 인간이 설명하고 요구하는 대로 코드를 생성할 뿐이었다면
AI 에이전트는 프로젝트 구조를 파악하고 스스로 계획 및 실행을 할 수 있다.
잘못된 코드를 작성하더라도 사용자에게 그대로 제시하기보다는
오류가 발생하는지 스스로 검토하여 수정 후 개선된 코드를 전달한다.

그런 AI 에이전트를 내장하여 만들어진 차세대 통합개발환경 중 안티그래비티가 있다.
개발자를 번거롭게 하는 개발의 중력에서 벗어나 무중력 상태를 자유롭게 날아다닐 수 있게 해주겠다는.

안티그래비티는 작업을 수행할 때 아티팩트라고 불리는 세 가지 산출물을 보여준다.
작업 목록(Tasks) 은 안티그래비티가 수행할 작업을 단계별로 정리한 목록이다.
작업이 진행됨에 따라 자동으로 체크박스가 채워져 전체적인 흐름을 파악할 수 있다.
구현 계획(Implementation Plan) 은 사전 설계 문서다.
사용자가 이를 검토하고 필요에 따라 리뷰를 남긴 후 승인해야 실제 코드를 작성한다.
워크스루(Walkthrough) 는 작업 완료 후의 결과 보고서다.
무엇을 했고 어떻게 테스트하였으며 어떻게 검증했는지 설명한다.

안티그래비티에게 프롬프트를 작성하여 요청할 땐 ROCK 법칙을 사용하면 좋다.

• R: Rule | 역할 부여
• O: Objective | 명확한 목표 설정
• C: Context | 맥락 제공
• K: Key constraints | 핵심 제약 조건

ROCK 법칙에 대한 구체적인 설명과 예시는 책에서 확인할 수 있다.
몇 가지 상황을 가정하고 각 상황에서의 프롬프트 작성법을 안내해 주어
실제 프롬프트를 작성할 때 유용한 참고 자료가 된다.

작업을 요청할 때는 단순히 "해줘", "고쳐줘" 하는 것보다는
어떠한 상태가 되어야 하는지 종료 조건을 명확히 명시해 주는 게 좋다.
시각적 기준이든 기능적 기준이든 테스트 기준이든 말이다.

또한 AI의 작업을 무조건 승인하지 말고
불필요한 작업은 가지치기하고 작업에 문제 없는지 검토한 후 최종적으로 승인해야 한다.

02 안티그래비티 시작하기

안티그래비티는 공식 웹 사이트에서 내려받을 수 있다.
책이 쓰여진 시점과 웹 사이트 구성이 조금 다른데 Antigravity IDE 라는 녀석을 설치하면 된다.
전체적인 인터페이스는 그대로지만 일부 기능은 변경되었다.

다음은 교재의의 실습을 따라 웹에서 실행되는 타이머를 만들어 본 예제 스크린샷이다.

03 안티그래비티 실전 활용법

AI가 엄한 소리를 하지 않게 하기 위해서는,
그리고 한정되어 있는 토큰의 낭비를 줄이기 위해서는
명확한 맥락과 요구사항이 담긴 프롬프트를 전달할 필요가 있다.

이를 위해 @ 멘션으로 파일을 참조함으로써
안티그래비티가 전체 프로젝트를 다 탐색하지 않고
특정 파일과 그 주변 맥락을 중심으로 판단하도록 할 수 있다.
@파일명 으로 파일 전체를 참조하거나 @파일명#L시작줄-끝 으로 특정 라인만 지정할 수 있다.
이를 직접 타이핑하지 않고 파일에서 특정 부분을 드래그 한 후 Ctrl+L 을 눌러도 된다.
파일 외에도 규칙이나 터미널 창 등 여러 가지를 참조할 수 있다.

책의 예시를 살펴 보면 다양한 방식으로 참조 멘션 기능을 활용하는 방법을 확인할 수 있다.

사전에 기본 규칙을 작성하고 이를 바탕으로 코드를 작성하도록 하면
보다 일관성 있는 프로젝트 구현이 가능하다.
이 때, 규칙도 직접 적지 않고 안티그래비티와의 대화를 통해 생성할 수도 있다.
어떤 규칙을 정해야 할지 모르겠을 땐 안티그래비티에게 초안을 요구한 후
책에 나와 있는 주의 사항만 반영해도 그럭저럭 쓸 만한 규칙이 마련될 것이다.

04 레트로 게임 만들기

안티그래비티를 활용하여 바이브 코딩을 하는 첫 예제로 레트로 게임을 만들어 본다.
ROCK 법칙을 사용하여 안티그래비티에게 프롬프트를 전달하며
기획 및 레퍼런스 탐색부터 MVP 모델 개발까지 코드 한 줄 쓰지 않고 해낼 수 있다.

나는 내 사전 지식을 포함하여 요구사항을 조금 수정하여 진행해 보았다.
가령 패키지 관리자는 pip가 아닌 uv를 사용하도록 한다거나.
그러면서도 코드 부분은 건드리지 않고 전부 AI가 작성하도록 놔뒀는데
충분히 그럴듯한 무언가가 만들어지더라.