Shipped

Shipped 是給開發者的 Next.js SaaS boilerplate，內建登陸頁、付款、驗證、Email 與儀表板，讓你從產品導向程式碼庫快速啟動 SaaS。

概覽

Shipped 是一個 Next.js SaaS boilerplate，目標是幫助開發者更快推出產品化網頁應用，而不必從零開始打造常見的行銷頁面、付款流程、驗證、Email 與儀表板功能。網站將它定位為能在幾天而不是幾個月內完成上線的方式。

這個套件以可重用的頁面與元件為核心，涵蓋常見 SaaS 需求：登陸頁、等候名單、預售、定價、聯盟行銷方案、付款、註冊與登入、部落格、儀表板，以及 AI 服務整合。它建立在 Next.js 14、TypeScript、Chakra UI 之上，並搭配 Prisma、Supabase、NextAuth、shadcn/ui 與 Recharts 等相關工具。

Shipped 包含什麼

常見 SaaS 工作流程的上線頁面

提供可重複使用的登陸頁、等候名單、預售、定價與聯盟行銷頁面，讓 SaaS 能直接用產品導向頁面上線，而不必從零組裝每個頁面。

付款收款設定

付款支援透過 Lemon Squeezy 或 Stripe 的訂閱與一次性購買，並包含結帳介面、webhooks，以及網站上提到的主要付款方式支援。

驗證與私有區域

驗證流程包含註冊、登入、魔法連結與社群登入，並提到以資料庫為基礎的使用者儲存與私有 API 存取作為套件的一部分。

Email 與訊息整合

這個 boilerplate 包含與 Email 相關的整合，可用於電子報與交易通知，並以 Mailchimp 和 Loops 為例。

現代化應用技術棧與整合

技術棧以 Next.js 14、TypeScript、Chakra UI、Prisma、Supabase、shadcn/ui 與 Recharts 為核心，並列出 OpenAI、Anthropic、Gemini、Groq、Ollama、DeepSeek 等 AI 服務整合。

文件與持續更新

文件與 Discord 社群被定位為產品的一部分，網站同時提到每週更新與安全性更新。

Shipped 何時有用

推出新的 SaaS 產品
當你想用現成的行銷頁面、付款、登入與產品畫面來開始，而不是為新的 SaaS 發布逐一組裝時，適合使用 Shipped。
設定變現機制
如果你的產品需要訂閱、一次性購買、webhooks，以及連接到 Lemon Squeezy 或 Stripe 的結帳流程，就適合使用。
實作驗證與受限功能
當你需要帳號建立、登入、社群登入、魔法連結，以及私有 API 或會員專區，而不想自己完整打造驗證層時，可使用它。
新增內容與 SEO 頁面
如果你計畫發布產品部落格、加入 meta 標籤，並使用 Markdown 或 MDX 來製作需要 SEO 友善結構的內容頁面，就適合使用。
擴充產品儀表板與整合
當你希望有帶圖表的儀表板與可重用的應用程式 UI，並可選擇整合 Email 服務與 AI 供應商時，可使用它。

Pros and Cons

Pros

將許多 SaaS 建置積木整合在單一套件中，包括登陸頁、付款、驗證、Email、部落格與儀表板。
同時支援訂閱與一次性購買，並提到 Lemon Squeezy 或 Stripe 作為付款選項。
包含產品專用頁面，例如等候名單、預售、定價與聯盟行銷流程，而不只是通用 UI 元件。
依據網站內容，提供文件、Discord 支援與免費更新。
展示了廣泛的整合範圍，包括主要 AI 供應商與常見應用基礎架構工具。

Cons

網站上的定價頁面回傳 404，因此目前的價格資訊需要改從首頁查看。
這個 boilerplate 以 Next.js 與相關 React 工具鏈為核心，因此使用非 React 技術棧的團隊只能重用其中一部分。

FAQ

購買 Shipped 會得到什麼？

Shipped 是一個一次購買的 Next.js 14 boilerplate。購買內容包含 GitHub 儲存庫的終身使用權、公開文件、私密 Discord 社群，以及免費更新。

Shipped 使用什麼技術棧？

這個 boilerplate 建構於 Next.js、React、TypeScript 與 Chakra UI。來源也提到支援 App Router、Prisma、Supabase、NextAuth、Recharts，以及 Lemon Squeezy、Stripe、Mailchimp、Loops 和多個 AI 供應商等整合。

我可以把 Shipped 用於客戶或商業產品嗎？

你可以用它來建立不限數量的專案，包括商業專案。你不能將這些程式碼或其部分內容以範本或 boilerplate 的形式發布。

我可以搭配不同的技術棧使用嗎？

Shipped 是以 Next.js 為核心，因此最適合使用該框架的專案。FAQ 說明，如果你的技術棧是 React 但不是 Next.js，大約可以重用 80% 的程式碼庫；如果你使用的是沒有 Next.js 和 React 的 TypeScript 或 JavaScript，大約可以重用 20%。

為什麼 Shipped 提到 Lemon Squeezy 而不是 Stripe？

網站建議使用 Lemon Squeezy，因為它是 Merchant of Record，這表示它會處理全球銷售的銷售稅。Stripe 則被列為替代的付款處理商。

Quick Facts

分類: 開發者工具 / SaaS Boilerplate
平台: Next.js 14、React、TypeScript
UI 技術棧: Chakra UI、shadcn/ui、Tailwind CSS、Recharts
主要用途: 更快建置並推出 SaaS 產品
來源網域: shipped.club
價格形式: 一次性購買；網站列出 SaaS Boilerplate 方案為 $157，SaaS + Chrome Extension Boilerplate 方案為 $207，兩者皆按年計費