用 AI 學寫 Python：從零到架起自己的網站

給誰看：完全沒有寫過程式的人（尤其是金融、期貨背景的朋友） 你需要的：一台能上網的電腦、好奇心，以及「不怕犯錯」的心態 最終目標：能在 AI 協助下，獨立做出一個屬於自己的網站

這份講義怎麼用？

這是一份互動式講義：你不只是「讀」，還能直接動手把程式跑起來。下面這一格就是一塊真的能跑的「程式碼」——四個氣泡先帶你認識它，然後就直接在格子裡改、按 Run Code 跑跑看 👇

1

最左邊的 Python Code：這一整格就是一塊程式碼，能寫、也能跑。

2

它右邊的 Start Over：改壞了想重來，一鍵還原成最初的樣子。

3

藍色的 Run Code：按下去就執行，結果印在下面。

4

中間這塊是程式碼本體，整段都能自由打字修改。

⏳ 第一次按 Run Code 會先下載 Python 環境（約幾秒～十幾秒），之後就很快。改亂了不用怕，按 Start Over 就回到原狀。

有看到下面跳出一行字嗎？恭喜，你已經「執行」了人生第一支程式 🎉

換你改改看：把雙引號裡的 我成功執行了第一格程式！ 改成「你好」加上你自己的名字（例如 print("你好，我是王小明")），再按一次 Run Code，看看印出來的字是不是跟著變了。

不確定怎麼改？這正是 AI 派上用場的時候——把這格程式碼複製給你的 AI 助理，問它：「我想讓它印出『你好，我是王小明』，這段要怎麼改？」照它說的改，再按 Run Code 跑跑看。

這份講義的地圖

章節 內容 你會得到什麼
第 1 章 心態與框架 搞懂「人」和「AI」在寫程式時各自負責什麼
第 2 章 認識工具箱 知道有哪些 AI 工具、該怎麼選
第 3 章 第一支程式 動手、破除恐懼
第 4 章 程式的核心零件 看得懂程式在做什麼（核心邏輯）
第 5 章 跟 AI 一起寫程式的正確姿勢 學會「會問」這個關鍵能力
第 6 章 實戰小專案 把零件組成一個小工具
第 7 章 邁向自己的網站 從程式到「上線的網站」完整路徑
第 8 章 學習路線圖 接下來 90 天怎麼走
補充章節 為什麼用 venv、架好 VS Code ＋ 用 uv 管理專案（進階） 在自己電腦上把開發環境準備好，與可重現的依賴管理
附錄 提示詞範本 可直接複製貼上使用

第 1 章：先建立正確的心態（這章最重要）

很多人以為「學寫程式 = 把一堆指令背起來」。錯。

在 AI 時代，真正的關鍵能力不是「記得語法」，而是：

把一個模糊的想法，拆解成清楚、明確、一步一步的步驟。

電腦（和 AI）非常聽話，但也非常笨——它只會「照你說的做」，不會「照你想的做」。所以你想得越清楚、講得越精確，結果就越好。

1.0 為什麼是「現在」？——一段 AI 極簡史

你可能會問：「程式又不是新東西，為什麼現在特別適合像我這樣的非工程師來學？」 答案藏在最近幾年 AI 的一連串突破裡。用最白話的方式講一遍：

  • 2017 年｜一切的起點：Google 八位研究員發表一篇論文《Attention Is All You Need》，提出了一個叫 Transformer 的全新架構。它的關鍵是「注意力機制」——讓模型在讀一句話時，能自己判斷「哪幾個字最該被注意」。 > 🧠 生活比喻：你讀「台指期今天大漲」這句話，腦袋會自動把重點放在「台指期」和「大漲」，而不是平均地看每個字。Transformer 就是讓電腦學會這種「抓重點」的能力。

    這個架構還有兩個威力：能大量平行運算（訓練得更快），而且越大越強（資料和模型越大、表現越好，業界叫 scaling）。後面幾乎所有的 AI，都是從這裡長出來的。

  • 2018–2020 年｜越養越大：OpenAI 接力推出 GPT-1、GPT-2、GPT-3，一代比一代大、一代比一代會「接話」。不過這時還主要是研究圈在玩。

  • 2022 年 11 月｜AI 走進每個人家裡：ChatGPT 上線。第一次，一般人不用會任何程式，只要「用講的」就能叫 AI 幫忙寫文章、查資料、甚至寫程式。短短兩個月就突破上億用戶。

  • 2023 年至今｜AI 變成「寫程式的夥伴」：寫程式專用的 AI 助手陸續出現（GitHub Copilot、Claude、Cursor 等），它們能讀懂你的需求、直接幫你寫出程式、還能幫你抓錯。到了 2025–2026 年，「不必是工程師，也能做出能用的軟體」已經是現實。

把這段歷史接回你身上：正因為有了這些工具，一個期貨營業員，今天才有辦法自己架出一個交易小工具網站。 你要學的不是「贏過 AI」，而是「會指揮 AI、看得懂它、能驗證它」——這正是接下來這份講義要帶你練的事。

年份 事件 對你的意義
2017 Transformer 架構問世（《Attention Is All You Need》） 現代 AI 的地基
2018–2020 GPT-1 → GPT-3 接力 AI 越來越會「理解與生成文字」
2022/11 ChatGPT 上線 一般人開始能「用講的」叫 AI 做事
2023–至今 AI 寫程式助手普及 你不必先成為工程師，也能開始動手做東西

1.1 AI 時代的分工：你是「指揮」，AI 是「打字員」

角色 負責什麼
你（人） 想清楚「我要什麼」、把需求講明白、驗證結果對不對
AI 把你的需求，翻譯成電腦看得懂的程式碼

這代表一件很重要的事：你不需要會「從零默寫程式」，但你必須看得懂程式大概在做什麼，並且能判斷對錯。

這就是為什麼第 4 章我們還是要學基本邏輯——不是為了考試，而是為了能驗證 AI 給你的東西。盲目相信 AI，就像盲目相信營業員的明牌一樣危險。

1.2 核心循環：寫程式其實是一個圈圈

不管專案大小，跟 AI 寫程式都是在重複這個循環：

flowchart TD
    A["① 想清楚我要什麼"] --> B["② 用清楚的話請 AI 寫程式"]
    B --> C["③ 執行看看"]
    C --> D{"④ 看結果<br/>對了嗎？"}
    D -- 對 --> E["✅ 完成！"]
    D -- "不對／有錯誤<br/>把狀況回報給 AI" --> A

新手最常見的誤會：以為一次就要成功。 不會的。連專業工程師都是靠這個循環，跑個三五次甚至十幾次才完成。「跑不出來」是過程，不是失敗。

1.3 三個讓你走得長遠的心法

  1. 錯誤訊息是朋友，不是敵人。 紅色的錯誤訊息不是在罵你，它是在「告訴你哪裡卡住」。等一下你會學到：把它整段複製貼給 AI，它通常就能幫你解。
  2. 一次只做一小步。 不要一開口就要 AI「幫我做一個交易系統」。要拆小：先能印出一個數字，再能算損益，再能畫圖，再變網頁……
  3. 看不懂就問「為什麼」。 AI 不只會寫程式，也會當你的家教。隨時可以追問：「這行 for 是什麼意思？用生活例子解釋給完全不懂的人聽。」

