一般的なSaaSワークフロー向けの公開ページ
再利用可能なランディングページ、待機リスト、事前販売、価格表、アフィリエイトページが含まれているため、各ページをゼロから組み立てずに、プロダクト志向のページでSaaSを立ち上げられます。
Shipped
認証するShippedは、ランディングページ、決済、認証、メール、ダッシュボードを備えたNext.js SaaSボイラープレート。開発者がゼロから組まずに素早くSaaSを立ち上げられます。
概要
Shippedは、マーケティングページ、決済フロー、認証、メール、ダッシュボードといった通常必要になる要素をゼロから作らずに、より速くプロダクト化されたWebアプリを立ち上げたい開発者向けのNext.js SaaSボイラープレートです。サイトでは、数か月ではなく数日で立ち上げられる手段として位置づけられています。
このパッケージは、一般的なSaaSニーズに対応する再利用可能なページとコンポーネントを中心に構成されています。ランディングページ、ウェイトリスト、事前販売、価格表、アフィリエイトプログラム、決済、サインアップとログイン、ブログ、ダッシュボード、AIサービス連携が含まれます。Next.js 14、TypeScript、Chakra UIを基盤に、Prisma、Supabase、NextAuth、shadcn/ui、Rechartsなどの関連ツールも使用されています。
Shippedに含まれるもの
決済収集のセットアップ
決済はLemon SqueezyまたはStripeを通じたサブスクリプションと単発購入に対応しており、チェックアウトUI、Webhook、サイトで言及されている主要な決済手段のサポートが含まれます。
認証と非公開領域
認証フローにはサインアップ、ログイン、マジックリンク、ソーシャルログインが含まれ、データベース連携のユーザー保存とプライベートAPIアクセスがパッケージの一部として示されています。
メールとメッセージングの連携
ボイラープレートには、ニュースレターやトランザクションメッセージ向けのメール関連連携が含まれており、MailchimpとLoopsが例として挙げられています。
最新のアプリスタックと連携
スタックの中心はNext.js 14、TypeScript、Chakra UI、Prisma、Supabase、shadcn/ui、Rechartsで、AIサービス連携としてOpenAI、Anthropic、Gemini、Groq、Ollama、DeepSeekなどが挙げられています。
ドキュメントと継続的な更新
ドキュメントとDiscordコミュニティがプロダクトの一部として位置づけられており、週次アップデートとセキュリティアップデートもサイトで言及されています。
Shippedが役立つ場面
新しいSaaS製品の立ち上げ
新しいSaaSリリースのために、マーケティングページ、決済、ログイン、製品画面を1つずつ組み立てる代わりに、あらかじめ用意されたものから始めたいときに使います。
収益化の設定
製品にサブスクリプション、単発購入、Webhook、Lemon SqueezyまたはStripeに接続されたチェックアウトフローが必要な場合に使います。
認証とアクセス制限機能の実装
アカウント作成、サインイン、ソーシャルログイン、マジックリンク、プライベートAPIや会員限定セクションが必要で、認証層全体を自分で作りたくないときに使います。
コンテンツとSEOページの追加
プロダクトブログを公開し、メタタグを追加し、SEOに適した構造が必要なコンテンツページにMarkdownまたはMDXを使いたい場合に使います。
ダッシュボードと連携による拡張
チャート付きのダッシュボードや再利用可能なアプリUIに加え、メールサービスやAIプロバイダーとの任意の連携を加えたいときに使います。
Pros and Cons
Pros
- ランディングページ、決済、認証、メール、ブログ、ダッシュボードなど、複数のSaaS構築要素を1つのパッケージにまとめています。
- Lemon SqueezyまたはStripeが決済オプションとして示されており、サブスクリプションと単発購入の両方をサポートしています。
- 一般的なUIコンポーネントだけでなく、待機リスト、事前販売、価格表、アフィリエイトフローなど、プロダクト向けのページが含まれています。
- サイトによると、ドキュメント、Discordサポート、無料アップデートが付属しています。
- 主要なAIプロバイダーや一般的なアプリ基盤ツールを含む、幅広い連携先を備えています。
Cons
- サイト上の価格ページは404を返すため、現在の価格情報はホームページで確認する必要があります。
- このボイラープレートはNext.jsと関連するReact系ツールに特化しているため、React以外のスタックを使うチームでは一部しか再利用できません。
FAQ
Shippedを購入すると何が含まれますか？
Shippedは、Next.js 14 のワンタイム購入型ボイラープレートです。購入には、GitHubリポジトリへの生涯アクセス、公開ドキュメント、非公開Discordコミュニティ、無料アップデートが含まれます。
Shippedはどの技術スタックを使っていますか？
このボイラープレートは Next.js、React、TypeScript、Chakra UI をベースにしています。ソースでは、App Router、Prisma、Supabase、NextAuth、Recharts、Lemon Squeezy、Stripe、Mailchimp、Loops、複数のAIプロバイダーとの連携にも対応していると記載されています。
Shippedをクライアント向けや商用製品に使用できますか？
商用プロジェクトを含む無制限のプロジェクトで使用できます。コードやその一部をテンプレートやボイラープレートとして公開することはできません。
別の技術スタックでも使えますか？
ShippedはNext.jsを前提に作られているため、そのフレームワークを使うプロジェクトに最も適しています。FAQでは、ReactベースだがNext.jsではない場合はコードベースの約80%を再利用でき、Next.jsとReactを使わないTypeScriptまたはJavaScriptの場合は約20%を再利用できると案内されています。
ShippedがStripeではなくLemon Squeezyを挙げているのはなぜですか？
サイトでは、Lemon SqueezyはMerchant of Recordであり、グローバル販売時の消費税を処理できるため推奨されています。Stripeは代替の決済プロセッサとして示されています。
Quick Facts
- カテゴリ
- 開発者向けツール / SaaSボイラープレート
- プラットフォーム
- Next.js 14、React、TypeScript
- UIスタック
- Chakra UI、shadcn/ui、Tailwind CSS、Recharts
- 主な用途
- SaaS製品をより速く構築・公開する
- ソースドメイン
- shipped.club
- 価格形態
- ワンタイム購入。サイトにはSaaS Boilerplateプランが157ドル、SaaS + Chrome Extension Boilerplateプランが207ドルで掲載されており、どちらも年額請求と記載されています