이 페이지는 Cloud Translation API를 통해 번역되었습니다.

Google Antigravity 시작하기

1. 소개

이 Codelab에서는 에이전트 중심 개발 플랫폼인 Google Antigravity (문서의 나머지 부분에서는 Antigravity라고 함)에 대해 알아봅니다. 이 플랫폼은 IDE를 에이전트 우선 시대로 발전시킵니다.

줄을 자동 완성하는 표준 코딩 어시스턴트와 달리 Antigravity는 계획, 코딩, 웹 탐색을 통해 빌드를 지원하는 자율 에이전트를 관리하는 '미션 컨트롤'을 제공합니다.

Antigravity는 '에이전트 우선' 플랫폼으로 설계되었습니다. AI가 코드를 작성하는 도구일 뿐만 아니라 인간의 개입을 최소화하면서 복잡한 엔지니어링 작업을 계획, 실행, 검증, 반복할 수 있는 자율적인 행위자라고 가정합니다.

학습할 내용

Antigravity 설치 및 구성
Agent Manager, Editor, Browser 등 Antigravity의 주요 개념 살펴보기
Antigravity를 사용한 몇 가지 사용 사례 살펴보기

필요한 항목

현재 Antigravity는 개인 Gmail 계정의 미리보기로 제공됩니다. 최고급 모델을 사용할 수 있는 무료 할당량이 제공됩니다.

Antigravity는 시스템에 로컬로 설치되어 있어야 합니다. 이 제품은 Mac, Windows, 특정 Linux 배포에서 사용할 수 있습니다. 자체 머신 외에 다음이 필요합니다.

Chrome 웹브라우저
Gmail 계정 (개인 Gmail 계정)

이 Codelab은 초보자를 포함한 모든 수준의 사용자 및 개발자를 위해 설계되었습니다.

2. 설치

먼저 Antigravity를 설치합니다. 현재 제품은 미리보기로 제공되며 개인 Gmail 계정을 사용하여 시작할 수 있습니다.

다운로드 페이지로 이동하여 케이스에 해당하는 적절한 운영체제 버전을 클릭합니다. 애플리케이션 설치 프로그램을 실행하고 컴퓨터에 설치합니다. 설치를 완료한 후 Antigravity 애플리케이션을 실행합니다. 다음과 같은 화면이 표시됩니다.

매번 다음을 클릭하여 진행하세요. 주요 단계는 아래에 자세히 설명되어 있습니다.

Choose setup flow: 이렇게 하면 기존 VS Code 또는 Cursor 설정에서 가져오는 옵션이 표시됩니다. 새로운 시작을 할 것입니다.
Choose an Editor theme type. 어두운 테마를 사용하지만, 선호도에 따라 선택할 수 있습니다.
How do you want to use Antigravity agent:

이 내용을 좀 더 자세히 알아보고, 이는 확정된 것이 아니며 에이전트와 상호작용하는 중에도 언제든지 변경될 수 있다는 점을 기억하세요.

옵션을 자세히 살펴보기 전에 여기에서 두 가지 특정 속성 (대화상자의 오른쪽에 표시됨)을 살펴보겠습니다.

터미널 실행 정책

이는 에이전트가 터미널에서 명령어 (애플리케이션/도구)를 실행할 수 있도록 하는 것입니다. 여기에는 세 가지 옵션이 있습니다.

Off: 구성 가능한 허용 목록에 있는 명령어를 제외하고 터미널 명령어를 자동으로 실행하지 않습니다.
Auto: 에이전트가 지정된 터미널 명령어를 자동으로 실행할지 여부를 결정합니다. 권한이 필요한 경우 결정 후 권한을 요청합니다.
Turbo: 항상 터미널 명령어를 자동 실행합니다 (구성 가능한 거부 목록에 있는 명령어 제외).

정책 검토

에이전트가 작업을 수행하면 다양한 아티팩트 (작업 계획, 구현 계획 등)가 생성됩니다. 검토 정책은 검토가 필요한지 여부를 결정하는 사용자를 지정할 수 있도록 설정됩니다. 항상 검토할지 아니면 상담사가 결정하도록 할지 선택합니다. 따라서 여기에도 세 가지 옵션이 있습니다.

