手把手教你用Vibe Coding打造個人網站 | AfterWork Startup AI 斜槓週報

Apr 07, 2026 10:01 am

親愛的《斜槓週報》朋友,你好嗎👋


歡迎來到新一期的斜槓週報!2026年一眨眼來到四月了,最近的AI圈真的超多新聞。我們直入主題,分享我們認為目前最值得注意的重點大事!



📝 電子報重點速覽

  • 🚀 深度AI教學手把手教你Vibe Coding,不懂程式碼也能「說」出一個網站!
  • 📰 AI圈大小事一人獨角獸神話成真|Claude原始碼外洩彩蛋|用AI打造第二大腦
  • 🎓 本週精選資源:《AI電商實戰全攻略》與 Google官方Gemini提示詞指南
  • 🎬 AI實戰教學影片:用AI挑選爆款商品 + 低成本打造自動化跨境電商




🚀 深度AI教學:什麼是Vibe Coding?不懂程式碼也能「說」出一個網站!

如果你覺得「寫程式」是一件遙不可及、只有工程師看著黑畫面敲鍵盤才能做的事,那麼最近紅遍國外科技圈的 Vibe Coding(直覺程式設計),將徹底顛覆你的想像!


image


🤔 到底什麼是 Vibe Coding?


簡單來說,Vibe Coding 就是「用自然語言來開發軟體」。


想像一下,你身邊坐著一位頂級的工程師加上一位王牌設計師。這時候的你,不需要懂Python或是複雜的架構,只需要負責「出嘴巴」,告訴他們你想要的「感覺(Vibe)」、網站的「長相」和「功能」,然後他們就能幫你把前端、後端甚至設計通通搞定!


而現在一個工具,就擁有了頂級的工程師和王牌設計師的能力。因此,我們正在從「學習如何寫程式」,進入到「學習如何跟AI溝通」的全新時代。


💡 Vibe Coding 適合誰?


  • 不懂程式碼的創業新手:想做一個網站、或最小可行產品(MVP)來測試市場,卻不想花大錢外包。
  • 打造個人品牌的接案者:需要快速建立高質感的個人介紹、作品集、或履歷網站。
  • 一人企業開發者:用AI快速建立產品,測試市場需求



🛠️ 手把手實戰教學:用 v0 打造你的個人履歷網站

聽起來很神奇對吧?我們現在就來實作!這次我們要使用的,是由知名科技公司Vercel推出的前端生成工具 v0.dev


請跟著以下步驟,不用5分鐘,你的個人網站就就能上線!


第一步:免費註冊帳戶

  • 進入 v0.dev,免費註冊登入。


image


第二步:輸入你的「Vibe 咒語」

  • 在對話框中,直接複製貼上以下這段框架提示詞(請記得把括號內的文字換成你自己的資訊):


---Vibe 咒語從這裡開始---


「我是一位 [你的職業,例如:AI數位行銷專家],請幫我建立一個個人作品集與線上履歷網站。整體風格要現代、極簡且具備專業感。 網站結構需包含:

  1. 首頁英雄區:大標題介紹我自己,下方加上連結到我的LinkedIn和Instagram的社群按鈕。[加入Linkedin 連結] [加入instagram連結]
  2. 專業技能 (Skills):用進度條或漂亮的圖示列出我的核心技能(例如:專案管理、SEO、AI工具應用)。[加入你的技能]
  3. 工作經歷 (Work Experience):以時間軸的方式呈現我過往的工作經驗與成就。[加入你的工作經歷]
  4. 聯絡方式:加入我的電郵作為聯絡方法[加入電郵]


---Vibe 咒語從這裡結束---

image


第三步:選擇模型(推薦選擇 v0 Pro)


image


第四步:點擊「Enhance Prompt」強化咒語

image

第五步:點擊生成

image


...... v0就會幫你自動生成網站!


image



最後一步:一鍵發布


點擊右上方的「Share / Publish」,v0 會直接給你一串專屬網址。你可以輕鬆把這個網址直接貼在IG或是履歷上,完全不需要買網域、租主機!


後續你還可以直接在下方對話框,用聊天的口吻修改網站,例如:「請把主色調改成深藍色」、「請在經歷區塊加上我的大頭照」等。


是不是很簡單?比起傳統的履歷表,這樣簡單地建立一頁式的網站分享自己的能力,看起來更有美感、更讓人有記憶點對吧 😉 而且這個網站我只花了0.5美金,並僅花了5分鐘就做好了!


立即建立你的個人網站




📰 本週AI圈大小事