第 2 章：認識你的工具箱

開始之前，先搞懂幾個名詞。我用白話解釋，你不用背。

2.1 Python 是什麼？

Python 是一種程式語言——也就是「人和電腦溝通的語言」之一。

它之所以最適合新手，原因有三：

  • 長得最像英文，最好讀；
  • 用途超廣：資料分析、畫圖、自動化、做網站、串接 AI……都行；
  • 資源最多：你遇到的問題，網路上幾乎都有答案，AI 也最熟它。

對金融背景的人來說，Python 還有個額外好處：它是量化分析、抓股價、跑回測最主流的語言。

2.2 Jupyter Notebook 是什麼？

Jupyter Notebook 是一種「邊寫程式、邊看結果、邊寫筆記」三合一的工具，特別適合學習和做資料分析。

你正在讀的這份講義，就是用同樣的精神做的——邊讀、邊改、邊跑。差別只在於：這裡的程式直接跑在你的瀏覽器裡（用一種叫 Pyodide 的技術），所以你連 Jupyter 都不用先裝，就能馬上動手。等到第 7 章要做網站、需要在自己電腦上長期開發時，才會用到「真正裝在本機的 Jupyter / 環境」（補充章節會說明）。

2.3 AI 寫程式工具，主要分兩類

類型 它長怎樣 代表工具 適合誰
對話型 像聊天視窗，你問它答 ChatGPT、Claude、Gemini 新手起手式：最直覺，複製貼上就能用
整合到編輯器型 直接住在你的程式編輯器裡，能讀你的整個專案、自己改檔案 Cursor、GitHub Copilot、Claude Code 等 上手後想加速、做比較大的專案

給 0 基礎的建議路線： 先用「對話型 AI」+ 這份互動講義，把基本邏輯摸熟（第 3～6 章）。 等你大概知道程式長怎樣、跑起來是什麼感覺了，再升級到「編輯器整合型」工具去做網站（第 7 章）。

一開始就用太強的自動化工具，反而會因為「看不懂它在幹嘛」而失去判斷力。先學會走，再學會跑。

🛠️ 這些「編輯器整合型」工具大多住在 VS Code 裡。等你要用它們、或要做第 7 章的網站，補充章節 C〈架好你的本機編輯器（VS Code）〉 會帶你把開發環境一次準備好。

2.4 我要在哪裡跑 Python？兩條路

你有兩條路可以選，差別在「要不要安裝」：

路線 A：線上環境（推薦新手，零安裝） 打開瀏覽器就能用，不用在電腦上裝任何東西。這份講義本身就是路線 A——每一格程式都直接在你的瀏覽器裡跑。類似的線上環境還有：

  • JupyterLite：把「Jupyter」直接搬進瀏覽器。靠一種叫 WebAssembly 的技術，Python 整個跑在你的瀏覽器分頁裡，連伺服器都不需要（這份講義用的 Pyodide 也是同一類技術）。
  • Google Colab：免費，背後是 Google 借你一台雲端機器。

想簡單驗證邏輯：用線上路線（路線 A）就好；要部署自己的程式：裝在自己電腦上（路線 B）。

⚠️ 線上環境有兩個限制要先知道：

  • 存檔不會自動留著：純瀏覽器環境（像這份講義或 JupyterLite），關掉分頁後你改過的程式碼不會自動保存，重要的東西記得自己複製下來。
  • 不能拿來「架網站」：線上環境跑不了需要長時間開著的伺服器（例如第 7 章的 Streamlit）。所以——

路線 B：裝在自己電腦上（之後做網站必走） 等你要做第 7 章的網站、或想長期開發，就得把 Python 裝到自己電腦上。 這條路會多一個關鍵步驟：建立「虛擬環境 (venv)」——簡單說就是「幫每個專案準備一個獨立、乾淨的工具箱，彼此不打架，也不弄髒整台電腦」。 為什麼要這樣做，我整理在補充章節 A〈為什麼要用 venv〉；怎麼做則直接寫在第 7 章「在本機把它跑起來」的步驟裡（做網站時自然會用到）。

第 3 章：第一支程式——不要怕

我們從最簡單的指令開始：print()。它的作用是「把括號裡的東西印出來」。

下面每一格都改改看、按 Run Code 跑跑看。

引號 " " 裡面的，是文字（程式裡叫「字串」）。你可以放任何字。

下面這格沒有引號，放的是數字，可以直接算數學：

注意到 # 假設小台指... 這段了嗎？

# 後面的文字叫註解：它不會被執行，純粹是寫給「人」看的備註。 養成寫註解的習慣，未來的你會感謝現在的你。

3.1 換你試試

把下面這格改成「大台指漲 80 點，每點 200 元」的算式，然後按 Run Code：

如果你按了 Run Code 出現一堆紅字——太好了，這是你第一次看到「錯誤訊息」。 那是因為 ? 不是合法的數字。把它改成數字（例如 80 * 200）再跑一次就好。 記住第 1 章說的：錯誤是過程，不是失敗。

第 4 章：程式的核心零件（核心邏輯）

幾乎所有程式，都是用這幾個零件組合出來的。把這章看懂，你就「看得懂」99% 的程式在做什麼了——這正是你驗證 AI 的本錢。

我會用期貨損益計算的情境貫穿，讓你邊學邊有感覺。

⚠️ 提醒：以下數字（每點價值、保證金等）都是舉例方便理解，不是真實商品規格，實際請以交易所公告為準。

4.1 變數：幫資料取一個名字

「變數」就是幫一個值取名字，方便之後重複使用、修改。 用 = 來「把右邊的值，存進左邊的名字」。

Python 連中文變數名都能用，但業界習慣用英文（例如 contracts、point_value）。 初學階段為了好懂，我們先用中文；之後寫真正的專案再換英文。

改了某個變數的值，後面用到它的地方就會跟著變——這就是「變數」好用的地方。

4.2 資料型態：資料有不同「種類」

電腦會區分資料的種類，常見的有：

型態 英文 例子 用途
整數 int 2、18000 算數量、點數
小數 float 3.14、0.05 算比率、價格
文字 str "多單"、"台指期" 任何文字
真/假 bool True、False 判斷對錯
清單 list [18000, 18050, 18120] 一串資料
字典 dict {"商品": "小台", "口數": 2} 有標籤的資料

下面這格用 type() 看看每個東西是什麼型態：

清單(list) 和 字典(dict) 特別重要，因為真實資料常常一大串。先看清單：

🔑 新手最常踩的雷：程式世界裡，數數字從 0 開始。 所以「第一個」是 [0]，「第二個」是 [1]，以此類推。一開始不習慣很正常。

4.3 運算與比較

除了加減乘除，最常用的是比較，結果會是 True(真) 或 False(假)：