Always Proceed: 에이전트가 리뷰를 요청하지 않음
Agent Decides: 에이전트가 검토를 요청할 시기를 결정합니다.
Request Review: 에이전트가 항상 검토를 요청함

이제 이를 이해했으므로 4가지 옵션은 터미널 실행을 위한 특정 사전 설정일 뿐이며, 이 중 3가지에 대한 검토 정책과 완전히 맞춤설정할 수 있는 네 번째 옵션이 제공됩니다. 이 4가지 옵션은 사용자가 터미널에서 명령어를 실행하고 작업을 진행하기 전에 아티팩트를 검토할 수 있도록 에이전트에게 부여할 자율성을 선택할 수 있도록 제공됩니다.

다음 4가지 옵션이 있습니다.

에이전트 기반 개발
에이전트 지원 개발
리뷰 기반 개발
맞춤 구성

상담사 지원 개발 옵션은 상담사가 결정을 내리고 사용자에게 승인을 요청할 수 있으므로 균형이 잘 잡혀 있으며 권장되는 옵션입니다.

따라서 원하는 방법을 선택하고 지금은 권장되는 방법을 사용하는 것이 좋습니다.

Configure your Editor: 환경설정을 선택합니다.
Sign in to Google: 앞서 언급한 바와 같이 개인 Gmail 계정이 있는 경우 미리보기 모드에서 Antigravity를 무료로 사용할 수 있습니다. 지금 계정으로 로그인하세요. 이 경우 새 Chrome 프로필이 생성되도록 해야 합니다. 그러면 브라우저가 열리고 로그인할 수 있습니다. 인증에 성공하면 아래와 비슷한 메시지가 표시되고 Antigravity 애플리케이션으로 다시 연결됩니다. 흐름을 따르세요.
Terms of Use: 참여 여부를 결정한 다음 다음을 클릭합니다.

그러면 Antigravity가 여러분과 공동작업하기 위해 기다리고 있는 순간으로 이어집니다. 시작할 준비가 되었습니다.

3. 에이전트 관리자

Antigravity는 오픈소스 Visual Studio Code (VS Code) 기반을 포크하지만 텍스트 편집보다 에이전트 관리를 우선시하도록 사용자 환경을 대폭 변경합니다. 인터페이스는 편집기와 에이전트 관리자라는 두 개의 기본 창으로 나뉩니다. 관심사 분리는 개인 기여와 엔지니어링 관리 간의 차이를 반영합니다.

상담사 관리자: 미션 컨트롤

Antigravity를 실행하면 일반적으로 파일 트리가 아닌 아래와 같이 에이전트 관리자가 표시됩니다.

이 인터페이스는 Mission Control 대시보드 역할을 합니다. 고급 오케스트레이션을 위해 설계되었으며, 개발자가 여러 작업공간 또는 작업에서 비동기적으로 작동하는 여러 에이전트를 생성, 모니터링, 상호작용할 수 있습니다.

이 뷰에서 개발자는 아키텍트 역할을 합니다. 이들은 대략적인 목표를 정의합니다. 예를 들면 다음과 같습니다.

인증 모듈 리팩터링
종속 항목 트리 업데이트
결제 API의 테스트 모음 생성

위 다이어그램에 표시된 것처럼 이러한 각 요청은 전용 에이전트 인스턴스를 생성합니다. UI는 이러한 병렬 작업 스트림을 시각화하여 각 에이전트의 상태, 생성된 아티팩트 (계획, 결과, 차이점), 인간 승인을 기다리는 요청을 표시합니다.

이 아키텍처는 선형적이고 동기적인 챗봇 환경이 더 많았던 이전 IDE의 주요 제한사항을 해결합니다. 기존 채팅 인터페이스에서는 개발자가 AI가 코드 생성을 완료할 때까지 기다린 후 다음 질문을 해야 합니다. Antigravity의 관리자 뷰에서 개발자는 5개의 서로 다른 버그를 동시에 해결하기 위해 5개의 서로 다른 에이전트를 디스패치하여 처리량을 효과적으로 늘릴 수 있습니다.

위의 다음을 클릭하면 Workspace를 열 수 있습니다.