1)一人獨角獸神話成真!創辦人靠AI,將2萬美元實驗項目,打造營收預估達18億美元的電商帝國


image


跟隨《紐約時報》報導,新創公司 Medvi(一個專門在網路上銷售GLP-1減重藥物,並將醫生、處方和物流外包給遠距醫療平台),只有一個人去營運:創辦人Gallagher 利用 ChatGPT、Claude 和 Grok 來寫程式,用 Midjourney 和 Runway 製作廣告素材,並透過 ElevenLabs 和自訂的 AI Agent 處理客戶服務。


整個營運架構只花了2個月+2萬美元就建立起來,而第一年就帶來了4.01億美元的營收!


OpenAI 執行長Sam Altman曾預言:「如果沒有AI,一人十億美元公司是難以想像的,但現在這將會發生。」這個案例並不是什麼革命性的AI軟體產品,而是在客廳賣減重藥!這證明了只要有強大的執行力與商業直覺,結合AI工具能創造出極其驚人的成果。


2)Anthropic Claude Code 原始碼意外公開,驚見多個未發布彩蛋


image


Anthropic 意外將其AI寫程式工具 Claude Code 的原始碼洩漏到公開的資料庫,曝光了超過 1,900 個檔案、50 萬行程式碼、以及多個尚未發布的新功能。


雖然官方澄清這是「人為疏失,而非資安漏洞」,且沒有任何客戶資料外洩,但開發者們在裡面發現了跨會話記憶功能、深度規劃系統,以及代號為「Capybara」(被認為是已開發至 v8 版本的 Claude 4.6)。更有趣的是,裡面還藏著一個名為「BUDDY」的終端AI虛擬寵物,包含 18 種物種和「混亂值 (CHAOS)」、「嘲諷值 (SNARK)」等屬性。


對於一向以「安全」自居的 Anthropic 來說,一週內發生兩次洩漏是個大新聞。不過洩露的主要是命令列工具介面(CLI)而非模型權重,因此對其聲譽的影響大於實際的競爭威脅,但也確實在網路上引發了熱烈討論。


3)AI專家如何用AI ?專家分享如何利用AI打造你的「第二大腦」


知名AI專家、前 Tesla AI總監 Andrej Karpathy,近期分享了他對於利用AI建立 Second Brain(第二大腦)的見解。他深入探討了如何透過AI工具,去提升團隊與個人的產出,並有效管理知識與資訊流。


👉 閱讀 X 上的完整分享




🎓 本週精選資源

1. 《AI電商實戰全攻略》

  • 如果你對打造個人電商副業感興趣(就像我們在「本週AI圈大小事」看到的那位很厲害的創辦人一樣,開始自己的電商事業!),千萬別錯過我們整理的實戰攻略。這份攻略絕對能幫助你梳理思路,輕鬆邁出建立電商事業的第一步。


👉 免費獲取攻略


2. Google官方出品:Gemini 提示詞指南(2024十月版)

  • 想把AI用得更理想,提示詞(Prompt)是其中一個關鍵。這是一份由Google官方釋出的高質量指南,教你如何精準對Gemini下達指令,極大地提升你在工作和學習上的產出效率。


👉 免費下載PDF指南




🎬 AI實戰教學影片

最後跟你分享一下,本週我們在 YouTube 頻道上傳的全新實戰教學影片!


  • 常常煩惱不知道該賣什麼嗎?這支影片會教你 如何運用AI幫你挑選具有爆款潛力的電商商品:👉 觀看影片


  • 如果你想學習如何利用AI打造零庫存、低成本的電商副業(Print-on-demand 模式),請一定要看我們這支大受好評的基礎教學影片!在影片中,我們詳細拆解了 如何運用AI做市場調查、找出熱門主題,實現自動化跨境電商。👉 觀看影片




從一人創造18億美元營收的神話,再到Vibe Coding讓寫網頁變得像聊天一樣簡單,我們看到的是,這個時代賦予了我們前所未有的槓桿。


希望你看完這期的斜槓週報,會更加的感受到AI的魅力和樂趣。歡迎你一起行動起來,嘗試用 v0 創造個人網站,又或是跟著影片和攻略踏出電商的第一步。行動永遠是最好的開始!


♥︎ 如果你喜歡這期的內容,請回信給我們一個「+1」,表示你想繼續看以後的分享,這也是對我們最直接的小鼓勵喔! 我們下期電子報再見~


Morning & Tiffany

@AfterWork Startup

與你一起斜槓創業,開拓多元收入

Comments