奧微官網
Vibe Coding 從零開始 / 上線前要懂的事 / 第 18 課

VIBE CODING · 第 18 課

要讓別人也能用,
還差哪幾步?

小店預約現在只在你的電腦上跑。要讓客人用手機打開,還差五件事;這一課一件一件用比喻說清楚。

  1. PHASE 01認識 Vibe Coding 和工具
  2. PHASE 02第一次做出東西
  3. PHASE 03規劃你的產品
  4. PHASE 04做出小店預約
  5. PHASE 05上線前要懂的事
  6. PHASE 06換成你的點子
  7. PHASE 07往商用產品前進
  • 網頁
  • 後台
  • App
Docker
  • API
  • 資料庫
  • Redis
  • 測試收信匣

這一課動到:Docker、資料庫(觀念:整個工作箱搬上雲端,資料庫要備份)

你現在在這裡:第 5 階段的第二課。這一課只有觀念,不用動手;上一課把小店預約測過一遍、錄下了作品,這一課看它要讓別人也能用,還差哪幾步。

要讓別人也能用,還差哪幾步?

現在的小店預約只在你自己的電腦上跑,網址開頭是 localhost,別人連不到。要讓客人用手機打開,還差五件事:部署到雲端、網域與 HTTPS、備份、監控、更新。這一課只講每一件是什麼、為什麼需要、不做會怎樣,不教實作。

localhost:只有自己家裡的人進得來

你在瀏覽器打開的 http://localhost:3000,localhost 的意思是「這台電腦自己」。它像開在自家客廳的店:你自己走得進來,街上的客人找不到門。第 04 課看到網址開頭是 file:// 也是同樣的道理。

1. 部署到雲端:把店從客廳搬到大街上

是什麼
把整家店搬到大街上的店面。雲端主機是租來、放在機房裡、一直開著的電腦;把產品搬上去、讓它在那裡跑起來,叫做部署。第 07 課的 Docker 工作箱這時很好用:同一個工作箱搬過去,就能照原樣跑起來。
為什麼需要
你的電腦會關機、睡眠、被帶出門,客人不可能連到你的筆電。雲端主機一直開著,客人什麼時候想預約都打得開。
不做會怎樣
只有你自己看得到,客人打不開,產品做得再好也沒有人能用。

搬上雲端時,第 14 課的測試收信匣也要換掉。它只收得到自己電腦上的信,正式上線要接上真正的寄信服務,客人才收得到確認信。

2. 網域與 HTTPS:好記的招牌,加上上鎖的信封

是什麼
網域像店的招牌地址,客人記「xiaosen-salon.tw」這種名字,比記主機的一串數字容易。HTTPS 像把信裝進上鎖的信封:客人填的姓名、電話在送到主機的路上被加密,途中的人看不到內容。HTTPS 需要一張憑證,現在有免費發放的機構,例如 Let's Encrypt。Let's Encrypt 說明 ↗
為什麼需要
客人要記得住、找得到;填個人資料時也要放心。
不做會怎樣
沒有網域,客人得打一串數字;沒有 HTTPS,瀏覽器會在網址旁提醒連線不安全,客人不敢填資料。網域每年要續約,忘了續約,網址就會失效。Chrome 說明 ↗

3. 備份:預約本影印一份,放在別的地方

是什麼
第 08 課說資料庫像店裡的預約本。備份就是定期把整本預約本影印一份,放在另一個地方;店裡淹水了,影本還在。
為什麼需要
主機會故障、人會不小心刪錯、網站可能被入侵。有備份,才找得回來。備份也要定期試著還原一次,確認影本真的能用。
不做會怎樣
出事時,所有預約和客人資料一次消失,找不回來;客人明明訂了位,店裡卻查不到。

備份裡也有客人的姓名和電話,要上鎖保管。怎麼保管,第 19 課會講。

4. 監控:店裡的煙霧偵測器

是什麼
煙霧偵測器平常安安靜靜,一有煙就響。監控是定時檢查網站還打不打得開、有沒有一直出錯,異常時自動寄信或傳訊息通知你。
為什麼需要
網站可能在半夜掛掉,你不會一直盯著它。有監控,出問題的當下就知道。
不做會怎樣
要等客人抱怨才知道網站壞了;更常見的是客人打不開就默默離開,你根本不知道流失了多少預約。