VS Code에서 알고 있던 Workspace를 생각하면 됩니다. 버튼을 클릭하고 시작할 폴더를 선택하여 로컬 폴더를 열 수 있습니다. 이 경우 홈 폴더에 my-agy-projects라는 폴더가 있었고 이를 선택했습니다. 완전히 다른 폴더를 사용할 수 있습니다.

원하는 경우 이 단계를 완전히 건너뛸 수 있으며 나중에 언제든지 Workspace를 열 수 있습니다.

이 단계를 완료하면 아래와 같은 에이전트 관리자 창이 표시됩니다.

선택한 작업공간 폴더 (my-agy-projects)에서 새 대화를 시작하도록 애플리케이션이 즉시 설정됩니다. 다른 AI 애플리케이션 (Cursor, Gemini CLI)을 사용한 기존 지식을 활용하여 프롬프트를 입력하는 동안 @ 및 기타 방법을 사용하여 추가 컨텍스트를 포함할 수 있습니다.

Planning 및 Model Selection 드롭다운을 모두 확인하세요. 모델 선택 드롭다운을 사용하면 에이전트가 사용할 수 있는 모델 중 하나를 선택할 수 있습니다. 목록은 아래와 같습니다.

마찬가지로 에이전트는 기본 Planning 모드에 있습니다. Fast 모드를 사용할 수도 있습니다.

문서에서 이와 관련해 설명하는 내용을 살펴보겠습니다.

Planning: 에이전트가 작업을 실행하기 전에 계획을 세울 수 있습니다. 심층 연구, 복잡한 작업 또는 공동 작업에 사용합니다. 이 모드에서 에이전트는 작업 그룹으로 작업을 정리하고, 아티팩트를 생성하고, 최적의 품질을 위해 작업을 철저히 조사하고, 생각하고, 계획하는 다른 단계를 거칩니다. 여기에 훨씬 더 많은 출력이 표시됩니다.
Fast: 에이전트가 작업을 직접 실행합니다. 변수 이름 바꾸기, 몇 가지 bash 명령어 시작, 기타 작은 로컬 작업과 같이 더 빠르게 완료할 수 있는 간단한 작업에 사용합니다. 속도가 중요한 요소이고 품질이 저하될 우려가 적을 정도로 작업이 간단한 경우에 유용합니다.

에이전트의 사고 예산 및 유사한 용어에 익숙하다면 에이전트의 사고를 제어하여 사고 예산에 직접적인 영향을 미칠 수 있는 기능이라고 생각하면 됩니다. 지금은 기본값을 사용하지만 출시 시점에는 Gemini 3 Pro 모델의 사용 가능 여부가 모든 사용자에 대한 제한된 할당량에 따라 결정되므로 Gemini 3 사용에 대한 무료 할당량을 소진한 경우 이를 나타내는 적절한 메시지가 표시될 수 있습니다.

이제 에이전트 관리자 (창)에 대해 잠시 알아보고 기본 빌딩 블록, Antigravity 탐색 방법 등을 명확히 이해해 보겠습니다. 아래에 에이전트 관리자 창이 표시됩니다.

위의 다이어그램을 참고하세요.

Inbox: 모든 대화를 한곳에서 추적하는 방법이라고 생각하면 됩니다. 에이전트가 작업을 수행하도록 보내면 받은편지함에 표시되며 받은편지함을 클릭하여 현재 대화 목록을 확인할 수 있습니다. 대화를 탭하면 교환된 모든 메시지, 할 일 상태, 상담사가 생성한 항목, 할 일에 대한 승인을 기다리고 있는지 여부까지 확인할 수 있습니다. 이전 작업으로 나중에 돌아갈 수 있는 좋은 방법입니다. 매우 유용한 기능입니다.
Start Conversation: 새 대화를 시작하려면 이 아이콘을 클릭합니다. 그러면 Ask anything이라고 표시된 입력으로 바로 이동합니다.
Workspaces: 작업공간에 대해 언급했으며 원하는 작업공간에서 작업할 수 있습니다. 언제든지 작업공간을 추가할 수 있으며 대화를 시작할 때 작업공간을 선택할 수 있습니다.
Playground: 상담사와 대화를 시작한 후 파일 등을 더 엄격하게 관리할 수 있는 작업공간으로 전환할 수 있는 좋은 방법입니다. 스크래치 영역이라고 생각하면 됩니다.
Editor View: 지금까지는 에이전트 관리자 뷰에 있습니다. 원하는 경우 언제든지 편집기 보기로 전환할 수 있습니다. 그러면 작업공간 폴더와 생성된 파일이 표시됩니다. 여기에서 파일을 직접 수정하거나 편집기에서 인라인 안내, 명령어를 제공하여 에이전트가 수정된 추천/안내에 따라 작업을 수행하거나 변경할 수 있습니다. 편집기 보기는 나중에 자세히 다루겠습니다.
Browser: 마지막으로 Antigravity를 매우 강력하게 만드는 명확한 차별화 요소 중 하나인 Chrome 브라우저와의 긴밀한 통합에 대해 알아보겠습니다. 다음 섹션에서 브라우저를 설정해 보겠습니다.