🔑 超級重要：

  • 一個等號 = 是「指定/存入」（把值存進變數）
  • 兩個等號 == 是「相等嗎？」（問問題，得到 True/False）

搞混這兩個，是新手第一名常見錯誤。

4.4 條件判斷 if / elif / else：讓程式「會做選擇」

這是程式有「智慧」的開始：符合某條件，就做某件事。 這跟你做交易決策的邏輯一模一樣：「如果跌破停損，就出場。」

注意兩個關鍵格式（Python 很在意這個）： 1. 條件那行結尾要有 冒號 : 2. 下一行要 往內縮排（通常按一下 Tab 或 4 個空格）。縮排代表「這是 if 底下要做的事」。

換你試試：把上面的 現價 改成 18600、18200、17900，分別跑跑看，觀察印出的訊息怎麼變。這就是「條件判斷」的威力。

4.5 迴圈 for：讓程式「重複做」

當你要對「一整串資料」逐筆處理時，就用迴圈。 例如：把每天的收盤價，逐筆印出來。

這段的意思是：「對於 每日收盤 裡的每一個值（暫時叫它 收盤），就執行縮排內的動作。」

迴圈真正強大的地方，是搭配「累加」。下面算這幾天每天相對前一天的損益總和（簡化示意）：

這格出現了一個好用的新東西：f"..."（叫做 f-string）。 只要在引號前加個 f，就能在文字裡用 { } 直接塞變數，超方便。

看不懂 range(1, len(...))？沒關係。這正是你練習問 AI 的好時機： 複製這格程式，問 AI：「請用完全不懂程式的方式，一行一行解釋這段在做什麼，特別是 range 那行。」

4.6 函式 (function)：把一段邏輯「包起來」重複用

如果「算損益」這件事你要做很多次，每次都重抄一遍很煩。 函式就是把一段邏輯打包、取個名字，之後一行就能呼叫。

  • def = 我要「定義(define)」一個函式
  • 括號裡的 進場, 出場, ... 叫參數：是「呼叫時要餵給它的資料」
  • return = 把結果交回去，讓外面可以接住、印出來

函式是「程式積木」。等一下做網站，整個網站其實就是一堆函式組起來的。

4.7 物件 (object)：把「資料」和「它會的動作」綁在一起

到目前為止，「資料」（變數、清單）和「動作」（函式）是分開的。 但你其實早就在用一種把兩者綁在一起的東西了，只是還沒人幫它取名字——它叫 物件 (object)。

一句話記住： > 物件 = 一包資料 ＋ 這包資料自己會的動作。

還記得這些寫法嗎？你一直在用：

看到中間那個 .（點） 了嗎？它的意思就是：「叫這個物件，做它自己會的某個動作」。

  • 每日收盤.append(...)：叫「這個清單」去執行「在尾巴加一筆」。
  • "tx".upper()：叫「這串文字」去執行「全部變大寫」。

這些「物件自己會的動作」，有個專有名詞叫 方法 (method)——說穿了就是「綁在某個物件身上的函式」。 物件身上帶的資料，則叫 屬性 (attribute)。

🔑 為什麼要懂這個？因為等你做網站時，幾乎每一行都長這樣：st.title(...)、df.head()、data.sort_values(...)…… 全都是「某個物件 . 它會的動作」。看懂這個句型，你就看得懂一大半的真實程式碼了。

（選讀）那這些「物件」是怎麼來的？——class

你不需要會自己建立物件，但看一眼它長怎樣，以後就不會怕。 class（類別）就是「物件的設計圖」：先畫好一張「交易」的設計圖，之後就能照圖做出一個又一個交易物件。

🟡 看不懂 class / self / __init__ 完全沒關係，現階段可以先跳過。 你只要記得「物件 = 資料 + 它會的動作，用 . 去叫它」就夠用了。真要自己寫 class 時，再請 AI 一行一行帶你。

4.8（進階）一次分清楚：function、object、decorator

這三個詞很容易混。用「一句話 + 一個詞性比喻」各自記住：

名稱 一句話 詞性比喻 例子
函式 function 一個「動作」，你餵資料、它回結果 動詞（做一件事） 計算損益(...)、print(...)
物件 object 一個「東西」，自帶資料和自己的函式（方法） 名詞（一個帶能力的東西） 一個清單、一筆「交易」
裝飾器 decorator 一個「外掛包裝」，不改原函式，就幫它加上額外行為 外衣（替動作加料） @st.cache_data

前兩個你已經懂了，重點講第三個——裝飾器。它在真實世界的程式裡（特別是網站框架）很常見，你遲早會遇到，所以先帶你認識。

它要解決什麼問題？ 假設你有很多函式，想幫每一個都加上「執行前先印一行記錄」的功能。 笨方法是每個函式裡都貼一段重複的程式碼。裝飾器讓你寫一次、到處套，而且完全不用改原本的函式。

寫法就是在函式上面加一行 @某個裝飾器：

跑跑看：你只是呼叫 計算損益(...)，卻自動多印了「開始執行 / 執行完畢」兩行——這就是裝飾器替函式「加料」的效果，而 計算損益 本身一個字都沒改。

@加上記錄 這一行的意思就是：「把 計算損益 這個函式，用 加上記錄 包裝一下再用」。

🔌 真實場景：@st.cache_data 到底幫你省了什麼？

第 7 章會帶你用 Streamlit 做一個小網站。它有一個很關鍵的特性：使用者只要在網頁上動一下（改個下拉選單、拉一下滑桿），Streamlit 就會把你整段程式從頭到尾「重跑一遍」。

這會出問題。假設你的網站一開頭要「去抓今天的期貨報價」，而這件事很慢（要連網路，可能要等 3 秒）：

import streamlit as st
import time

def 讀今天的報價():
    time.sleep(3)              # 假裝去網路抓資料，慢慢的…
    return {"台指期": 18120, "小台": 18118}

報價 = 讀今天的報價()           # 使用者每點一下，這行就重跑 → 又卡 3 秒 😩

使用者每按一次就卡 3 秒，體驗很差。

解法：在這個函式頭上，戴一頂 @st.cache_data 的帽子。

import streamlit as st
import time

@st.cache_data                 # ← 裝飾器：幫這個函式「把結果記起來」
def 讀今天的報價():
    time.sleep(3)
    return {"台指期": 18120, "小台": 18118}

報價 = 讀今天的報價()           # 第一次：真的去抓，等 3 秒
報價 = 讀今天的報價()           # 第二次以後：直接拿上次記住的結果，0 秒！⚡

差別在哪裡？

  • 沒加 → 每次重跑都重新抓一次資料，每次都乖乖等 3 秒。
  • 加了 → 第一次抓完就「記住」，之後只要參數一樣，就直接回傳記住的答案，完全不重算。

打個比方：你問同事「今天台指開盤多少？」第一次他得去查（慢）；但你五分鐘內再問一次，他直接憑記憶回答你（快），不會每次都重查。@st.cache_data 就是幫你的函式裝上這顆「記憶」。