5. 更新:定期保養,換掉被召回的零件

是什麼
車子要定期保養,零件被召回就要換。程式用到的套件、主機的系統,常會發現新的漏洞並推出修補,把修補裝上去就是更新。你自己想加的新功能,也是用同樣的方式換上去。
為什麼需要
漏洞公開之後,壞人也看得到。越早補上,被闖進來的機會越小。
不做會怎樣
已知的漏洞沒補,壞人照著公開的方法就闖得進來。反過來,更新前沒測就直接換上去,改壞了會先被客人發現。所以每次更新前,先在自己電腦上跑一遍第 17 課的自動測試,全部通過、存好版本再換上去。

這五件事誰來做?

設定的部分,Codex 可以陪你一項一項做;租主機、買網域要用你自己的帳號付費,帳號密碼也由你自己保管。上線前還有比技術更早要決定的事:第一版要服務誰、出了問題誰來處理。這些在〈Vibe Coding 做出 App 之後,怎麼走到真正上線?〉裡有一份上線前自查表,可以對照著看。

這門課不帶你實際部署。等做完自己的產品、真的要上線時,把這一課的五件事當成清單,一項一項處理。

成果檢查

  • 我能說出為什麼 localhost 的網址,別人連不到。
  • 我能用比喻說出部署、網域、HTTPS、備份、監控、更新各在做什麼。
  • 五件事,我每一件都能說出一個「不做會怎樣」。

三項都說得出來,就可以進下一課。說不出來的那一項,回去看它的「不做會怎樣」。

常見疑問

五件事都要做完才能上線嗎?

部署、網域和 HTTPS 是讓客人連得到、敢填資料的基本。備份、監控、更新是上線之後每天要有人顧的事,其中備份一定要在放進真實客人資料之前就準備好。

可以直接用自己的電腦當主機嗎?

技術上做得到,但電腦要一直開著、網路要對外開放,停電、搬家、出門都會讓店關門,也容易被人從外面闖進來。一般都用雲端主機。

上線要花多少錢?

看主機大小和網域名稱,各家價格不同、也常調整,這一課不列數字。想估算時,可以告訴 Codex 你預估每個月有多少客人預約,請它比較幾家雲端主機的官方價格頁。

App 也要部署嗎?

App 本身是上架到 App Store 或 Google Play,第 23 課會點到。App 接的後端和資料庫,一樣要部署到雲端,App 才拿得到資料。

練習:替小店預約寫一份上線清單

把下面這段貼給 Codex,請它依你的專案列出上線前要準備的事:

我的小店預約目前只在自己電腦上跑。請用白話幫我列一份上線前清單:部署到雲端、網域與 HTTPS、備份、監控、更新。
每一項寫三件事:要準備什麼、哪些要我本人去申請或付費、常見的做法有哪幾種。
先不要動手做任何設定,也不要修改任何檔案。

看完清單,替每一項寫一句「我打算怎麼做、誰來做」。現在寫不出來的,就記成待問的問題;第 20 課開始做自己的產品時,這份清單同樣用得上。

常見問題

部署是什麼?

部署是把在自己電腦上做好的產品,搬到一直開著、誰都連得到的雲端主機上。像把開在自家客廳的店,搬到大街上的店面,客人才走得進來。

HTTPS 是什麼?為什麼一定要有?

HTTPS 會把網頁和使用者之間傳送的資料加密,像把信裝進上鎖的信封,送信途中的人看不到內容。沒有 HTTPS,瀏覽器會提醒連線不安全,客人填的姓名、電話也可能在傳送途中被看到。

為什麼上線前就要準備備份?

主機故障、不小心刪錯、被人入侵,都可能讓資料庫裡的預約和客人資料一次消失。有定期備份,而且試過還原,才能把資料找回來;出事之後才想到備份就來不及了。

上線之後還要做什麼?

上線不是做完就放著。要有監控,網站出問題時會自動通知你;也要定期更新,把程式和主機發現的漏洞補起來。每次更新前先跑一遍自動測試,全部通過再換上去。

來源與版本

官方資料查閱日:2026-09-29。部署、網域、備份、監控與更新屬於業界共同的做法,本課只說明觀念;主機與網域的價格各家不同,以各家官方頁面為準。獨立教學,非任何雲端廠商的官方課程。