4. Antigravity 브라우저 설정

문서에 따라 에이전트가 브라우저와 상호작용하려면 브라우저 하위 에이전트를 호출하여 당면한 작업을 처리합니다. 브라우저 하위 에이전트는 Antigravity에서 관리하는 브라우저 내에서 열린 페이지에서 작동하도록 특화된 모델을 실행합니다. 이 모델은 기본 에이전트에 대해 선택한 모델과 다릅니다.

이 하위 에이전트는 클릭, 스크롤, 입력, 콘솔 로그 읽기 등 브라우저를 제어하는 데 필요한 다양한 도구에 액세스할 수 있습니다. 또한 DOM 캡처, 스크린샷 또는 마크다운 파싱을 통해 열려 있는 페이지를 읽고 동영상을 촬영할 수 있습니다.

즉, Antigravity 브라우저 확장 프로그램을 실행하고 설치해야 합니다. Playground에서 실제로 대화를 시작하고 단계를 진행하여 이를 수행해 보겠습니다.

Playground을 선택하고 아래와 같이 에이전트에게 go to antigravity.google 팔로우 작업을 제공합니다.

작업을 제출합니다. 태스크를 분석하는 에이전트가 표시되며 사고 과정을 검사할 수 있습니다. 그러면 올바르게 진행되어 아래와 같이 브라우저 에이전트를 설정해야 한다고 언급합니다. 설정을 클릭합니다.

그러면 브라우저가 표시되고 아래와 같이 확장 프로그램을 설치하라는 메시지가 표시됩니다.

계속 진행하면 설치할 수 있는 Chrome 확장 프로그램으로 연결됩니다.

확장 프로그램을 성공적으로 설치하면 Antigravity Agent가 작업을 시작하고 작업을 수행할 권한을 허용해 달라는 메시지를 표시합니다. 열린 브라우저 창에 다음과 같은 활동이 표시됩니다.

에이전트 관리자 뷰로 다시 전환하면 다음이 표시됩니다.

이는 에이전트에게 antigravity.google 웹사이트를 방문하라고 요청했으므로 예상한 결과입니다. 권한을 부여하면 아래와 같이 웹사이트로 안전하게 이동한 것을 확인할 수 있습니다.

아티팩트 검사

이제 흥미로운 부분이 나옵니다. 에이전트가 작업을 완료하면 전체 작업을 확인할 수 있습니다. 이를 통해 아티팩트가 도입됩니다. 아티팩트는 계획된 작업, 지금까지 완료된 작업, 이를 검증한 방식 측면에서 신뢰를 구축하는 기반이 됩니다.

아티팩트는 '신뢰 격차'를 해결합니다. 이전에는 상담사가 '버그를 수정했습니다'라고 말하면 개발자가 코드를 읽어 확인해야 했습니다. Antigravity에서 에이전트는 이를 증명하기 위해 아티팩트를 생성합니다.

Antigravity는 작업에 따라 주요 아티팩트를 생성하는 데 중점을 둡니다. 여기에는 작업 계획, 구현 계획, 최종적으로 연습 계획 (검증 포함)이 포함될 수 있습니다. 이러한 계획에는 다음과 같은 사항이 포함되어야 합니다.

