Leg · Vibe Coding 讀書會
AI 讀書會 · 教學講義 · v1.0

Google Antigravity
新手入門完全指南

一頁讀完:什麼是 Antigravity、為什麼大家在用、怎麼安裝、什麼是 .md 檔、 Rules 跟 Skills 差在哪、提示詞要怎麼寫、寫完怎麼上線。 不講玄的,只講你今天就會用到的。

適合對象:第一次接觸 AI 編程的學生 預期時間:60 分鐘導讀 + 自學 學習路徑:先安裝 → 補擴充 → 補環境 → 看介面 → 學概念 → 動手做
CHAPTER 01

什麼是 Antigravity?

Antigravity 是 Google 推出的 AI 程式碼編輯器,建立在大家熟悉的 VS Code 之上,但整個工具是 圍繞「AI Agent」設計的——意思是:你不是在打字寫程式,你是在「指揮一個會自己工作的 AI 同事」。

一句話定位

從「人寫、AI 幫忙」變成「AI 主導、人監督」。你下需求,AI 寫程式、開瀏覽器測試、留下截圖紀錄給你看。

它跟你聽過的工具差在哪?

工具類型特色
CursorVS Code 改造的 IDEAI 寫程式很順,但要付費
Claude Code命令列 CLI強,但是黑色終端機,新手怕
Antigravity完整 IDE + Agent 平台登入 Google 帳號就免費用,附帶瀏覽器自動化
CHAPTER 02

為什麼要用它?

CHAPTER 03

安裝 Antigravity 本體

Windows / Mac / Linux 都能裝。整個流程約 5 分鐘。這一章只負責把 Antigravity 裝起來能開,擴充跟開發環境留到第 4、5 章。

下載 Antigravity

antigravity.google 下載對應作業系統版本,跑安裝程式。

第一次啟動 — 匯入設定

會問你要從零開始、從 VS Code 匯入、還是從 Cursor 匯入。新手選「Start fresh(從零開始)」即可。

選主題與工作模式

主題隨喜(Dark / Light / Tokyo Night / Solarized)。工作模式建議選「Agent-assisted(AI 輔助)」——AI 動手前會問你,比較不會暴衝。

登入 Google 帳號

登入後就能用,免費版額度按週計算,Pro 版每 5 小時刷新。

把專案資料夾拖進來

建立任意空資料夾(例如 my-first-app),拖進 Antigravity,AI 工作區就開好了。

下一步

裝好之後 先別急著開始寫程式。下一章先把幾個必裝擴充補上,使用體驗會差很多。

CHAPTER 04

必裝擴充套件

Antigravity 沿用 VS Code 的擴充市集(Extensions)。左側欄有個方塊堆疊的圖示就是擴充頁面,搜尋名稱、按 Install 即可。下面是學生第一週就該裝的幾個:

① 中文化介面:Chinese (Traditional) Language Pack

把整個 IDE 介面翻成繁體中文,選單、按鈕、提示全部中文化。不影響程式碼,只改 UI 文字。

② Antigravity Cockpit(駕駛艙)

用視覺化介面看 AI Agent 在做什麼——目前在跑哪個任務、進度到哪、用了多少 token。新手最有感的擴充,因為可以看到 AI 的思路,不再是黑盒子。

③ Python(如果你會碰 Python)

寫 Python 必裝。提供語法高亮、自動完成、debug、虛擬環境管理。AI 寫 Python 給你時,這個擴充能即時挑出語法錯誤。

④ Prettier — Code Formatter

存檔自動整理程式碼縮排與格式。記得在 Rules 裡跟 AI 說「Please respect my prettier preferences」,AI 寫的程式碼也會配合。

⑤ GitLens

把 Git 歷史視覺化:滑鼠移到任何一行程式,能看到「這行是誰、哪天、為什麼這樣寫」。除錯時超有用。

⑥ Live Server

右鍵任何 HTML 檔 → Open with Live Server,會跑一個本機伺服器,存檔自動重新整理。寫純前端時必備。

最低限度

