用 InsForge + Zeabur 遷移 Lovable 專案

AI 重部署更輕鬆:MCP、遷移 Supabase、環境變數設置

Kyle ChungKyle Chung

如何在 Zeabur 上使用 Insforge 範本重新部署 Lovable 專案

對於許多程式設計或是並無相關背景的開發者而言,Lovable 無非是一個利用 AI 快速生成網頁的絕佳選擇。然而,當您需要更進階的客製化功能、更靈活的部署選項,或是希望將專案移至其他平台時,您可能會開始尋找替代方案。本文將作為您的技術指南,詳細介紹如何將您在 Lovable 建立的專案,順利遷移並部署到 Zeabur 和 Insforge 這兩個強大的雲端部署平台。


為何要從 Lovable 遷出?

Lovable 以其 AI 驅動的網頁生成能力,大幅降低了網頁開發的門檻。然而,隨著專案的成長,您可能會遇到以下情況,而考慮遷移至其他平台:

  • 更自由的客製化: 當您需要對網站的後端邏輯、資料庫串接或特定功能進行深度客製化時,Lovable 的封閉環境可能會有所限制。
  • 成本考量: 隨著流量的增長或專案數量的增加,往往收到帳單或是達到用量限制後,您可能會尋求更具成本效益的託管方案。
  • 技術棧的選擇: 您可能希望將專案整合至更廣泛的技術生態系中,例如使用特定的後端框架或資料庫。 Zeabur 和 Insforge 提供了更靈活、更強大的部署解決方案,讓開發者能完全掌控自己的應用程式。

為何選擇 Insforge?

InsForge 是共為主打 AI Agent 幫助用戶降低後端複雜度的平台。他們意識到後端開發長期以來一直是一個半解決的問題。AI 可以毫不費力地生成前端代碼,但難以應對後端的複雜性—— 資料庫設置、身份驗證流程、API 設計都需要深厚的專業知識。InsForge 不但整合了諸多功能,更結合了 MCP。用戶依照他們初始化只是設置結束後,就可以使用自然語言與 AI 溝通,減少了開發人員拼湊多個服務依然可以享受DevOps,因此有了 InsForge。

遷移至 Zeabur:一鍵部署的流暢體驗

Zeabur 是一個幫助用戶一鍵部署的平台,對於從 Lovable 遷移的使用者相當友善。 以下是將您的 Lovable 專案部署至 Zeabur 的步驟:

第一步:從 Lovable 匯出您的專案

這邊有兩個選擇:

選擇一:假如您尚未熟悉 Github,可以使用以下方法:

在 Lovable 的專案後台,將您的網站專案匯出。一般來說,Lovable 會提供將專案下載為包含 HTML、CSS 和 JavaScript 檔案的壓縮檔。

選擇二:假如您熟悉操作 Github ,可以使用以下方法:

Lovable 的專案可以直接與 GitHub 整合。在 Lovable 中,您可以連結您的 GitHub 帳戶,然後直接將專案匯出並建立一個新的 GitHub Repository。

第三步:進入 InsForge 建立專案並進行 MCP 連結

  1. 註冊並登入 InsForge 帳戶: 前往 InsForge 官網並建立您的帳戶。
  2. 建立新專案: 登入InsForge 後,點擊「建立新專案」。
  3. 開啟您的 Cursor 或是其他 IDE (程式編輯器):
    1. (選擇一) 解壓縮並導入至程式編輯器的步驟:

      1. 解壓縮下載的檔案:找到從 Lovable 下載的 .zip 壓縮檔,在您的電腦上對該檔案按右鍵,選擇「解壓縮」或「Extract」。解壓縮後,您會得到一個包含所有專案檔案的資料夾。
      2. 安裝程式編輯器(如果尚未安裝):建議使用 Cursor 或 Visual Studio Code 等現代化的程式編輯器。您可以從官方網站下載並安裝。
      3. 在編輯器中開啟專案:開啟您的程式編輯器,選擇「開啟資料夾」(Open Folder) 或「檔案」→「開啟」(File → Open),然後選擇剛才解壓縮的專案資料夾。
      4. 檢查專案結構:在編輯器的側邊欄中,您應該能看到專案的檔案結構,包括 HTML、CSS、JavaScript 檔案以及其他相關資源。
      5. 初始化 Git 版本控制(建議):在編輯器的終端機中執行 git init 來初始化 Git repository,這樣方便後續的版本管理和部署。

      完成這些步驟後,您就可以開始使用 AI 輔助工具(如 Cursor 的 AI 功能)來修改和優化您的專案程式碼了。

    2. (選擇二) git clone 您在您 Github 中已儲存好的 lovable 專案

    3. 進入支援 MCP 開發流程的編輯器並且輸入 InsForge 相關 API Key

  4. 設置完成後,接下來就是 InsForge 以及 Zeabur 神奇的開始:
    1. 進入支援 Insforge MCP 的 AI 編輯器,我們先再次確認 Cursor 是否能讀取並且使用 InsForge MCP

      Example Prompts: can you see the insforge mcp?

    2. 確認 Lovable 專案是否有 Supabase 遷移 SQL 表格,Lovable 輸出程式碼的專案都需要重新設置用戶驗證部分,這部分也可以麻煩 InsForge MCP 處理

      Example Prompts: i have those @migrations from supabase, can you help me create the thing in insforge as well?

    3. Cursor Agent 也協同 InsForge MCP 架構了 InsForge 所有需要的資料庫 (PostgreSQL、Storage Bucket 以及 RLS)(Optional)

      Example Prompts: can you help me set up the PostgreSQL database, storage buckets, and RLS policies in InsForge based on my Supabase schema?

    4. 麻煩 InsForge MCP 更新以使用 InsForge SDK。查看現有的 Supabase 配置和使用情況

      Example Prompts: can you replace all Supabase client usage with InsForge SDK? please check my current supabase configuration first.

    5. 麻煩 InsForge MCP 檢查當前的 auth 設置,確保 InsForge 的認證功能正確配置

      Example Prompts: can you verify that the authentication is properly configured with InsForge? please check my current auth setup.

    6. 優化查詢以使用資料庫關聯,並驗證資料庫連接。根據 db schema,關聯已正確設置。(Optional)

      Example Prompts: can you optimize my database queries to use proper relations and verify the database connection is working correctly?

第四步:進入 Zeabur 帳戶

  1. 進入您 Zeabur 帳戶點選 建立專案 並選擇地區集群
  2. 進入該專案點選從Github部署 並選擇該 Lovable 專案
  3. 點選 配置 並點選 編輯原始環境變數 並貼入 VITE_INSFORGE_BASE_URL=您專案的Insforge Base URL
  4. 點選 下一步
  5. 等待運行專案完成

恭喜你從 Lovable 遷移至 Zeabur 或 Insforge,將為您的專案帶來更大的彈性和擴展性。Zeabur 以其極致簡化的部署流程,成為了追求方便、無痛遷移的首選。而 Insforge 則以其對 AI 以及 MCP 和後端服務的強大支援,為您的專案未來發展提供了更廣闊的空間。