Task Lists & Plans: 코드를 작성하기 전에 에이전트가 구조화된 계획을 생성합니다. 사용자는 이 계획을 검토하고 수정하고 승인할 수 있습니다.
Code Diffs: 변경될 행을 정확하게 보여주는 표준화된 차이 뷰입니다.
Screenshots: 에이전트가 변경 전후의 UI 상태를 캡처합니다.
Browser Recordings: 동적 상호작용 (예: '로그인 버튼을 클릭하고 스피너를 기다린 후 대시보드가 로드되는지 확인') 에이전트는 세션 동영상을 녹화합니다. 개발자는 이 동영상을 시청하여 앱을 직접 실행하지 않고도 기능 요구사항이 충족되는지 확인할 수 있습니다.
Test Results: 에이전트가 생성하고 실행한 테스트의 통과/실패에 관한 구조화된 로그입니다.

오른쪽 상단의 에이전트 관리자 보기에서 변경사항 검토 옆에 아티팩트를 전환하는 버튼이 표시됩니다. 아티팩트가 전환되면 생성된 아티팩트 목록이 표시됩니다.

아래와 같이 아티팩트 뷰가 표시됩니다. 이 경우 상담사에게 antigravity.google 페이지를 방문하도록 안내했으므로 스크린샷이 캡처되고 동영상이 생성되는 등의 작업이 이루어졌습니다.

개발자는 'Google 문서 스타일 댓글'을 사용하여 이러한 아티팩트와 상호작용할 수 있습니다. 특정 작업이나 태스크를 선택하고 원하는 방식으로 명령어를 제공한 다음 에이전트에 제출할 수 있습니다. 그러면 에이전트가 이 피드백을 수집하고 이에 따라 반복합니다. 작성자에게 의견을 제공하면 작성자가 이를 반복하는 대화형 Google Docs를 사용하는 것을 생각해 보세요.

5. 받은편지함 다시 확인하기

에이전트와 몇 차례 대화를 시작했다면 이제 에이전트 관리자 창의 받은편지함을 확인하세요. 이렇게 하면 모든 대화가 표시됩니다. 대화를 클릭하면 해당 대화의 기록, 생성된 아티팩트 등을 확인할 수 있습니다. 첫 번째 대화를 실행한 후 받은편지함에 아래와 같이 대화가 표시됩니다.

해당 대화를 클릭하면 다음과 같은 세부정보가 표시됩니다.

여기에서 대화를 계속할 수도 있습니다.

6. 편집기

Editor는 VS Code의 친숙함을 유지하여 숙련된 개발자의 근육 기억을 존중합니다. 여기에는 표준 파일 탐색기, 구문 강조 표시, 확장 프로그램 생태계가 포함됩니다.

Agent Manager의 오른쪽 상단에 있는 Open Editor 버튼을 클릭하여 편집기로 이동할 수 있습니다.

'에이전트 인식' 기능이 추가된 편집기

Inline Command: 편집기는 바이브 코딩과 인라인 명령어를 지원하며, 사용자는 코드를 강조 표시하고 에이전트에게 "Make this more efficient" 또는 "Add comments explaining this logic"을 지시할 수 있습니다.
Agent Side Panel : 편집기 오른쪽의 패널을 사용하여 에이전트와 직접 작업합니다. 여기에서 새 대화를 시작하거나 코드를 변경하도록 지시할 수 있습니다.

에이전트가 여러 코드 파일을 만드는 웹 개발과 관련된 몇 가지 사용 사례를 살펴보면 편집기에서 파일을 확인하고, 변경하고, 여기에서 에이전트와 직접 상호작용할 수 있습니다.

7. 편집기와 에이전트 관리자 간 전환

Antigravity는 편집기와 상담사 관리자가 별도의 창에 있으며 둘 다 명확하게 필요하다는 점에서 의견이 있습니다. 편집기에 있는 경우 오른쪽 상단의 에이전트 관리자 열기 버튼을 통해 또는 에이전트 관리자에 있는 경우 오른쪽 상단의 편집기 열기 버튼을 클릭하여 한쪽에서 다른 쪽으로 전환할 수 있습니다.

또는 Cmd + E 단축키를 사용하여 두 모드 간에 전환할 수도 있습니다.

8. 사용 사례