你完全不需要自己寫這個裝飾器，Streamlit 已經幫你做好了。你只要會兩件事： 1. 看到 @ 開頭那一行，知道它是在「替下面的函式加料」； 2. 遇到「網站抓資料好慢」時，想起可以在那個函式上面加一行 @st.cache_data。

🟡 這節是進階補充，看不懂可以先跳過。第 7 章那個損益計算機很單純，其實用不到 @st.cache_data——這裡只是先讓你認識它。等你之後做的網站需要「抓資料、又不想每次重抓」時，再回來看這個例子，會特別有感。

第 4 章小結

你已經認識了程式的核心零件：變數、資料型態、運算與比較、條件判斷、迴圈、函式， 再加上把「資料 ＋ 動作」綁在一起的 物件，以及（進階）替函式加料的 裝飾器。 這就是 90% 程式的骨架。你不需要「背」它們，只要看得懂、改得動，就足以跟 AI 合作了。👍

第 5 章：跟 AI 一起寫程式的「正確姿勢」

這章是整份講義的精華。會不會寫程式不是重點，會不會「請 AI 寫」才是你真正的競爭力。

5.1 好提問的公式

一個好的請求，包含五個元素（不用每次都全寫，但越完整結果越好）：

元素 說明 範例
① 角色/情境 告訴 AI 你是誰、懂多少 「我完全不懂程式，請當我是新手」
② 背景 為什麼要做這個 「我想做一個計算期貨損益的小工具」
③ 明確需求 具體要它做什麼 「寫一個 Python 函式，輸入進出場點數算損益」
④ 輸入/輸出範例 給例子最有效 「例如輸入 18000 進、18120 出、1 口、每點 50，要回傳 6000」
⑤ 限制/格式 額外要求 「請加上中文註解，並用最簡單的寫法」

5.2 對比：爛提問 vs 好提問

❌ 爛提問： > 「幫我寫個算錢的程式」

（AI 只能亂猜：算什麼錢？什麼商品？輸入什麼？結果是垃圾進、垃圾出。）

✅ 好提問： > 「我完全不懂程式，請當我是新手。我想要一個 Python 函式，功能是計算期貨單筆交易損益。 > 輸入：進場點數、出場點數、口數、每點價值。輸出：損益金額。 > 例如進場 18000、出場 18120、1 口、每點 50 元，應該回傳 6000。 > 請用最簡單的寫法，每行都加上中文註解。」

差別就是：你把『想清楚』這件事做完了，AI 只剩『打字』。 這呼應第 1 章的分工。

5.3 把大問題「拆小」

新手最大的陷阱，是一開口就要：「幫我做一個自動交易系統。」

這註定失敗，因為連你自己都還沒想清楚。正確做法是像剝洋蔥一樣一層一層：

做一個「我的交易記錄網站」
   ├─ 1. 先能用 Python 算出單筆損益          ← 第 4、6 章
   ├─ 2. 再能算「一整串交易」的總損益與勝率
   ├─ 3. 再把結果畫成一張圖
   ├─ 4. 再把它變成一個網頁畫面               ← 第 7 章
   └─ 5. 最後讓它能上線、別人也看得到

每一步都跑得起來、確認對了，再進下一步。這就是專業工程師的工作方式。

5.4 看不懂 AI 的程式？這樣追問

AI 給你一段程式，你看不懂是正常的。你的工作不是「默寫得出來」，而是「看得懂大概在幹嘛、能驗證對錯」。追問範本：

  • 「請逐行解釋這段程式，假設我完全不懂程式。」
  • 「這段程式如果輸入 X，會輸出什麼？為什麼？」
  • 「這段有沒有什麼情況會出錯或算錯？」

5.5 除錯三步驟（跑出紅字時照做）

程式跑出一堆紅色錯誤訊息時，不要慌、不要關掉。照這三步：

  1. 整段複製那串錯誤訊息（連同你的程式）。
  2. 貼給 AI，並說明你「本來想做什麼」。
  3. 範本：「我執行這段程式時出現以下錯誤，我本來想做的是 ___。請告訴我錯在哪、怎麼修，並解釋為什麼會錯。」

90% 的新手錯誤，AI 三十秒內就能幫你解決。錯誤訊息不是敵人，是線索。

5.6 練習：故意製造一個錯誤，再學會讀它

跑下面這格——它故意寫錯了（少了一個引號）。按 Run Code，看看錯誤訊息長怎樣：

看到類似 SyntaxError 的字了嗎？這就是「語法錯誤」。

現在做一次真實的除錯流程：把上面那格的程式 + 錯誤訊息複製起來，貼給你慣用的 AI，問：「這段為什麼錯？怎麼修？」 然後把它教你的正確版本貼回下面這格、按 Run Code 跑跑看：

第 6 章：實戰小專案——把零件組起來

現在把第 4 章的核心零件，組成一個期貨交易記錄分析器。 這就是「拆小、逐步累加」的實際示範。先跑跑看完整版，再看下面的拆解。

看懂了嗎？這個小工具其實只用到你已經學過的東西： 變數、字典/清單、函式、迴圈、條件判斷、f-string。 沒有任何新魔法。

換你練習（用 AI）：請你慣用的 AI 幫你擴充這個工具，加上「最大單筆獲利」和「最大單筆虧損」的統計。 記得用第 5 章的好提問公式：貼上這段程式，說清楚你要加什麼、希望保留中文註解。 拿到結果後，貼到下面跑跑看，並請 AI 逐行解釋它新增的部分。

第 7 章：邁向「自己的網站」

這是你的最終目標。好消息是：你前面學的東西，已經足以做出一個網站了。

7.1 先搞懂「網站」是什麼組成的

別被嚇到，網站其實就三部分：

部分 白話比喻 是什麼
前端 餐廳的「外場、菜單、裝潢」 使用者看到、點按的畫面
後端 廚房 處理資料、做運算的程式（你的 Python 就在這）
伺服器 餐廳這棟「建築物」 一台 24 小時開著、讓大家連得到的電腦

傳統做網站要學前端三件套（HTML / CSS / JavaScript）+ 後端，門檻不低。 但對 0 基礎、又想快點看到成果的人，有一條捷徑👇

7.2 新手最快的捷徑：Streamlit

Streamlit 是一個工具，讓你只用 Python（你已經在學的）就能做出一個互動式網頁，不用碰 HTML/CSS/JavaScript。

它對金融人尤其友善：天生擅長「顯示數據、畫圖表、加滑桿讓人互動」——拿來做一個「損益計算機網頁」「個人交易儀表板」再適合不過。

下面是一個最小可運行的網站程式。注意：這段不能在這個網頁裡按 Run 跑（它要架一個一直開著的伺服器，瀏覽器環境做不到），它是要存成檔案、在你自己電腦上執行的（步驟在 7.3）。先讀懂它——你會發現裡面全是你學過的東西：

# 檔名：app.py
# 這是一個「期貨損益計算機」網站，全部用 Python 寫成

import streamlit as st   # 引入 Streamlit 工具

