Vibe Coding 網(wǎng)站部署的保姆級(jí)教程。寫一篇怎么部署 Vibe Coding 產(chǎn)品的保姆級(jí)教程包括服務(wù)器、域名等等。緣起是上周我寫過一篇文章推薦大家自建一個(gè)個(gè)人博客。我覺得 AI 時(shí)代博客可以承載自己的思考以及作品還可以讓 Agent 更容易發(fā)現(xiàn)我們。文章發(fā)出來后很多人問我怎么把本地做好的博客部署到公網(wǎng)讓其他人訪問。我知道非技術(shù)的用戶肯定還是覺得這事門檻太高畢竟過去購(gòu)買服務(wù)器、配置域名、部署代碼基本都是專業(yè)程序員才會(huì)做的事情。普通人看到服務(wù)器、數(shù)據(jù)庫(kù)、域名解析這些詞可能已經(jīng)準(zhǔn)備放棄了。但現(xiàn)在有 AI 的幫助這件事情已經(jīng)簡(jiǎn)單了很多?？赡艽丝虒?duì)于大部分人來說最大的障礙仍然還是畏難心理。所以在正式開始之前大家可以試著告訴自己一定能搞定。搞不懂的就問 AI或者直接讓 AI 干沒啥難的。而且我們也不必先學(xué)會(huì)一大堆技術(shù)概念才有資格開始。實(shí)際上只需要理解大致的邏輯具體操作完全可以交給 Codex 這樣的 Agent。今天我就把自己走過的流程寫下來講一下我是怎么把一個(gè)本地的 Vibe Coding 產(chǎn)品真正發(fā)布到互聯(lián)網(wǎng)上的。一、部署大致的原理是什么我先試著用通俗易懂的話給大家講一下部署到底是在做什么。我們通過 Vibe Coding 做出來的產(chǎn)品剛開始都保存在自己的電腦里。我們可以在電腦上打開它可以修改它也可以正常使用。但其他人訪問不到因?yàn)榇a、圖片和數(shù)據(jù)都還在我們的電腦里。所謂部署說白了就是把這個(gè)產(chǎn)品從自己的電腦搬到一臺(tái)能夠連接互聯(lián)網(wǎng)、可以一直運(yùn)行的電腦上。這臺(tái)電腦就是服務(wù)器。你可以把服務(wù)器理解成一臺(tái)放在機(jī)房里的電腦。它通常全年開機(jī)并且接入了互聯(lián)網(wǎng)。我們把產(chǎn)品的代碼放到服務(wù)器上再把程序運(yùn)行起來別人就可以通過網(wǎng)絡(luò)訪問。其實(shí)我們自己的電腦也可以運(yùn)行一個(gè)網(wǎng)站。比如在本地開發(fā)產(chǎn)品時(shí)我們經(jīng)常會(huì)通過localhost或者127.0.0.1打開頁(yè)面。這兩個(gè)地址指向的都是我們自己的電腦。但它們只能在本機(jī)訪問。你把這個(gè)地址發(fā)給別人對(duì)方打開的其實(shí)是他自己的電腦自然看不到你的產(chǎn)品。所以要讓所有人都能訪問第一步就是把產(chǎn)品放到一臺(tái)可以公開訪問的服務(wù)器上。產(chǎn)品放到服務(wù)器以后服務(wù)器會(huì)有一個(gè)自己的網(wǎng)絡(luò)地址也就是 IP 地址。IP 地址通常是一串?dāng)?shù)字。理論上別人只要輸入這串?dāng)?shù)字就可以找到你的服務(wù)器。但這就像一家店開在某條街的某個(gè)具體位置。你當(dāng)然可以把經(jīng)緯度發(fā)給朋友讓他按照坐標(biāo)找過來但這樣太麻煩了基本沒人記得住。這就是域名的意義。比如一個(gè)網(wǎng)站的 IP 地址可能是一串很長(zhǎng)的數(shù)字但它的域名可以是xiaogai.com。大家只需要記住這個(gè)名字不需要記住服務(wù)器具體在哪里。有了域名以后還需要配置域名解析。因?yàn)橘I下域名只相當(dāng)于給店鋪起了一個(gè)名字還沒有告訴別人這家店究竟開在哪里。域名解析做的事情就是把域名和服務(wù)器的地址對(duì)應(yīng)起來。你可以把它理解成在地圖上登記一家店這家店叫xiaogai.com它的具體地址是這臺(tái)服務(wù)器。以后有人在瀏覽器里輸入這個(gè)域名互聯(lián)網(wǎng)就會(huì)先查詢一下找到域名對(duì)應(yīng)的服務(wù)器再把網(wǎng)站內(nèi)容送到他的電腦或者手機(jī)上。這樣域名和服務(wù)器就連接起來了。一家店有了名字和地址以后還需要讓顧客確認(rèn)自己找到的確實(shí)是這家店沒有被別人冒充。這就涉及 HTTPS。我們現(xiàn)在訪問的大部分網(wǎng)站網(wǎng)址都是以https://開頭的。HTTPS 主要解決兩個(gè)問題。第一通過證書驗(yàn)證網(wǎng)站身份降低用戶訪問到假網(wǎng)站的風(fēng)險(xiǎn)。第二對(duì)瀏覽器和服務(wù)器之間傳輸?shù)膬?nèi)容進(jìn)行加密。比如用戶輸入的密碼、填寫的表單即使在傳輸過程中被人截獲對(duì)方也很難直接看懂里面的內(nèi)容。要支持 HTTPS網(wǎng)站還需要配置一張 SSL 證書。這張證書可以理解成網(wǎng)站的電子身份證。瀏覽器會(huì)通過它確認(rèn)網(wǎng)站的身份然后和服務(wù)器建立一條加密連接。所以整個(gè)部署過程可以理解成開一家店。服務(wù)器是店鋪所在的具體位置域名是店名域名解析是在地圖上登記店鋪地址SSL 證書是店鋪的電子身份證HTTPS 則負(fù)責(zé)建立一條安全的訪問通道。把這幾件事情連起來一個(gè)網(wǎng)站才能真正被其他人安全、穩(wěn)定地訪問。二、這件事情需要花多少錢理解了部署的原理以后我們?cè)賮砜匆幌沦M(fèi)用。我自己的博客一年全部算下來大概是 260 多塊。這里面主要是域名和 CloudBase 的費(fèi)用備案本身不收費(fèi)SSL 證書也有免費(fèi)的版本。我用到的服務(wù)很簡(jiǎn)單域名是在阿里云萬(wàn)網(wǎng)購(gòu)買的網(wǎng)站部署在騰訊云 CloudBase備案和 SSL 證書也都是在騰訊云完成的。我的域名使用了一個(gè)比較小眾的后綴第一年只有十幾塊錢。不過域名通常第一年比較便宜后面續(xù)費(fèi)價(jià)格可能會(huì)漲。如果確定這個(gè)域名會(huì)長(zhǎng)期使用也可以一次多買幾年。CloudBase 是成本的大頭。我自己的博客已經(jīng)有了一些訪問量所以購(gòu)買了個(gè)人版套餐一年兩百多塊。不過CloudBase 也提供免費(fèi)額度每個(gè)月會(huì)送 3000 點(diǎn)資源。對(duì)于剛剛上線的個(gè)人博客或者小產(chǎn)品我覺得一開始大概率已經(jīng)夠用了?？梢韵扔妹赓M(fèi)版本把產(chǎn)品跑起來等訪問量增加或者資源不夠了再考慮付費(fèi)。SSL 證書也有免費(fèi)版本可以直接申請(qǐng)。備案同樣不收費(fèi)只是需要按照平臺(tái)的要求提交資料等待審核。所以部署一個(gè) Vibe Coding 產(chǎn)品其實(shí)沒有想象中貴。如果只是想先體驗(yàn)一下可能只需要花十幾塊錢買一個(gè)域名因?yàn)?CloudBase 提供了免費(fèi)的體驗(yàn)額度。三、域名的購(gòu)買和備案接下來我們逐步的走流程。剛才說過我自己的域名是在阿里云萬(wàn)網(wǎng)購(gòu)買的。騰訊云和 Godaddy 等等其他平臺(tái)也可以購(gòu)買操作都差不多。因?yàn)槲乙恢绷?xí)慣在阿里云管理域名所以這次還是用了萬(wàn)網(wǎng)。https://wanwang.aliyun.com/打開域名購(gòu)買頁(yè)面以后輸入自己想要的名字看看有沒有被別人注冊(cè)。我的域名是 xiaogai.fun我很喜歡 fun 這個(gè)后綴因?yàn)槲矣X得很多事就是 just for fun。所以域名這塊你可以先搜索一下自己想使用的域名看看有沒有被別人注冊(cè)。如果.com已經(jīng)被注冊(cè)也不用太糾結(jié)?，F(xiàn)在有很多域名后綴可以選擇。個(gè)人博客最重要的是好記、容易輸入沒有必要為了一個(gè).com花很多錢。選好域名完成實(shí)名認(rèn)證和付款這一步就結(jié)束了。緊接著就是備案。為什么還要備案因?yàn)槲覀兒竺嬉巡┛筒渴鸬津v訊云位于國(guó)內(nèi)的云服務(wù)上。按照規(guī)定只要使用中國(guó)大陸的服務(wù)器對(duì)外提供網(wǎng)站服務(wù)就需要先完成 ICP 備案。備案通過以后域名才能正常指向服務(wù)器對(duì)外開放訪問。備案可以理解成給網(wǎng)站做一次實(shí)名登記。你需要告訴相關(guān)部門這個(gè)域名屬于誰(shuí)網(wǎng)站由誰(shuí)負(fù)責(zé)主要用來做什么。就像我們開一家店需要登記經(jīng)營(yíng)者和店鋪地址一樣。以后網(wǎng)站出現(xiàn)問題也能找到對(duì)應(yīng)的負(fù)責(zé)人。備案本身不收費(fèi)也不需要大家去線下跑手續(xù)。現(xiàn)在基本都可以在云服務(wù)商的備案系統(tǒng)里完成按照頁(yè)面提示填寫資料、上傳證件、完成人臉識(shí)別然后等待審核就可以了。需要注意備案通常是在服務(wù)器所在的平臺(tái)完成。我的博客準(zhǔn)備部署到騰訊云 CloudBase所以我直接選擇了騰訊云備案。如果你的網(wǎng)站部署在阿里云一般就在阿里云辦理。騰訊云的備案地址如下https://cloud.tencent.com/product/ba進(jìn)入之后點(diǎn)新增/接入服務(wù)就會(huì)跳到下面的頁(yè)面。服務(wù)類型按照自己的實(shí)際情況選擇域名就填寫剛剛購(gòu)買并完成實(shí)名認(rèn)證的域名。接下來需要選擇用于備案的云資源我的方法是選擇備案授權(quán)碼然后去某魚上再買一個(gè)授權(quán)碼就行了。十來塊錢。這一步之后按照提示一步步完成備案就可以了。備案審核的時(shí)間估計(jì)需要 20 個(gè)工作日。四、開通 CloudBase域名購(gòu)買完成以后接下來開通騰訊云 CloudBase。https://cloud.tencent.com/product/tcb如前面所說現(xiàn)在每個(gè)賬戶都有 3000 點(diǎn)的免費(fèi)資源。所以大家可以先不用付費(fèi)。進(jìn)入騰訊云控制臺(tái)找到云開發(fā) CloudBase創(chuàng)建一個(gè)云開發(fā)環(huán)境。數(shù)據(jù)庫(kù)的話選擇默認(rèn)的云數(shù)據(jù)庫(kù)就行。創(chuàng)建好之后我們?cè)僭?Codex 中安裝 CloudBase 的 CLI。這個(gè) CLI 非常好用也是我選擇 CloudBase 的核心原因。因?yàn)橛辛?CLI 之后我們就不需要再打開 CloudBase 的服務(wù)端理解那些復(fù)雜的配置了直接讓 Codex 幫我們直接干就行。安裝 CloudBase 的 CLI 也非常簡(jiǎn)單。把下面截圖右側(cè)的提示詞發(fā)給 Codex?；蛘咧苯影严旅娴拈_發(fā)文檔發(fā)給 Codex讓它安裝 CLI。反正這一步不需要我們自己動(dòng)手AI 已經(jīng)完全可以搞定了。無論是 Codex還是 TRAE、WorkBuddy 等等產(chǎn)品。https://docs.cloudbase.net/CLI 安裝好以后還需要完成一次授權(quán)把本機(jī)的 CLI 和剛剛開通的 CloudBase 環(huán)境連接起來。大家跟著 Codex 的節(jié)奏來就行。你可以把授權(quán)這一步理解成允許本地的 Codex 操作我們的騰訊云賬號(hào)。等授權(quán)徹底完成以后Codex 就可以通過 CLI把電腦里的項(xiàng)目上傳到 CloudBase并完成后面的部署。從這里開始大部分操作就可以直接交給 Codex 了。五、完成產(chǎn)品的部署前面的準(zhǔn)備工作完成以后接下來就可以正式部署了。其實(shí)到這一步已經(jīng)變得非常簡(jiǎn)單。先在 Codex 里打開我們本地的項(xiàng)目然后直接告訴它用 CLI 把項(xiàng)目部署到 CloudBase像我下面截圖這樣。提示詞大家不一定非要照著截圖里來只要意思到位就行。接下來Codex 會(huì)先檢查整個(gè)項(xiàng)目看看它使用了哪些技術(shù)需要部署哪些內(nèi)容。如果只是一個(gè)靜態(tài)網(wǎng)站它可能會(huì)直接把頁(yè)面文件上傳到 CloudBase。如果項(xiàng)目里還有登錄、文章發(fā)布、圖片上傳、數(shù)據(jù)庫(kù)等功能它也會(huì)繼續(xù)檢查后端服務(wù)、數(shù)據(jù)庫(kù)和文件存儲(chǔ)應(yīng)該怎么配置。這里我們不需要提前把這些概念全部弄明白。遇到問題就繼續(xù)讓 Codex 處理。比如它可能會(huì)告訴你目前還沒有找到可以使用的 CloudBase 環(huán)境或者缺少某項(xiàng)服務(wù)。你可以直接回復(fù)你能不能直接幫我創(chuàng)建和配置如果需要我登錄或者授權(quán)再提醒我。你看下面截圖這些事我都是讓 Codex 來干的。我只負(fù)責(zé)掃碼登錄就行。還有阿里云中的域名配置也類似。全部交給 Codex。其實(shí)走到這里整個(gè)部署過程基本就完成了。回頭看一下在這一部分Codex 主要幫我們完成了三件事情。首先是把本地的代碼部署到 CloudBase。如果只是靜態(tài)頁(yè)面它會(huì)直接把頁(yè)面上傳到云端。如果產(chǎn)品需要登錄、發(fā)布文章或者保存數(shù)據(jù)它還會(huì)幫我們創(chuàng)建數(shù)據(jù)庫(kù)、配置后端服務(wù)。需要上傳和保存圖片的話它也會(huì)繼續(xù)配置云存儲(chǔ)。第二件事情是把我們購(gòu)買的域名和 CloudBase 連接起來。域名可能是在阿里云購(gòu)買的產(chǎn)品卻部署在騰訊云。Codex 會(huì)幫我們配置域名解析告訴互聯(lián)網(wǎng)這個(gè)域名對(duì)應(yīng)的是 CloudBase 上的這個(gè)產(chǎn)品。最后是申請(qǐng)和配置 HTTPS 證書。證書配置完成以后我們的網(wǎng)站就可以通過https://正常訪問瀏覽器和服務(wù)器之間傳輸?shù)臄?shù)據(jù)也會(huì)經(jīng)過加密。所以整個(gè)過程說到底就是把代碼放到云端把域名指向它再給網(wǎng)站配置好 HTTPS。這三件事情都可以直接交給 Codex。我們需要做的主要是在涉及賬號(hào)登錄、掃碼和授權(quán)的時(shí)候配合一下。中間遇到任何問題也不用自己硬著頭皮查資料。直接把報(bào)錯(cuò)和當(dāng)前頁(yè)面交給 Codex讓它繼續(xù)檢查和解決就可以了。其實(shí)這也是我為什么推薦大家建立個(gè)人博客的原因。AI 時(shí)代個(gè)人博客不只是一個(gè)寫文章的地方它也是我們思考、作品和個(gè)人身份的一個(gè)長(zhǎng)期載體。最后歡迎大家看看我的個(gè)人博客https://xiaogai.fun/這里給大家精心整理了一份全面的AI大模型學(xué)習(xí)資源包括AI大模型全套學(xué)習(xí)路線圖從入門到實(shí)戰(zhàn)、精品AI大模型學(xué)習(xí)書籍手冊(cè)、視頻教程、實(shí)戰(zhàn)學(xué)習(xí)、面試題等資料免費(fèi)分享掃碼免費(fèi)領(lǐng)取全部?jī)?nèi)容1. 成長(zhǎng)路線圖學(xué)習(xí)規(guī)劃要學(xué)習(xí)一門新的技術(shù)作為新手一定要先學(xué)習(xí)成長(zhǎng)路線圖方向不對(duì)努力白費(fèi)。這里我們?yōu)樾率趾拖胍M(jìn)一步提升的專業(yè)人士準(zhǔn)備了一份詳細(xì)的學(xué)習(xí)成長(zhǎng)路線圖和規(guī)劃?？梢哉f是最科學(xué)最系統(tǒng)的學(xué)習(xí)成長(zhǎng)路線。2. 大模型經(jīng)典PDF書籍書籍和學(xué)習(xí)文檔資料是學(xué)習(xí)大模型過程中必不可少的我們精選了一系列深入探討大模型技術(shù)的書籍和學(xué)習(xí)文檔它們由領(lǐng)域內(nèi)的頂尖專家撰寫內(nèi)容全面、深入、詳盡為你學(xué)習(xí)大模型提供堅(jiān)實(shí)的理論基礎(chǔ)。書籍含電子版PDF3. 大模型視頻教程對(duì)于很多自學(xué)或者沒有基礎(chǔ)的同學(xué)來說書籍這些純文字類的學(xué)習(xí)教材會(huì)覺得比較晦澀難以理解因此我們提供了豐富的大模型視頻教程以動(dòng)態(tài)、形象的方式展示技術(shù)概念幫助你更快、更輕松地掌握核心知識(shí)。4. 2026行業(yè)報(bào)告行業(yè)分析主要包括對(duì)不同行業(yè)的現(xiàn)狀、趨勢(shì)、問題、機(jī)會(huì)等進(jìn)行系統(tǒng)地調(diào)研和評(píng)估以了解哪些行業(yè)更適合引入大模型的技術(shù)和應(yīng)用以及在哪些方面可以發(fā)揮大模型的優(yōu)勢(shì)。5. 大模型項(xiàng)目實(shí)戰(zhàn)學(xué)以致用當(dāng)你的理論知識(shí)積累到一定程度就需要通過項(xiàng)目實(shí)戰(zhàn)在實(shí)際操作中檢驗(yàn)和鞏固你所學(xué)到的知識(shí)同時(shí)為你找工作和職業(yè)發(fā)展打下堅(jiān)實(shí)的基礎(chǔ)。6. 大模型面試題面試不僅是技術(shù)的較量更需要充分的準(zhǔn)備。在你已經(jīng)掌握了大模型技術(shù)之后就需要開始準(zhǔn)備面試我們將提供精心整理的大模型面試題庫(kù)涵蓋當(dāng)前面試中可能遇到的各種技術(shù)問題讓你在面試中游刃有余。7. 資料領(lǐng)取全套內(nèi)容免費(fèi)抱走學(xué) AI 不用再找第二份不管你是 0 基礎(chǔ)想入門 AI 大模型還是有基礎(chǔ)想沖刺大廠、了解行業(yè)趨勢(shì)這份資料都能滿足你現(xiàn)在只需按照提示操作就能免費(fèi)領(lǐng)取掃碼免費(fèi)領(lǐng)取全部?jī)?nèi)容