如何使用 Raccoon AI 建立 Web App
描述您的應用
告訴 Raccoon AI 想建立什麼。在功能、目標受眾和需求上要具體。
越多脈絡越好
「建立一個任務管理器」太模糊。「建立一個團隊用的看板任務管理器,有截止日期、成員分派和通知」才是可行動的。
為我的 SaaS 新創建立分析儀表板。需要:關鍵指標概覽(MRR、流失、成長)、最近 12 個月的趨勢圖、有搜尋和篩選的客戶表格和設定頁面。Email/密碼登入。暗色主題、現代設計。
審閱計畫
Raccoon AI 在建造前會建立計畫。審閱提議的功能並做調整。
對齊期望
確保計畫涵蓋所有需求後再開始。調整計畫比重做應用容易。
計畫看起來不錯,但請加上:(1) CSV 資料匯出、(2) 按方案的營收圖表、(3) 圖表的時間範圍篩選。先拿掉報表區域——MVP 不需要。
跟著建造過程
Raccoon AI 即時建造應用。跟著進度並在過程中給回饋。
即時回饋
不用等應用完成才給回饋。在建造中介入以引導結果。
客戶表格的排版很好,但改一下狀態徽章的顏色——活躍用綠色、試用用黃色、流失用紅色。頂部的指標卡片也放大一些。
設定後端
用 Supabase 連接資料庫、身份驗證和儲存以持久化資料。
真實資料很重要
沒有後端的漂亮應用只是原型。連接資料庫以獲得真實資料和完整功能。
設定應用的 Supabase:客戶表(姓名、email、方案、MRR、開始日期)、月指標表(MRR、流失、新客戶)。啟用 email/密碼身份驗證。建立範例資料做測試。
測試和優化
使用應用、找問題並要求修正。迭代到可上線為止。
像使用者一樣測試
像使用者會做的那樣瀏覽應用。每個畫面、每個按鈕、每個流程。實際使用時問題就會浮現。
找到幾個問題:(1) 日期篩選在手機上不能用、(2) MRR 圖表滑鼠移過去沒有提示、(3) 表格按 MRR 值排序不正確。修好這些並在表格加分頁——我們有 500+ 客戶。
發布和分享
一鍵部署到公開 URL。跟團隊或客戶分享。
快速上線
不用等完美。一個現在就能解決問題的可用 MVP 比 3 個月後的完美應用更有價值。
應用準備好了。部署到正式環境。需要分享連結給共同創辦人和 3 位投資人看。之後幫我設定自訂網域。

可以建立哪些類型的 Web App?
儀表板、內部工具、有功能的 Landing Page、SaaS 應用、客戶入口、任務管理器、CRM 等。能做成 Web App 的,Raccoon AI 都能建立。
需要會寫程式嗎?
不需要。用自然語言描述需求。Raccoon AI 寫程式碼、設定專案並部署。想看或編輯程式碼也可以。
可以連接資料庫嗎?
可以。Raccoon AI 跟 Supabase 整合,提供 PostgreSQL 資料庫、身份驗證和檔案儲存。一鍵自動設定。
可以部署到正式環境嗎?
可以。一鍵部署到公開 URL。Plus 5x 及以上方案可加自訂網域。
可以建立有身份驗證的應用嗎?
可以。email/密碼登入、社群 OAuth、路由保護和透過 Supabase 的使用者管理。
使用什麼技術?
React/Next.js 前端、Tailwind CSS 樣式、Supabase 後端。現代化且已準備好上線的技術堆疊。
之後可以迭代嗎?
可以。繼續對話,Raccoon AI 會做修改、加功能或修 bug。應用隨需求演進。
應用有響應式嗎?
有。所有應用預設響應式,在桌機、平板和手機上都能用。
可以下載程式碼嗎?
可以。隨時下載完整的原始碼。是可在任何地方修改和託管的標準程式碼。
應用可以多複雜?
從簡單的計算機到有多頁面、身份驗證、資料庫和整合的完整 SaaS 平台。複雜度取決於方案和使用量限制。

