時間不夠的話,至少裝前兩個:中文化 + Cockpit。這兩個直接決定你看不看得懂這個 IDE 在幹嘛。

CHAPTER 05

安裝開發環境

Antigravity 是「給 AI 跟你共同寫程式的編輯器」,但它本身不會跑你的程式。要讓寫好的程式真的能執行、能上 GitHub,你電腦得先有這幾個工具:

工具做什麼什麼時候會用到
Git 版本控制 + 上傳 GitHub 幾乎每個專案都用,部署一定要
Node.js 跑前端專案、安裝套件 寫網站、React、Vue、Vite
Python 跑後端 / 自動化 / 資料處理 寫爬蟲、AI 模型、機器學習

Git(必裝)

  1. git-scm.com 下載安裝
  2. 安裝精靈一路下一步即可(Mac 內建)
  3. 裝完開終端機輸入 git --version,看到版本號就成功
  4. 第一次設定身份(之後 commit 會帶這個名字):
git config --global user.name "你的名字"
git config --global user.email "你的email@gmail.com"

Node.js(寫網站必裝)

  1. nodejs.org 下載 LTS 版本(標 Recommended for most users)
  2. 安裝精靈一路下一步
  3. 裝完開終端機驗證:
node --version    # 應該看到 v20.x.x 之類
npm --version     # Node 會順便裝 npm(套件管理器)

Python(要用再裝)

  1. python.org/downloads 下載最新版(3.12 以上)
  2. Windows 安裝時務必勾選「Add Python to PATH」,否則終端機找不到
  3. 裝完驗證:
python --version    # Mac/Linux 可能要打 python3
pip --version       # Python 的套件管理器
Windows 學生最常踩雷

Python 安裝忘記勾「Add to PATH」→ 之後每個 python 指令都跑不動。遇到「'python' 不是內部或外部命令」的錯誤訊息,就是這個原因。重新安裝、勾起來、重啟終端機。

不會裝?把這段貼給 AI

「我用的是 Windows / Mac,請用最詳細的步驟教我安裝 Git、Node.js、Python,包括下載連結、每一步要點哪個按鈕、裝完怎麼驗證。」AI 會給你完整 SOP。

CHAPTER 06

介面三大區

你打開 Antigravity 看到的東西,可以拆成三個視角:

① Manager View(指揮台)

同時看多個 Agent 在做什麼。可以開好幾個任務並行——一個 Agent 改前端、另一個 Agent 改後端,互不干擾。

② Editor View(編輯器)

跟 VS Code 一模一樣的程式碼編輯器,左邊檔案總管、中間程式碼、右邊 AI 對話。你可以打字寫,但更多時候是「跟 AI 講話」。

③ Browser(內建瀏覽器)

裝 Antigravity Chrome 擴充後,AI 可以自己開網頁測試你的成果。它會自己點按鈕、自己看畫面、自己截圖——你寫完一個登入頁,它會幫你試帳密能不能登。

Agent 設定面板(重要!)

右上角有個齒輪 Agent Settings,裡面有四件事要顧:

  • Customizations:寫 Rules(你給 AI 的常駐指令,下一章詳解)
  • Model:切換 Gemini / Claude / GPT
  • Mode:複雜任務用 Planning、簡單問題用 Fast
  • Permissions:終端機指令權限。不要開「Turbo 全自動」,會出事
CHAPTER 07

先懂 .md 檔:AI 讀的是 Markdown

學 Antigravity 之前,先建立一個觀念:AI 不是看你的滑鼠點擊,AI 看的是檔案。而它最愛的檔案格式叫做 .md(Markdown)。

什麼是 Markdown?

就是「能寫粗體、標題、清單,但用純文字寫」的格式。副檔名是 .md。下面這行:

# 我的網站
這是 **粗體** 文字
- 第一點
- 第二點

會被渲染成有大標題、粗體、項目符號的文章。GitHub、Notion、Discord 都吃這個格式。

為什麼 AI 一直要你建 .md 檔?

因為 AI 把你的指令當「文件」來讀。比起一段對話,結構化的 Markdown 檔案讓它更清楚目標跟限制。Antigravity 裡你會碰到三種重要的 .md 檔:

檔名放哪用途
README.md專案根目錄給「人」看的:這個專案是什麼、怎麼跑
AGENTS.md專案根目錄給「AI」看的:這個專案的規則、慣例、不能碰的東西
SKILL.md.agent/skills/技能名/定義一個可重用的「技能包」(後面講)
教學重點

學生第一週只要記住:「跟 AI 講過的重要規則,要寫成 .md 檔放進專案」。對話會被忘記,檔案不會。

CHAPTER 08

Rules:給 AI 的「常駐人格」

Rules 是你寫一次、AI 每次都會讀的指令。位置在 Customizations → Rules。可以設「全域 Global」(所有專案通用)或「專案 Workspace」(只在這個專案生效)。

學生用的中文 Rules 範本

# 對話偏好
- 一律用 繁體中文 回答
- 直接給程式碼或詳細解釋,不要套高層次的廢話
- 把使用者當成資深工程師對待
- 答案先給,理由附在後面
- 我問什麼回答什麼,不要主動加功能

# 程式碼風格
- 不要寫沒必要的註解
- 不要為了「未來可能需要」加抽象層
- 改 bug 不順便重構
- 變數名稱要有意義,不要 a, b, x, tmp
為什麼這樣寫

工程師圈很流行一句話:「DO NOT GIVE ME HIGH LEVEL SHIT」。意思是不要敷衍——叫 AI 直接給東西,不要先講三段廢話再寫一行程式。

原版完整 Rules(推薦直接貼用)

下面這份 Rules 是流傳已久的工程師通用版本,三大 IDE 都吃——Antigravity、Cursor、Claude Code 通通能用。直接整段貼下去就好:

DO NOT GIVE ME HIGH LEVEL SHIT, IF I ASK FOR FIX OR EXPLANATION,
I WANT ACTUAL CODE OR EXPLANATION!!! I DON'T WANT
"Here's how you can blablabla"

- Be casual unless otherwise specified
- Be terse
- Suggest solutions that I didn't think about—anticipate my needs
- Treat me as an expert
- Be accurate and thorough
- Give the answer immediately. Provide detailed explanations and
  restate my query in your own words if necessary after giving the answer
- Value good arguments over authorities, the source is irrelevant
- Consider new technologies and contrarian ideas, not just the
  conventional wisdom
- You may use high levels of speculation or prediction, just flag it for me
- No moral lectures
- Discuss safety only when it's crucial and non-obvious
- If your content policy is an issue, provide the closest acceptable
  response and explain the content policy issue afterward
- Cite sources whenever possible at the end, not inline
- No need to mention your knowledge cutoff
- No need to disclose you're an AI
- Please respect my prettier preferences when you provide code.
- Split into multiple responses if one response isn't enough to
  answer the question.

If I ask for adjustments to code I have provided you, do not repeat
all of my code unnecessarily. Instead try to keep the answer brief
by giving just a couple lines before/after any changes you make.
Multiple code blocks are ok.

# 中文使用者建議再加這行:
- Always respond in 繁體中文

怎麼加進 Antigravity?

Antigravity 提供 兩種方式,挑一個就好(或兩個都用):

方式 A:UI 設定(最快)

  • 右上角齒輪 ⚙️ → Customizations
  • Rules 分頁
  • Global Rules(全域)
  • 把上面整段貼進去 → 存檔

方式 B:寫成檔案(推薦)

  • 專案根目錄建立 AGENTS.md
  • 把規則貼進去
  • commit 進 git,整個團隊共用
  • AI 開啟專案會自動讀取

放在哪?三個層級的差別

層級位置生效範圍適合放
Global Rules 齒輪 → Customizations 你電腦上所有專案 個人偏好(語氣、語言、口吻)
Workspace Rules 專案/AGENTS.md 只此專案 + 整個團隊 專案規範(用什麼框架、命名規則)
Skills .agent/skills/ 相關任務時才載入 專業流程(部署、API 接法)

這份 Rules 的用途是什麼?