st.title("📈 我的期貨損益計算機")   # 網頁大標題

# 下面這幾行會自動變成網頁上的「輸入框」和「滑桿」
進場 = st.number_input("進場點數", value=18000)
出場 = st.number_input("出場點數", value=18120)
口數 = st.number_input("口數", value=1, step=1)
每點價值 = st.selectbox("每點價值（元）", [50, 200])   # 50=小台, 200=大台

# 這就是你第 4 章學的函式！
def 計算損益(進場, 出場, 口數, 每點價值):
    return (出場 - 進場) * 口數 * 每點價值

損益 = 計算損益(進場, 出場, 口數, 每點價值)

# 把結果顯示在網頁上
st.metric("這筆交易損益", f"{損益:+,.0f} 元")

if 損益 > 0:
    st.success("這是一筆獲利交易 🎉")
elif 損益 < 0:
    st.error("這是一筆虧損交易，檢討一下進出場 🧐")
else:
    st.info("不賺不賠（不計手續費）")

看到了嗎？整個網站的「大腦」，就是你第 4 章學的那個 計算損益 函式。 Streamlit 只是幫你把「輸入框、按鈕、顯示結果」這些畫面自動生出來而已。

7.3 第一步：先在自己電腦上把它跑起來（順便學會用 venv）

部署上線之前，一定要先確認程式在自己電腦上跑得動。這一步會用到 venv（虛擬環境）——讓 Streamlit 這個套件只裝進「這個專案的獨立工具箱」，不會弄髒你整台電腦的 Python。

⚠️ 以下指令是在終端機 / 命令提示字元裡輸入的，不是貼到網頁的程式格。每一步卡住，就照第 5 章的方式問 AI，記得講清楚你是 Windows 還是 Mac。

第 1 步：安裝 Python 還沒裝就先問 AI：「我用 Windows / Mac，完全不懂程式，請一步步教我安裝 Python，並確認安裝成功。」

第 2 步：建一個專案資料夾，並在裡面建立 venv

mkdir futures-tool        # 建一個專案資料夾
cd futures-tool           # 進到裡面
python -m venv .venv      # 建立一個叫 .venv 的虛擬環境（這個專案的專屬工具箱）

第 3 步：啟動（activate）這個 venv（Windows 和 Mac 指令不一樣）

# Windows（PowerShell）
.venv\Scripts\Activate.ps1

# macOS / Linux
source .venv/bin/activate

啟動成功後，命令列前面會多出 (.venv) 字樣，代表「接下來裝的套件，都會進這個專屬工具箱」。

第 4 步：在 venv 裡安裝 Streamlit

pip install streamlit

因為你剛剛已經 activate，這個 streamlit 只會裝進 .venv，不會動到系統的 Python——這就是 venv 的重點。

第 5 步：把 7.2 的程式存成 app.py 存在 futures-tool 這個資料夾裡。

第 6 步：跑起來

streamlit run app.py

瀏覽器就會自動打開你的網站。

✅ 這一步成功（瀏覽器看得到你的計算機畫面），代表程式本身沒問題。接下來才是把它「搬到雲端」讓全世界都連得到。

🟡 為什麼非得先建 venv 不可？ 一句話：避免套件裝得到處都是、專案之間互相打架、弄髒整台電腦。完整理由在補充章節 A〈為什麼要用 venv〉——做完這步、想搞懂背後原理時再回去看。

7.4 把工具免費部署到 Streamlit Community Cloud（重點章節）

這就是把「只有你電腦看得到的網站」變成「給網址就能用」的過程。全程免費。

開始前你需要兩樣東西：

  • 一個 GitHub 帳號（免費註冊，等一下程式碼要放這）
  • 7.3 已經在本機跑起來的 app.py

步驟 1️⃣：準備兩個檔案放在同一個資料夾

檔名 作用
app.py 你的程式（已經有了）
requirements.txt 告訴雲端「我的程式需要先安裝哪些套件」

requirements.txt 是新手最常漏掉、也最常害部署失敗的一步。它的內容就是一行一個套件名稱。以 7.2 的計算機為例，只用到 Streamlit，所以裡面只要寫：

streamlit

如果你之後的程式還用到別的套件（例如畫圖的 matplotlib、處理資料的 pandas），就一行一個補上去：

streamlit
pandas
matplotlib

💡 不確定自己的程式用到哪些套件？把 app.py 貼給 AI 問：「這支程式部署到雲端時，requirements.txt 應該列哪些套件？」

步驟 2️⃣：把這個資料夾上傳到 GitHub

  • 登入 GitHub → 建立一個新的 repository（建議設成 Public 公開，新手流程最單純）。
  • 把 app.py 和 requirements.txt 上傳進去。

不會用 GitHub？GitHub 網頁可以直接把檔案拖拉上傳，不一定要學指令。卡住就問 AI：「我要把含 app.py 和 requirements.txt 的資料夾，上傳到一個新的 GitHub repo，我完全不會 Git，請給我最簡單的網頁操作做法。」

步驟 3️⃣：登入 Streamlit Community Cloud

  • 打開 share.streamlit.io
  • 選「用 GitHub 登入（Continue with GitHub）」，並授權它讀取你的 repo。

步驟 4️⃣：建立 app

  • 按「Create app / Deploy」。
  • 接著會問你要部署哪一種，選「Deploy a public app from GitHub」（從 GitHub 部署一個公開的 app）。
  • 然後填三個欄位：
    • Repository：選你剛剛建立的那個 repo
    • Branch：通常是 main（如果是用本機 git init 建的 repo，可能是 master）
    • Main file path：填 app.py

步驟 5️⃣：按下 Deploy，等幾分鐘 ⏳

雲端會自動依照 requirements.txt 安裝套件、把網站架起來。大多數 app 幾分鐘內就會上線。

步驟 6️⃣：拿到網址、分享出去 🎉

  • 部署成功後，你會得到一個像 你的名稱.streamlit.app 的網址。
  • 從 app 右上角的「Share」可以複製連結。從公開 repo 部署的 app 預設就是公開的，任何人點網址都能用。
  • 想只給特定人看？在 Share 設定裡，把對方的 email 加進 viewer 名單即可。

🔗 參考成品（照步驟做完應該長這樣） 👉 https://futures-tool-hkdu3qzmyr5ljwt58c8vza.streamlit.app/ 這就是把 7.2 那支損益計算機部署到 Streamlit Community Cloud 之後的樣子。第一次打開若顯示「app 正在睡覺」，按一下喚醒、等幾秒就會出現（這呼應 7.5 提到的免費方案限制）。

⚠️ Streamlit 的介面偶爾會改版，按鈕文字或位置可能跟上面不完全一樣。對不上時，把你看到的畫面描述給 AI，問當下的做法，不要硬卡——這正是第 5 章教的能力。

7.5 部署之後：更新、限制與「部署失敗」排查

🔄 更新網站超簡單 之後你只要修改 GitHub 上的程式碼，網站就會自動重新部署、跟著更新，完全不用再跑一次部署流程。