이제 제품을 기본적으로 이해했으니 몇 가지 사용 사례를 통해 실제 작동 방식을 살펴보겠습니다. Antigravity는 에이전트 우선 플랫폼입니다. 즉, 대부분의 경우 Google은 에이전트에게 지시를 내리고 에이전트는 자체적으로 작업을 수행하고, 필요한 경우 권한을 요청하고, 아티팩트를 생성한 후 작업이 완료되면 Google에 알립니다. 따라서 다음 사용 사례 각각에서 에이전트 대화의 모든 출력을 생성할 수는 없습니다. 안내와 예상 결과의 필수 스크린샷을 공유해 드리지만 결과는 약간 다를 수 있습니다.

여기에서는 외부 사이트에서 몇 가지 작업을 자동화하는 것부터 프로젝트의 단위 테스트 사례를 생성하고 확인하는 것, 전체 웹사이트 개발에 이르기까지 다양한 사용 사례를 다룹니다. 안내를 시작하겠습니다.

뉴스 하이라이트

간단한 사용 사례이지만 웹브라우저를 사용하여 웹사이트를 방문하고, 정보를 추출하고, 일부 작업을 실행한 다음 사용자에게 데이터를 반환하는 기반이 될 수 있습니다.

이 경우 Google 뉴스 사이트를 방문하여 정보를 추출합니다. 하지만 원하는 사이트를 쉽게 실험해 보고 결과를 확인할 수 있습니다.

아래와 같이 Agent Manager에 있고 Playground를 선택했는지 확인합니다.

그런 다음 다음 안내를 제공합니다.

이렇게 하면 에이전트 프로세스가 시작되고 브라우저를 실행해야 하는지 등이 결정됩니다. 사고 과정에 주의를 기울이고 에이전트가 어떻게 작업을 수행하는지 확인하세요. 모두 잘 진행되면 아래와 같이 Antigravity 브라우저가 실행되고 사이트를 방문합니다. 사이트 주변의 파란색 테두리는 에이전트가 이제 브라우저를 제어하고 사이트를 탐색하여 정보를 가져오고 있음을 보여줍니다.

작업이 완료되면 아래와 같이 아티팩트가 생성되는 것도 확인할 수 있습니다.

에이전트의 샘플 실행은 아래와 같습니다.

왼쪽에 생각 과정이 표시됩니다. 포인트를 스크롤하여 재생 및 기타 데이터를 볼 수도 있습니다.

시도해 볼 만한 작업

이 내용을 이해한 후에는 에이전트가 방문하여 데이터를 가져오거나 요약할 수 있는 웹사이트를 선택합니다. 대시보드와 차트가 있는 웹사이트를 고려하여 몇 가지 값을 선택해 달라고 요청합니다.
다음 프롬프트를 사용해 보세요. Visit https://docs.cloud.google.com/release-notes and get me a summary of the release notes, categorized by product.

Python + Flask로 동적 웹사이트 생성

이제 완전한 웹 애플리케이션을 생성해 보겠습니다. 만들 웹 애플리케이션은 하루 동안 여러 연사가 강연하는 1일 기술 이벤트에 관한 정보를 제공하는 사이트입니다.

다시 한번 Agent Manager에 있고 Playground를 선택했는지 확인합니다.

다음 프롬프트를 입력합니다.

I would like to generate a website that is a 1-day technical conference informational site.

The website should have the following functionality:
        1. A home page that shows the current date, location, schedule and time table.
        2. The 1-day event is a list of 8 talks in total.
        3. Each talk has 1 or 2 max. speakers. 
        4. A talk has an ID, Title, Speakers, Category (1 or 2), Description and time of the talk.
        5. Each speaker has a First Name, Last Name and LinkedIn url.
        6. Allow for users to search by category, speaker, title.
        7. Give a lunch break of 60 minutes.
        8. Use dummy data for events and speakers, come up with a schedule, the event is about Google Cloud Technologies.
        9. Tech Stack: Python and Flask framework on server side. Front-end is basic HTML, CSS and JavaScript. 
        10. Test out the site on your own for all functionality and provide a detailed README on how to setup, run and make any further changes. 
11. Launch the web application for me to review.

위의 프롬프트를 입력하여 대화를 시작할 수 있습니다.

