技術 【Day 11】開啟多重對話宇宙：實現多話題清單（Chat Sessions）管理

一、 前言 在前幾天的文章中，我們已經成功讓「AI 酒館」支援多角色切換，並且每個角色都有獨立的記憶。不過，隨著和調酒師 Mark 聊得越來越深入，玩家可能會同...

技術 【Day 10】前端 AI 專案的資安防護：打造安全且直覺的 API Key 設定彈窗

一、 前言 在前幾天的文章中，我們已經順利將 Google Gemini API 串接進「AI 酒館」中。然而，在 100% 前端運行的 Vite 專案裡，使用...

技術 【Day 09】打造專屬微醺氛圍：動態主題色與背景光暈渲染

一、 前言 在前幾天的文章中，我們成功為「AI 酒館」建立了多角色獨立對話記憶，讓調酒師 Mark 與吟遊詩人 Bard 擁有各自獨立的對話宇宙。然而，如果切換...

技術 【Day 08】角色平行宇宙：多 NPC 獨立對話記憶與切換架構

一、 前言 在前幾天的文章中，我們透過 localStorage 為「AI 酒館」打造了對話紀錄持久化功能。但如果所有 NPC 都共用同一串訊息紀錄，當我們從冷...

技術 【Day 07】酒館的長效記憶：利用 localStorage 實現對話紀錄持久化

一、 前言在前幾天的文章中，我們的「AI 酒館」已經變得非常生動：不僅有精美的暗色介面、雙向語音支援、Gemini AI 動態對話，還有流暢的打字機特效與自動捲...

技術 【Day 06】營造酒館沉浸感：為 AI 回應加入打字機特效與聊天室自動捲動

一、 前言 在前幾天的文章中，我們的「AI 酒館」已經成功串接了 Google Gemini API，讓調酒師 Mark 與吟遊詩人 Bard 擁有了即時對話的...

技術 【Day 04】讓 NPC 開口說話：整合 Web Speech API 實現文字轉語音 (TTS)

一、 前言在前面幾天，我們成功為「AI 酒館」打造了介面，並實現了讓玩家透過麥克風「動口不動手」的語音輸入功能。既然是沉浸式的酒館，光是聽得懂玩家說話還不夠，我...

技術 【Day 03】讓酒館聽懂你說話：嘗試整合 Web Speech API 語音轉文字 (STT) 與實戰踩坑紀錄

一、 前言在前面兩天，我們透過 Vibe Coding 快速生成了「AI 酒館」的暗色調 UI 介面，並成功在本地端順利跑起來。身為一個沉浸式的酒館，如果全程只...

技術 【Day 02】Vibe Coding 初體驗：環境搭建與 AI 酒館第一個酒吧 UI 畫面

一、 今日目標與簡介今天的目標是透過 Vibe Coding 的方式，讓 AI 自動幫忙建立 React + Vite + Tailwind CSS 專案，並產...

技術 【Day 01】用嘴巴寫出 AI 酒館：什麼是 Vibe Coding？專案目標與架構規劃

動機大家好！在接下來的 30 天裡，我將挑戰一個極具實驗性與趣味性的專案——《用嘴巴寫出 AI 酒館》。這個專案的核心理念很簡單：我希望打造一個能讓使用者透...

技術 【Day - 30】從跟著工具走，到走出自己的 SDD 流程

終於寫到第 30 天了！【Day - 1】留下的問題，現在也可以回來回答了：會跑 workflow，真的就等於懂 SDD 嗎？對當時的我來說，還差得遠。我能照著...

技術 Day 9｜User Flow 畫完還不能做：把 ClarifyBuild Usage Flow 拆成可實作的 State 與 Transition

上一篇整理完 User Flow 後，我原本預計今天接著談 User Story： 誰需要這個功能？為什麼？ 但在準備往下做 ClarifyBuild 時，...

技術 Day 10 我要讓大家逐漸變成絕地武士！不單單是虛擬的！還要推現實的！

【Day 10】我要讓大家逐漸變成絕地武士！不單單是虛擬的！還要推現實的！ ▲ 圖 1：大家比拼做最強絕地武士的 Midjourney 示意圖 當分析過...

技術 【Day7】把錯的行為，正式寫進測試裡

TL;DR Golden set v1：23 組，其中 8 組鎖的是缺陷本身——它們現在通過，代表缺陷還在 把明知是錯的結果寫進 assert，心理上很難受...

技術 [Day04] 第一個手作りAndroid App —— 照片日記！

配合分支：day04/start Repo 興沖沖的把 App 寫出來啦，強迫各位看我拍的照片！切換到對應的分支後，可以按下 Android Studio 右...

技術 從 Vibe Coding 到 Agentic Engineering：2026 年前端開發者的專業升級路徑

我這幾個月最常看到的誤解，是把 Vibe Coding 當成一種完整的方法論。好像 prompt 寫得夠順，AI 就會把專案自然推到正確方向。這套想像在 dem...

技術 從「寫程式」到「寫規格」：2026 年台灣開發者的代理開發轉型指南

2025 年，我們還在為 Vibe Coding 興奮。 2026 年，比較誠實的說法是：大家開始收拾它留下來的東西。這句話不好聽，但很多團隊應該有感。 不是說...

技術 Vibe Coding 的現實面：當「詠唱」結束後，如何真正把 AI 程式碼推上正式機？

在社群媒體上看別人展示 Vibe Coding 真的很爽。打幾個字，一個帶有酷炫動畫的儀表板就這樣噴出來了，看起來好像我們下週就能把整個團隊裁掉一半。 但只要你...

技術 怎麼延長 vibe coding 的甜蜜期，讓 AI 真正變成幫手，而不是拖油瓶？

【怎麼延長 vibe coding 的甜蜜期？】 一開始用 AI 幫忙寫系統的時候，真的很像「請了一位超強的高階工程師」。 開專案、做 CRUD、畫 UI，神速...

技術 vibe coding 的甜蜜期過了，然後呢？

最近，各種 vibe coding 的分享花式登場。什麼是 vibe coding？簡單說，就是用你的語言、語意、邏輯，讓 AI 幫你寫出一套功能、一個系統。...