📦 要記得的幾個免費方案限制（前面討論過的，做給班上同學用綽綽有餘）：

  • 每個 app 有 1 GB 記憶體上限。
  • 超過 12 小時沒人使用會「睡著」，下次有人開啟時要等幾秒喚醒。
  • 同時上線人數受資源限制，適合教學示範 / 小工具規模，不適合高流量商用。
  • 教育、非營利用途若撞到資源上限，可向 Streamlit 申請免費提高額度（你這份是上課用的，符合資格）。

🐞 部署失敗時，照這個順序排查： 1. 先看雲端的 Logs（日誌）——失敗原因幾乎都寫在裡面。 2. 最常見的兇手是 requirements.txt 漏列套件。把缺的套件名補進去、存檔，它會自動重新部署。 3. 還是不行？把 Logs 整段複製，用第 5 章的除錯範本貼給 AI：「我部署 Streamlit app 失敗，以下是 logs，我本來想做的是 ___，請問錯在哪、怎麼修。」

🎯 到這裡，你就完成了「從一支 Python 程式 → 一個全世界都連得到的網站」的完整旅程。 這正是這份講義的最終目標。

7.6 想做「真正的網站」怎麼辦？

如果你之後想做的不只是工具型網頁，而是有很多頁面的正式網站，可以再往這兩個方向延伸（一樣請 AI 帶你學）：

  • Flask / FastAPI：Python 的網站框架，更有彈性，但要懂多一點前端概念。
  • 靜態網站：純展示用（像個人介紹頁），用 HTML/CSS 就好，可免費放在 GitHub Pages。

但對你現在的目標——「獨立架一個自己的網站」——Streamlit 這條路就完全夠用，而且最快有成就感。先把它做出來、部署上線，再談進階。

第 8 章：學習路線圖與心法

8.1 建議的 90 天路線

期間 目標 怎麼做
第 1～2 週 破除恐懼、摸熟基本邏輯 反覆操作這份講義第 3～6 章，每格都動手改、動手跑
第 3～4 週 學會跟 AI 協作 用第 5 章的方法，請 AI 幫你寫小工具（計算機、整理資料），刻意練習「拆小問題」
第 5～8 週 做出第一個網頁 照第 7 章把 Streamlit 損益計算機跑起來，再加功能（畫圖、多筆統計）
第 9～12 週 上線 + 做自己的題目 把網站部署上線；想一個「自己真的想用的小工具」，從零做一遍

8.2 五句心法（貼在螢幕旁邊）

  1. 你是指揮，AI 是打字員——想清楚比寫得出來更重要。
  2. 一次只做一小步——能跑起來再加下一個功能。
  3. 錯誤訊息是線索，不是責罵——整段複製貼給 AI。
  4. 看不懂就追問「為什麼」——AI 也是你的免費家教。
  5. 不要盲信 AI——你學基本邏輯，就是為了「驗證」它。

8.3 新手最常見的五個陷阱

陷阱 解法
想一步登天（一開口就要做大系統） 拆小、拆小、再拆小
一出錯就放棄 出錯是常態，把錯誤丟給 AI
盲目複製貼上、不求理解 至少要看懂「大概在幹嘛」
提問太模糊 套用 5.1 的好提問公式
只看不動手 程式是「跑出來的」，不是「讀出來的」

結語

寫到這裡，你已經掌握了：程式的基本邏輯、跟 AI 協作的方法、以及一條通往「自己網站」的明確路徑。

剩下的，就是動手。打開一個 AI 對話視窗，從「幫我把今天學的損益計算機，加一個手續費欄位」開始，跨出第一步吧。💪

補充章節 A：為什麼要用 venv（虛擬環境）

🟡 什麼時候需要這章？ 第 1～6 章在這個網頁裡直接跑程式，你完全不用裝任何東西。 但等你要做第 7 章的網站、在自己電腦上跑 Streamlit，就會在終端機輸入 python -m venv .venv 這類指令（第 7.3 步有完整操作）。這章補的是那一步背後的「為什麼」——搞懂它，你就不會把它當成「照抄的咒語」。 （想要更專業、可重現的進階做法，看下一章〈用 uv 管理專案〉。venv 是「理解原理的基礎版」，uv 是「全自動的升級版」。）

補A-1：問題——所有專案共用一套工具，遲早打架

想像每個專案都是一個工作檯。如果所有專案共用同一盒工具，遲早會出現「A 專案要舊版扳手、B 專案要新版扳手」互相打架的慘況。

在 Python 世界，這個「扳手」就是套件：A 專案需要 pandas 1.x、B 專案需要 pandas 2.x，硬裝在一起就會互相覆蓋、壞給你看。

更糟的是，如果你每次都直接把套件 pip install 到「整台電腦共用的那個 Python」，裝久了那盒工具會又亂又髒：幾十個專案的套件全混在一起，哪個是哪個專案要的根本分不清，哪天升級其中一個，就可能連環弄壞別的。

補A-2：解法——一個專案，一個乾淨的工具箱

venv 就是「幫每個專案準備一個獨立、乾淨的工具箱」：這個專案裝了什麼套件、什麼版本，都關在自己的小箱子（一個叫 .venv 的資料夾）裡，不會污染別的專案，也不會弄髒整台電腦。

🛒 一句話：一個專案，一個 venv。 這是 Python 開發最基本的好習慣。

所以第 7.3 步那串指令，其實就是這個概念的實作：

  • python -m venv .venv → 開一個全新的空工具箱
  • activate → 宣告「我接下來要用這個箱子」
  • pip install streamlit → 把 Streamlit 這支工具，只放進這個箱子

搞懂這三行在幹嘛，你就不是在背咒語，而是真的知道自己在做什麼了。

補A-3：兩個一定要記得的小習慣

  • 不要把 .venv 上傳 GitHub：它又大又是本機專屬。要在 .gitignore 裡忽略它。之後要在別台電腦 / 雲端重現環境，靠的是套件清單（第 7.4 的 requirements.txt），不是整個 .venv 資料夾。
  • 下次要再用：重開終端機後，記得先 cd 到專案資料夾、再 activate 一次 venv，才會用到正確的工具箱；用完在終端機輸入 deactivate 就能退出。

🔁 再往上一層：把這些步驟全自動化 venv 的概念搞懂後，下一章的 uv 會幫你把「建 venv、裝套件、鎖版本」這些步驟全自動化，還能讓環境 100% 可重現。你會發現它其實就是這章的升級版。

補充章節 B：用 uv 管理 Python 專案與依賴（進階）

🟡 這章是進階內容，初學者可以先跳過。 建議先照第 7 章用 requirements.txt 把網站做出來、部署上線、有成就感了，再回來看這章。 這章適合：已經走完主線、想用更專業、可重現的方式管理環境的人（尤其是想用 uv 工作流部署 Streamlit 的人）。

