yourname.vercel.app 到底哪裡有問題？

當你把千辛萬苦寫好的網站，成功透過 Vercel 部署上線後，Vercel 會非常貼心地送你一個免費的網址。這個網址通常長得像這樣： my-awesome-startup-7v8x9a.vercel.app

如果你只是在做學校作業，或是自己寫好玩的個人履歷，這個免費網址已經非常棒了。 但是，如果你是在「做生意」或「接案」，這就是一場災難。

想像一下，你開了一家高級的精品咖啡店，結果你的招牌上寫著「台北市信義區-大衛租車公司免費提供之停車場角落-精品咖啡」。 這就是 .vercel.app 給人的感覺！ 當客戶在你的名片或 IG 上看到這個網址時，他們的第一個念頭是：「這家公司連買個自己網址的幾百塊錢都省，他賣的東西有保障嗎？會不會是詐騙？」

在商業世界裡，「專屬網域名稱 (Custom Domain)」 就是你的門面、你的招牌、你品牌的靈魂。 例如：apple.com、vibetutor.com、yourbrand.tw。

買一個網址其實非常便宜，通常一年只要 300 到 1000 元台幣。這絕對是你在創業或接案路上，最划算的一筆投資。今天，我們就來教你如何把免費的 Vercel 網址，換成你霸氣的專屬網域！

---

第一步：去哪裡買網址？(Domain Registrar)

網址就像是網路上的門牌號碼，你不能隨便拿，必須去「戶政事務所」登記購買。在網路上，這些戶政事務所被稱為 網域註冊商 (Domain Registrar)。

目前全球最大、最推薦的註冊商有：

1. Namecheap：工程師的最愛，介面乾淨、價格非常便宜（如其名），而且免費附送隱私保護（不會讓別人查到你的真實姓名跟地址）。
2. GoDaddy：全球最大，有中文介面與中文客服。但第一年很便宜，第二年續約通常會變貴，而且結帳時會一直推銷你買用不到的東西。
3. Cloudflare：近年來的高階玩家首選，他們承諾「永遠只收成本價，不賺你一毛錢差價」。

👉 實戰建議：請前往 Namecheap 註冊一個帳號，並搜尋你想要的網址名稱。只要沒被人買走，刷個信用卡，這個網址接下來一年就是你的財產了！

---

第二步：在 Vercel 綁定你的新網址

買好網址後，我們要來告訴 Vercel：「欸！從今天開始，只要有人輸入這個新網址，你就把我的網站顯示給他看。」

1. 登入你的 Vercel 後台，點進你的專案。
2. 點擊上方的 Settings (設定)。
3. 在左側選單選擇 Domains (網域)。
4. 在中間的輸入框，輸入你剛買的網址（例如：myawesomecoffee.com），然後點擊 Add (新增)。

這時候，Vercel 會出現一個紅色的警告標誌：Invalid Configuration (無效的設定)。 不要緊張！這是非常正常的。 因為 Vercel 只單方面認識你的網址，但你的「網域註冊商 (例如 Namecheap)」還不知道 Vercel 是誰。 這就像是你單方面宣布你跟周杰倫結婚了，但周杰倫根本不認識你。我們現在要做的，就是去註冊商那裡「簽結婚證書」。

---

第三步：設定 DNS (網域名稱系統) 的終極魔法

Vercel 畫面上的紅色警告下方，會給你一組「密碼」，這組密碼在技術上稱為 DNS 紀錄 (DNS Records)。 它通常長這樣：

• Type: A
• Name: @
• Value: 76.76.21.21

這串數字 76.76.21.21 就是 Vercel 伺服器的真實 IP 地址。我們現在要把這串地址，寫進 Namecheap 的設定裡。

實際操作 (以 Namecheap 為例)：

1. 登入你的 Namecheap 帳號。
2. 找到你剛買的網域，點擊旁邊的 Manage (管理)。
3. 切換到 Advanced DNS (進階 DNS 設定) 標籤頁。
4. 找到 Host Records 區塊。這裡可能會有一些預設的垃圾紀錄，請把它們全部刪掉 (點垃圾桶)。
5. 點擊 Add New Record (新增紀錄)。
6. 照著剛剛 Vercel 給你的指示填寫：
   • 類型選 A Record
   • Host 填 @ (代表主網域本身)
   • Value 填入 76.76.21.21
   • TTL 保持預設即可。
7. （可選）如果你希望別人輸入 www.myawesomecoffee.com 也能連到，請再新增一個紀錄：
   • 類型選 CNAME Record
   • Host 填 www
   • Value 填入 cname.vercel-dns.com

設定完成後，按下綠色小勾勾儲存！

---

第四步：等待魔法生效 (DNS Propagation)

當你在 Namecheap 按下儲存的那一瞬間，這個「結婚宣言」會開始透過海底電纜，傳送到全世界幾十萬台網路伺服器上。這個廣播的過程，稱為 DNS 擴散 (DNS Propagation)。

有時候這只需要 10 秒鐘，有時候可能需要 24 小時。 請回到你的 Vercel 畫面。當你發現原本紅色的 Invalid Configuration 警告，突然變成了一顆 綠色的勾勾 (Valid Configuration) 時。

恭喜你！大功告成！

拿起你的手機，在瀏覽器輸入你那充滿霸氣的專屬網址。看著自己親手用 Vibe Coding 寫出來的網頁，完美地呈現在自己的品牌網域下。 而且，Vercel 還會自動免費幫你加上一把鎖頭（SSL/HTTPS 加密證書），讓你的網頁被 Google 視為安全的頂級網站。

這就是網頁工程師專屬的浪漫。從今天起，你不再是一個只能在電腦上跑 localhost 的新手，你正式成為了掌管網路世界一方領土的領主！

在最後一章中，我們將探討工程師日常中最怕遇到、但也最常遇到的噩夢：Git 衝突 (Merge Conflict)，並教你如何用 AI 的力量，從 CI/CD 的車禍現場中安全脫身！