에이전트가 작업을 진행하면서 아티팩트 생성을 진행합니다.

작업 아티팩트
구현 아티팩트
둘러보기 아티팩트

아래에 주어진 작업 아티팩트는 상담사가 주어진 작업을 기반으로 실행해야 한다고 해독한 초기 작업 시퀀스입니다. 실행의 샘플 스크린샷은 아래에 나와 있습니다.

그런 다음 구현 계획 아티팩트를 클릭합니다. 샘플 스크린샷은 아래에 나와 있습니다.

마지막으로 Walkthrough 아티팩트가 있습니다. 여기에는 아래와 같이 에이전트가 수행한 모든 작업이 포함됩니다.

서버가 시작되었고 URL이 제공되었습니다. URL을 클릭하면 애플리케이션이 표시됩니다. 샘플 스크린샷은 아래에 나와 있습니다.

편집기로 전환하면 Python Flask 애플리케이션이 생성된 폴더가 화면에 표시됩니다. 오른쪽에 Agent mode이 태그되어 있으며 여기에서도 대화를 이어갈 수 있습니다.

이제 이벤트에 몇 가지 강연을 더 추가하고 싶다고 가정해 보겠습니다. 편집기와 에이전트 패널에 머물면서 Add two more talks to the schedule와 같은 명령어를 입력할 수 있습니다.

이렇게 하면 에이전트가 요구사항을 분석하고, 작업, 구현 계획을 업데이트한 다음, 업데이트된 기능을 검증합니다. 샘플 대화는 다음과 같습니다.

원하는 경우 에이전트 관리자로 다시 전환할 수 있습니다. 이 프로세스를 통해 상담사 관리자에서 편집자로 전환하고 그에 따라 변경하는 등의 프로세스를 이해할 수 있습니다.

참고: 이 작업을 실행하는 동안 에이전트가 현재 머신에서 사용 중인 포트 5000에서 Flask 서버를 시작하려고 했습니다. 8080을 사용하기로 결정하고 서버를 시작할 수 있을 때까지 다음 무료 포트를 계속 시도했습니다.

시도해 볼 만한 작업

애플리케이션에 원하는 기능을 추가합니다. 세부정보를 에이전트에게 제공하고, 먼저 작업 목록을 수정한 다음 구현 계획 등을 수정하여 작업을 수행하는 방식을 확인합니다.
에이전트에게 애플리케이션의 README 또는 추가 문서를 생성해 달라고 요청합니다.

간단한 생산성 앱 생성

이제 간단한 포모도로 타이머 웹 애플리케이션을 생성하겠습니다.

Agent Manager에 있고 Playground를 선택했는지 확인합니다. 다음 프롬프트를 입력합니다.

Create a productivity app that features a Pomodoro timer. Give a calm and aesthetic look to the application.

할 일 목록과 구현 계획을 만든 다음 이를 실행하는 방식을 확인하세요. 흐름에 계속 주의를 기울이세요. 검토를 요청하는 상황이 있을 수 있습니다. 샘플 실행은 아래와 같습니다.

이 경우 Antigravity 브라우저도 실행하고 자체 테스트를 실행한 후 테스트가 성공했는지 확인해야 합니다. 이 도구에서 생성한 항목 중 하나는 인증 동영상이 포함된 미디어 아티팩트입니다. 이를 통해 테스트한 내용을 확인할 수 있습니다. 또한 스타일이 적용되지 않았고 적용할 수 있었기 때문에 스타일 변경을 제안했습니다.

최종 앱은 아래와 같으며 꽤 괜찮아 보입니다.

애플리케이션에 멋진 타이머 이미지를 추가할 수 있습니다. 아래와 같이 후속 안내를 제공하기만 하면 됩니다.

Add an image to the application that displays a timer.

이로 인해 에이전트가 태스크 아티팩트에 새 태스크를 추가했습니다.

그런 다음 작업을 진행하면서 이미지를 생성했습니다.

마지막으로 앱에 요청한 이미지가 표시됩니다.

시도해 볼 만한 작업

애플리케이션의 모래시계 아이콘 배경이 투명하지 않습니다. 에이전트에게 투명하게 만들어 달라고 요청해 보세요.
생성하려는 애플리케이션의 변형을 몇 가지 사용해 보세요. 스타일, 이미지를 사용해 보고 변경을 요청하는 등 다양한 시도를 해 보세요.