📚 想要更完整、能實際動手練的版本？ 本章是 uv 的精華濃縮版，目的是讓你快速建立概念、並接上第 7 章的 Streamlit 部署。 如果你想徹底搞懂、而且動手練到熟，可以搭配這份完整的 uv 課程——理論 60 分鐘 ＋ 練習 60 分鐘，含 7 個附「預期輸出」可自我驗證的練習，還涵蓋團隊協作情境模擬、uvx 一次性工具、pip 相容模式等：

👉 https://benjamin-teng.github.io/uv-course/

建議讀法：先讀本章建立概念 → 想深入時，到上面那份課程從頭動手做一遍。

補B-1：uv 是什麼？為什麼值得學

uv 是一個用 Rust 寫成、速度非常快的 Python「全能管家」。它把過去要好幾個工具分開做的事，一個工具全包：

過去要用的工具 uv 一手包辦
pip（裝套件） ✅
venv / virtualenv（建虛擬環境） ✅
pyenv（管理 Python 版本） ✅
pip-tools / poetry（鎖定依賴版本） ✅

對你最大的價值是「可重現」：它會把整個環境鎖死，讓「在我電腦能跑、在別人電腦 / 雲端卻壞掉」這類惱人問題大幅減少。這也正是它跟 Streamlit Community Cloud 搭起來的好處——雲端能 100% 重現你本機的環境。

補B-2：核心心智模型——記住兩個檔案

整個 uv 工作流，圍繞著兩個檔案打轉。把它們的分工搞懂，其他都是細節：

檔案 誰寫的 內容 你能不能手改
pyproject.toml 你（人） 抽象、寬鬆的「需求宣告」，例如 pandas>=2.0。是真正的「來源真相」 ✅ 可以（直接改，或用 uv add）
uv.lock uv（工具自動產生與維護） 完全解析後的「鎖定結果」：每個套件（含所有間接相依）的確切版本、雜湊、適用平台 ❌ 不要手改

兩者的關係：

你寫的 pyproject.toml（我要 pandas>=2.0）
        │
        ▼  uv 去 PyPI 解析、算出所有相依套件的確切版本
        │
   產生 uv.lock（鎖定 pandas==2.2.3 + numpy==... + tzdata==... ...）

🛒 生活化比喻： pyproject.toml 像你寫的購物清單（「我要洗髮精」）。 uv.lock 像實際買回來的發票明細（某品牌、某容量、某批號，連附帶的贈品都列出來）。

uv 還會在 lock 裡記住 toml 的雜湊值，所以你一改 toml，它就知道「清單變了、發票過時了」，會自動重新解析。這就是為什麼你平常根本不用去管 uv.lock。

補B-3：你會用到的指令（在「終端機」執行，不是在網頁裡）

⚠️ 以下都是終端機 / 命令提示字元的指令，不要貼到網頁的程式格裡跑。

# 1. 安裝 uv 本身（依作業系統不同，最穩做法是問 AI：
#    「我用 Windows / Mac，請給我安裝 uv 的最新官方做法」）

# 2. 建立一個新專案（會幫你建立 pyproject.toml、.python-version、範例程式等）
uv init futures-tool
cd futures-tool

# 3. 加入套件（會自動：更新 pyproject.toml + 重算 uv.lock + 裝進虛擬環境）
uv add streamlit
uv add pandas matplotlib    # 一次加多個也行

# 4. 移除套件
uv remove matplotlib

# 5. 在專案環境裡執行程式（uv 會先自動把環境同步好，再執行）
uv run streamlit run app.py

# 6. 讓環境與鎖定檔同步（例如剛 git clone 別人的專案下來時）
uv sync

# 7. 手動重算 / 升級鎖定檔
uv lock              # 重新解析並寫入 uv.lock
uv lock --upgrade    # 在 toml 允許範圍內，把套件升到最新

幾個重點：

  • uv 會在專案資料夾裡自動建立一個 .venv（虛擬環境），你不用自己手動建、手動 activate。
  • 養成習慣用 uv run ... 來跑東西，它會確保你跑的是「這個專案鎖定的環境」，而不是電腦上隨便一個 Python。
  • .venv 資料夾不要進版控（uv init 通常已幫你寫好 .gitignore 忽略它）。

補B-4：一條龍——用 uv 從零到部署 Streamlit

把補充章節和第 7 章接起來，完整流程是：

  1. uv init futures-tool 然後 cd futures-tool
  2. uv add streamlit（依賴就交給 uv 管，不需要自己寫 requirements.txt）
  3. 把第 7.2 的程式放進專案、存成 app.py
  4. 本機測試：uv run streamlit run app.py，確認瀏覽器跑得起來
  5. 把這幾個檔案 commit 進 GitHub：
    • ✅ app.py
    • ✅ pyproject.toml
    • ✅ uv.lock ← 關鍵！這個一定要進版控
    • ❌ .venv/（不要進版控）
  6. 部署到 Streamlit Community Cloud（流程同第 7.4）。因為 repo 裡有 uv.lock，Community Cloud 會自動偵測到、用 uv 依照 lock 檔安裝，部署出來的環境就跟你本機一模一樣。

回顧第 7.4 查到的優先序：Community Cloud 認得的依賴檔中，uv.lock 排在最高優先。所以你只要把 lock 檔 commit 進去，它就會走 uv 這條路，不需要再額外準備 requirements.txt。

補B-5：那什麼時候還是用 requirements.txt？兩者怎麼互轉

還是用 requirements.txt 的情境：

  • 教學、示範、或最單純的小工具（就像主線教的，一個檔、一行 streamlit，心智負擔最低）。
  • 你要部署的平台不支援 uv、只吃 requirements.txt。

已經用 uv，但某個平台只吃 requirements.txt —— 用 uv export 從 lock 檔產生一份：

uv export --no-hashes -o requirements.txt
# （舊式寫法 uv pip compile pyproject.toml -o requirements.txt 也可以）

這樣你本機照樣享受 uv 的好處，又能丟一份相容 pip 的 requirements.txt 給那些平台。

🔑 一句話總結： 走 uv 工作流，請靠 uv.lock（優先序最高、最能重現環境）。 純 pyproject.toml 在 Community Cloud 的優先序最低，且歷史上會被當成 Poetry 格式解讀，光放它不保證走 uv path——所以重點永遠是「有沒有把 uv.lock commit 進去」。

給同學的提問範本（uv 版，可直接複製）

「我用 ___（Windows / Mac），不熟終端機。請一步步教我安裝 uv，並用 uv 建立一個 Streamlit 專案、加入 streamlit 套件、在本機把 app.py 跑起來。每一步都告訴我要輸入什麼、怎麼確認成功。」

「我的 uv 專案要部署到 Streamlit Community Cloud。請告訴我：哪些檔案要 commit 進 GitHub、哪些不該進版控，以及為什麼 uv.lock 一定要進去。」

補充章節 C：架好你的本機編輯器（VS Code）

🟡 什麼時候需要這章？ 第 1～6 章都在這個網頁裡跑，你不需要任何編輯器。 但等你要做第 7 章的網站（在自己電腦上寫 app.py、跑 Streamlit），或想用 §2.3 提到的「編輯器整合型 AI 工具」，就需要一個住在你電腦上的程式編輯器。最主流、免費、對新手最友善的就是 VS Code（Visual Studio Code）。這章帶你最快把它架好。