把 AI 的「對話人格」一次校準到位——它本來預設是「耐心客服」,這份 Rules 把它改造成「資深工程師同事」。

逐條翻譯一下用途:

為什麼要這樣做?(最重要的一段)

三個關鍵理由
  1. 省 token、省錢、省時間:AI 預設的客套話跟重複貼程式碼,每次都吃掉一大堆 token。把它關掉,同樣的額度可以撐三倍長的對話。
  2. 降低決策疲勞:你問一個 bug,它先給三段「可能的原因有...」,你還要自己挑哪個對。直接叫它給答案,工作節奏立刻變快。
  3. 校準專業度:AI 預設的目標客群是「完全新手」。一旦你跟它說「我是 expert」,它的程式碼品質、術語精準度、跟它願意提的進階技巧,全部會升級。
教學提醒

學生第一週請先用方式 A 貼到 Global Rules,全部專案立刻受惠。等做第二個專案時再學方式 B,把專案特殊規則寫進 AGENTS.md不要一次學完所有層級,會混亂。

CHAPTER 09

Skills:給 AI 的「專業技能包」

2026 年 1 月,Antigravity 正式支援 Agent Skills——這是這門課最重要的新功能。

Rules(規則)

  • 每次對話都會讀
  • 適合放「人格」「語氣」
  • 例:請用繁中、別寫廢話

Skills(技能)

  • 只有「相關時」才載入
  • 適合放「專業流程」
  • 例:怎麼接 Stripe、怎麼寫 SEO meta

Skill 的檔案結構(背起來)

my-project/
├── .agent/
│   └── skills/
│       └── deploy-to-vercel/      ← 技能名稱(資料夾)
│           ├── SKILL.md           ← 必須大寫!
│           ├── reference.md       ← 補充資料(可選)
│           └── scripts/           ← 腳本(可選)
└── ...其他專案檔案

兩種放法

類型位置適合放什麼
Workspace 專案範圍專案/.agent/skills/這個專案才用得到的,例如部署腳本、自家框架慣例
Global 全域~/.gemini/antigravity/skills/每個專案都會用到的,例如 JSON 美化、SEO 檢查

SKILL.md 的標準格式

由兩塊組成:上面是 YAML frontmatter(給 AI 路由用),下面是 Markdown 內容(技能本體)。

---
name: postgres-query
description: 執行唯讀 SQL 查詢到本機 PostgreSQL 資料庫,
             支援 SELECT 跟 EXPLAIN,禁止 INSERT/UPDATE/DELETE
---

# 目標
讓使用者用自然語言查 Postgres 資料。

## 步驟
1. 解析使用者意圖
2. 產生對應的 SELECT 語句
3. 執行 `psql -c` 並回傳結果

## 範例
使用者:「列出最近 10 個下單的客人」
產出:`SELECT * FROM orders ORDER BY created_at DESC LIMIT 10;`

## 限制
- 不要執行 DELETE / DROP / TRUNCATE
- 結果超過 100 列要分頁
關鍵:description 寫得好,技能才會被觸發

AI 一開始只看到 description,覺得相關才會把整份 SKILL.md 載入。所以「資料庫工具」這種模糊描述沒用,要寫成「執行唯讀 SQL 查詢到本機 PostgreSQL 資料庫」這種具體句子。

課堂彩蛋

Skills 採用的是跨工具的開放標準Claude Code 跟 Antigravity 用同一份格式。你寫好的 SKILL.md 兩邊都能用,可以用 ln -s 做軟連結共用。

CHAPTER 10

Vibe Coding 實戰流程

「Vibe Coding」的核心概念是——跟著感覺走,把想法描述出來,讓 AI 幫你把它變成程式。在 Antigravity 裡,標準流程是這樣的:

挑技術棧

新手推薦的「零成本三件組」:React(前端)+ Google Apps Script(後端)+ Google Sheets(資料庫)。不用買主機、不用綁信用卡。

用 Planning 模式描述需求

切到 Planning 模式,把「做什麼、給誰用、長什麼樣、有哪些頁面、欄位有什麼」一次講清楚。AI 會生出一份任務清單給你看,你 review 後才開始寫。