단위 테스트 생성, 모의 스텁 생성, 테스트 검증

여기서 시도할 마지막 사용 사례는 특정 코드 파일의 단위 테스트를 생성하고 에이전트가 테스트를 실행하고 검증하는 것입니다.

이를 위해 아래와 같이 단일 Python 파일이 있는 작업공간을 사용합니다.

from typing import Dict

# --- Custom Exceptions ---
class InventoryShortageError(Exception):
    """Raised when there is not enough item stock."""
    pass

class PaymentFailedError(Exception):
    """Raised when the payment gateway rejects the transaction."""
    pass

class InvalidOrderError(Exception):
    """Raised when the order violates business rules."""
    pass

# --- External Service Interfaces (To be Mocked) ---
class InventoryService:
    def get_stock(self, product_id: str) -> int:
        """Connects to DB to check stock."""
        raise NotImplementedError("Real connection required")

    def decrement_stock(self, product_id: str, quantity: int):
        """Connects to DB to reduce stock."""
        raise NotImplementedError("Real connection required")

class PaymentGateway:
    def charge(self, amount: float, currency: str) -> bool:
        """Connects to Stripe/PayPal."""
        raise NotImplementedError("Real connection required")

# --- Main Business Logic ---
class Order:
    def __init__(self, 
                 inventory_service: InventoryService, 
                 payment_gateway: PaymentGateway,
                 customer_email: str,
                 is_vip: bool = False):
        
        self.inventory = inventory_service
        self.payment = payment_gateway
        self.customer_email = customer_email
        self.is_vip = is_vip
        self.items: Dict[str, Dict] = {} # {product_id: {'price': float, 'qty': int}}
        self.is_paid = False
        self.status = "DRAFT"

    def add_item(self, product_id: str, price: float, quantity: int = 1):
        """Adds items to the cart. Rejects invalid prices or quantities."""
        if price < 0:
            raise ValueError("Price cannot be negative")
        if quantity <= 0:
            raise ValueError("Quantity must be greater than zero")

        if product_id in self.items:
            self.items[product_id]['qty'] += quantity
        else:
            self.items[product_id] = {'price': price, 'qty': quantity}

    def remove_item(self, product_id: str):
        """Removes an item entirely from the cart."""
        if product_id in self.items:
            del self.items[product_id]

    @property
    def total_price(self) -> float:
        """Calculates raw total before discounts."""
        return sum(item['price'] * item['qty'] for item in self.items.values())

    def apply_discount(self) -> float:
        """
        Applies business logic:
        1. VIPs get flat 20% off.
        2. Regulars get 10% off if total > 100.
        3. No discount otherwise.
        """
        total = self.total_price
        
        if self.is_vip:
            return round(total * 0.8, 2)
        elif total > 100:
            return round(total * 0.9, 2)
        
        return round(total, 2)

    def checkout(self):
        """
        Orchestrates the checkout process:
        1. Validates cart is not empty.
        2. Checks stock for all items.
        3. Calculates final price.
        4. Charges payment.
        5. Updates inventory.
        """
        if not self.items:
            raise InvalidOrderError("Cannot checkout an empty cart")

        # 1. Check Inventory Logic
        for product_id, data in self.items.items():
            available_stock = self.inventory.get_stock(product_id)
            if available_stock < data['qty']:
                raise InventoryShortageError(f"Not enough stock for {product_id}")

        # 2. Calculate Final Price
        final_amount = self.apply_discount()

        # 3. Process Payment
        try:
            success = self.payment.charge(final_amount, "USD")
            if not success:
                raise PaymentFailedError("Transaction declined by gateway")
        except Exception as e:
            # Catching generic network errors from the gateway
            raise PaymentFailedError(f"Payment gateway error: {str(e)}")

        # 4. Decrement Stock (Only occurs if payment succeeded)
        for product_id, data in self.items.items():
            self.inventory.decrement_stock(product_id, data['qty'])

        self.is_paid = True
        self.status = "COMPLETED"
        
        return {"status": "success", "charged_amount": final_amount}