🔧 阿川の電商水電行
當我最初建立Ozigi （最初名為 WriterHelper）時，目標很簡單：讓我的團隊中的內容專業人員能夠將他們的文章分解成高訊號社交媒體活動。
OziGi 現已發展成為一款開源 SaaS 產品，向公眾開放使用和改進。
以下是我如何將 Ozigi 從單體 v1 MVP 完全轉變為可用於生產的 v2 SaaS 的完整技術變更日誌。
-
對 App.tsx 檔案進行模組化重構（關注點分離）
在 v1 版本中，我的整個應用程式：身份驗證、API 呼叫和使用者介面——都位於一個很長的app/page.tsx檔案中。我做的修改越多，管理就越困難。
- 模組化元件庫：我簡化了單體應用，並將 UI 分解為純粹的、單一職責的 React 元件（
Header、Hero、Distillery等）。
-
集中式類型安全性：我建立了一個全域
lib/types.ts文件，其中包含嚴格的CampaignDay介面（帶有索引簽名），最終消除了我一直遇到的 TypeScript「影子類型」建置錯誤。 -
狀態持久化：實現了
localStorage同步，以便應用程式「記住」使用者是在控制面板還是登入頁面，從而避免在瀏覽器刷新時出現令人沮喪的重置。
-
使用 Supabase 作為資料庫並加強後端
v1 版本的一個主要使用者體驗缺陷是，重新整理頁面會清除使用者的進度。
-
關係型資料庫和 OAuth：我透過 Supabase 將匿名存取替換為安全的 GitHub OAuth。
-
自動化上下文歷史記錄：我設計了一個系統，可以將產生的每個行銷活動自動儲存到 PostgreSQL 資料庫中。用戶現在只需單擊即可恢復過去的 URL、備註和輸出。
- 身份儲存：建立了一個設定流程，將使用者的自訂「Persona Voice」和 Discord Webhook URL 永久保存到他們的個人資料中。
-
核心功能新增
- 多模態輸入：升級了輸入引擎，使其能夠同時接受即時 URL和原始自訂文字。
- 原生 Discord 部署：建立了專用 API 路由和 UI webhook 集成，只需單擊即可將生成的內容直接推送到 Discord 伺服器。
-
更新使用者介面/使用者體驗和專業品牌形象
-
品牌重塑：調整了應用程式的訊息傳遞方向，完全專注於內容專業人士，將其定位為一個可以輕鬆生成社交媒體內容並以您自己的聲音呈現的引擎。
-
開放式使用者引導：設計了「先試後買」的工作流程。未經認證的使用者可以無縫測試人工智慧產生的功能，但需要透過升級橫幅才能使用進階功能（歷史記錄、使用者畫像、Discord）。
- 像素級完美佈局與SEO：運用精準的CSS Flexbox規則，消除了多餘的空白和
z-index問題。升級了app/layout.tsx，增加了專業的OpenGraph和Twitter Card元資料。
-
品質保證與 DevOps（自動化 Playwright 端對端測試）
-
自動化端對端測試：完全重寫了 Playwright 測試套件 (
engine.spec.ts)，以驗證新的登陸頁文案，測試導航流程，並確認安全規則已正確應用。 -
Linux 相依性修復：透過確保安裝底層 Linux 瀏覽器相依性（
--with-deps）來修補我的 CI/CD 管道，以便無頭 Chromium 測試能夠完美通過。
下一步是什麼？ （v3路線圖）
上下文引擎現已穩定，基礎已奠定。
我的V3計畫是修復部署流程：
-
整合原生 X（Twitter）
-
LinkedIn API，以便使用者可以直接從 Ozigi 控制面板發佈內容。
您在擴展 Next.js MVP 時遇到的最大挑戰是什麼？請在評論區告訴我！
試試Ozigi
如果您有任何功能建議，請告訴我！
想看看我寫的糟糕程式碼嗎？請在Github上搜尋OziGi。
在領英上聯絡我！
1) --- 會變成分隔線（上一行必須是空白）
2) # 會變成一級標題
3) ## 會變成二級標題
4) ### 會變成三級標題
5) **粗體文字**會顯示粗體文字
6) ```當第一行與最後一行會顯示程式碼
7) 請搜尋 Markdown 語法，了解各種格式