補C-1：為什麼是 VS Code？

  • 免費、跨平台（Windows / Mac 都有），微軟出的。
  • 最主流：教學、範例、AI 幾乎都以它為預設，遇到問題最好查。
  • extension 生態最大：缺什麼裝什麼；而且幾乎所有「編輯器整合型」AI 工具（GitHub Copilot、Claude、Cursor…）都直接住在 VS Code 裡，或以它為基礎。

一句話：先把 VS Code 裝好，後面要接 AI 工具、做網站都順。

補C-2：裝好 VS Code、打開你的專案資料夾

  1. 到官網 https://code.visualstudio.com 下載安裝（不確定步驟就問 AI：「我用 Windows / Mac，請一步步教我安裝 VS Code」）。
  2. 開啟 VS Code →「File → Open Folder」→ 選你第 7 章的專案資料夾（例如 futures-tool）。

🔗 還沒建專案資料夾 / venv？那是第 7.3 步的事（建 venv、裝 Streamlit），原理在補充章節 A〈為什麼要用 venv〉。這章只負責「把 VS Code 接到那個專案」。

補C-3：四個你會用到的 extension

安裝方式都一樣：點左側活動列的 Extensions 圖示（或按 Ctrl+Shift+X）→ 在搜尋框打名字 → 按 Install。

Extension 做什麼 要不要裝
Python（發行者 Microsoft） Python 開發的核心。裝它會自動一起裝 Pylance（智慧補全、錯誤提示）和除錯器 ✅ 必裝
Chinese (Traditional) Language Pack（Microsoft） 把 VS Code 介面變成繁體中文（見補C-5 啟用） ✅ 想要中文介面就裝
Jupyter（Microsoft） 想在 VS Code 裡開 .ipynb、跑 notebook 才需要 🟡 選配
AI 助手 讓 AI 直接住進編輯器幫你寫 見補C-6

⚠️ 搜尋 extension 時，認明發行者是 Microsoft（或你要的官方）。市集裡常有同名的山寨 / 第三方版本，別裝錯。

補C-4：選對 Python 直譯器 → 指到你的 .venv（最關鍵的一步）

這一步最多人卡：VS Code 要知道「這個專案要用哪一個 Python」。指錯了，就會出現「明明裝了套件，卻說找不到」的鬼打牆。

做法：

  1. 按 Ctrl+Shift+P 打開命令面板。
  2. 輸入並選 Python: Select Interpreter。
  3. 在清單裡選路徑含 .venv 的那一個（也就是你在第 7.3 / 補 A 為這個專案建的虛擬環境）。

選好之後，VS Code 開的終端機會自動 activate 這個 .venv，你在裡面 pip install / streamlit run 都會用到對的環境。

🔗 .venv 是什麼、怎麼建：見補充章節 A〈為什麼要用 venv〉與第 7.3。

補C-5：把介面變成繁體中文

裝好上面的 Chinese (Traditional) Language Pack 後：

  1. 按 Ctrl+Shift+P → 輸入並選 Configure Display Language。
  2. 選 中文(繁體)（語言代碼 zh-TW）。
  3. 依提示重新啟動 VS Code，介面就變中文了。

💡 通常一裝好語言包，VS Code 右下角就會跳出「要不要切換語言並重啟？」的提示，直接按它最快。

補C-6：AI 助手 extension（點名 + 定位，自己挑一個）

這就是 §2.3 說的「編輯器整合型」工具——直接住在 VS Code 裡，能讀你整個專案、邊寫邊給建議、甚至幫你改檔。常見的幾個：

工具 定位 / 特點 費用
GitHub Copilot 最主流、和 VS Code 整合最深；補全 + 對話都有 有免費方案（額度有限）＋付費
Claude Code（Anthropic 官方 extension） Agentic：能讀整個 codebase、改檔、跑指令；VS Code / 終端機 / 桌面版都有 extension 免費，需 Anthropic 方案
Continue（開源） 開源、可接多家 AI 模型、能自帶 API 金鑰 免費（自備模型 API）

⚠️ 這些工具的免費額度、方案、介面常常改版（光 2026 年就有不少變動），實際以各自官網最新公告為準——這正是第 5 章教的「對不上就問 AI / 查官方」。

🟡 給新手的建議路線（呼應 §2.3）：別急著一上來就裝 AI 助手。先用對話型 AI（ChatGPT / Claude 網頁版）＋ 這份講義把邏輯練熟；等你要做第 7 章的網站、開始在 VS Code 裡寫比較多程式時，再挑一個 AI 助手裝進來加速。

🎯 VS Code 準備好了（裝好 Python extension、選到 .venv、介面也中文化），就可以回到第 7.3，在編輯器裡寫 app.py、用終端機 streamlit run app.py 把網站跑起來。

給同學的提問範本（VS Code 版，可直接複製）

「我用 ___（Windows / Mac），剛裝好 VS Code，完全是新手。請一步步教我：①安裝 Python extension；②把介面改成繁體中文；③用 Python: Select Interpreter 選到我專案 .venv 裡的直譯器。每一步都告訴我要點哪裡、輸入什麼，並怎麼確認成功。」

附錄：可直接複製的提示詞範本

把這些貼給你慣用的 AI（ChatGPT / Claude / Gemini），把 ___ 換成你的內容。

🧱 請 AI 寫一個函式 > 我完全不懂程式，請當我是新手。我想要一個 Python 函式，功能是 。 > 輸入是 ，輸出是 。例如輸入 應該得到 ___。 > 請用最簡單的寫法，每行加上中文註解。

🔍 請 AI 解釋程式 > 請逐行解釋下面這段程式，假設我完全不懂程式，盡量用生活化的比喻： > > （貼上程式） >

🐞 請 AI 除錯 > 我執行下面這段程式時出現錯誤。我本來想做的是 ___。 > 請告訴我錯在哪、怎麼修，並解釋為什麼會錯。 > 程式： > > （貼上程式） > > 錯誤訊息： > > （貼上完整錯誤訊息） >

🪜 請 AI 幫你拆解大目標 > 我最終想做一個 ___（例如：個人交易記錄網站）。我完全是新手。 > 請幫我把這個目標，拆解成由淺到深、可以一步步完成的小步驟， > 每一步都要小到我能單獨完成並驗證。

💻 請 AI 教你安裝/設定環境 > 我的電腦是 （Windows / Mac），完全不懂程式與終端機。 > 請一步一步教我 （例如：安裝 Python / 用 venv 裝 Streamlit / 把網站部署上線）， > 每一步都說明「我該點哪裡、輸入什麼」，並告訴我怎麼確認這步成功了。

🌐 請 AI 帶你做網站 > 我想用 Python 的 Streamlit 做一個網頁，功能是 ___。 > 我是新手。請給我完整的 app.py 程式碼（加中文註解）， > 並告訴我接下來在電腦上要怎麼一步步把它跑起來。