分階段確認

不要一次讓 AI 寫完所有功能。每完成一塊就跑跑看、檢查截圖(Artifacts),有錯馬上講。

把學到的規則寫進 AGENTS.md / Rules

每次發現「這個 AI 老是寫錯」、「我們專案有特殊規定」,寫成規則存起來。下次它就不會再犯。

部署上線

用 GitHub Pages 免費發布。第 12 章會講。

CHAPTER 11

提示詞心法(範本)

提示詞最重要的觀念:不要照抄別人的提示詞,要從你自己的真實需求長出來。複製貼上學不到東西。但有個結構可以套,先照這個四段式練習:

四段式提示詞範本

# 1. 角色設定(告訴 AI 它是誰)
你是一位資深的 React 前端工程師與遊戲設計師。

# 2. UI / UX 需求(長什麼樣、用什麼框架)
- 框架:React Vite
- 風格:Pixel Art 像素風
- 圖片:用 DiceBear API 預載 100 張素材
- 每關有像素風「關主」圖片

# 3. 功能需求(操作流程)
1. 首頁讓使用者輸入 ID 開始遊戲
2. 透過 Apps Script 從 Google Sheets「題目」工作表
   隨機抓 N 題(不含解答)
3. 答完傳結果到 Apps Script 計算,記錄到 Sheets

# 4. 資料結構(Sheets 欄位 / .env 變數)
題目表欄位:題號 / 題目 / A / B / C / D / 解答
回答表欄位:ID / 闖關次數 / 總分 / 最高分 /
            第一次通關分數 / 花了幾次通關 / 最近遊玩時間

.env:
- GOOGLE_APP_SCRIPT_URL:後端網址
- PASS_THRESHOLD:通過門檻
- QUESTION_COUNT:每次題數
為什麼這樣寫管用

這四段把「AI 是誰、長相、功能、資料」全攤開——AI 不用猜,就能寫出符合期待的程式。沒寫的部分 AI 會自己亂編,所以越精確越好。

CHAPTER 12

部署到 GitHub Pages(免費)

寫好程式不發布,等於沒寫。GitHub Pages 是學生最容易的免費方案。流程如下:

部署前的準備

請 AI 幫你建立這幾個檔案:

.gitignore — 不要上傳的東西

node_modules/   # 套件資料夾,幾百 MB
dist/           # 自動產生的編譯檔
*.log           # 日誌
*.tmp           # 暫存檔
.env            # ← 最重要!裡面有密碼,絕對不能上傳

.env.example — 給別人看的範例

GOOGLE_APP_SCRIPT_URL=你的後端網址
PASS_THRESHOLD=6
QUESTION_COUNT=10

不寫真實的值,只寫變數名跟說明,讓別人 clone 你的專案時知道要設什麼。

.github/workflows/deploy.yml — 自動部署

跟 AI 說「請幫我寫一份 GitHub Actions,自動部署到 GitHub Pages,並更新 README.md」即可。

實際發布流程

左側 Source Control → Initialize Repository

把專案變成 Git 倉庫。

Commit(記錄變更)

AI 會自動幫你寫 commit 訊息,確認後按 commit。

Push(推上 GitHub)

第一次推會問你 repo 名稱,記得選「Public」。

GitHub → Actions 看部署狀態

綠勾勾=成功;紅叉叉=失敗,把錯誤訊息複製貼回 Antigravity 給 AI 修。

環境變數設定

GitHub → Settings → Secrets and variables → Actions:Secrets 放密碼類,Variables 放普通變數。設完後到 Actions 重跑一次 deploy。

CHAPTER 13

給學生的提醒

最危險的時代

過去 AI 寫錯程式,程式跑不動,你就知道它錯了。現在的 AI 會寫出「看起來能動、但邏輯藏錯」的程式。沒有前後端基礎知識,你永遠不知道它把你的密碼明文存進資料庫。

最後一句話

不管是程式語言還是工具,本質都是為了解決問題。AI 是一個好幫手,但他並非萬能——保持自己的判斷力與行動力,工具會換、思維才是你的。