chihebnabil/lovable-boilerplate

これは何？

主な機能

• 01開発とビルドに使える、TypeScript対応のViteとReact 19。
• 02src/components/uiにあらかじめ設定されたshadcn/uiコンポーネント40種類以上。
• 03バックエンド開発向けのSupabaseクライアント、生成済みの型、マイグレーションフォルダ。
• 04データ取得用のTanStack Queryと、フォーム用のReact Hook FormおよびZod。
• 05プロジェクトの規約を説明するCopilotとCursor向けの指示ファイル。

ユースケース

• shadcn/uiのデザインシステムとSupabaseバックエンドを使ったReact Webアプリの開発。
• 生成されたUIを大幅にカスタマイズする予定のプロトタイプ作成。
• AIコーディングアシスタントに一貫したスタイリングルールを守らせるプロジェクトの構築。

クイックスタート

1. 1

   リポジトリをクローンする

   git clone https://github.com/chihebnabil/lovable-boilerplate.git
2. 2

   プロジェクトフォルダーに移動する

   cd lovable-boilerplate
3. 3

   依存関係をインストールする

   npm install
4. 4

   開発サーバーを起動する（http://localhost:8080 で実行）

   npm run dev

使う前に知っておきたいこと

• !Supabase の機能を使うには、自分の Supabase プロジェクトと、.env ファイルに記載した認証情報が必要です。
• !ローカルの Supabase コマンドには Docker が必要です。

トピック

よくある質問

lovable-boilerplate とは？

shadcn/ui、Tailwind、Supabaseを備え、CopilotとCursor向けのAIアシスタント指示ファイルも含むReact + Vite + TypeScriptのボイラープレート。 LovableのAIアプリビルダーに着想を得た、Reactのスタータープロジェクトです。Vite、React 19、TypeScript、Tailwind CSSとshadcn/uiのコンポーネント一式を備え、生成したUIも手書きのUIも、コードを直接読んで変更・拡張できます。

lovable-boilerplate は無料で使えますか？ライセンスは？

lovable-boilerplate は MIT ライセンスのオープンソースです。商用製品で使う前にライセンス条件を確認してください。

lovable-boilerplate は今もメンテナンスされていますか？

活発にメンテナンス中。lovable-boilerplate の最終コミットは 2026年11月4日 です。

lovable-boilerplate は何に使えますか？

shadcn/uiのデザインシステムとSupabaseバックエンドを使ったReact Webアプリの開発。 生成されたUIを大幅にカスタマイズする予定のプロトタイプ作成。 AIコーディングアシスタントに一貫したスタイリングルールを守らせるプロジェクトの構築。

lovable-boilerplate のインストール方法は？

リポジトリをクローンする: git clone https://github.com/chihebnabil/lovable-boilerplate.git プロジェクトフォルダーに移動する: cd lovable-boilerplate 依存関係をインストールする: npm install 開発サーバーを起動する（http://localhost:8080 で実行）: npm run dev

lovable-boilerplate はどこで入手できますか？

ソースコードとインストール手順は GitHub にあります：https://github.com/chihebnabil/lovable-boilerplate