cult directory templateダウンロード - cult directory templateソースコードダウンロード

cult directory template

AI ソースコード

1.0.0

ダウンロード

カルトディレクトリテンプレート

フルスタックNextJS + ShadCn + Supabaseテンプレート

YouTubeオンボーディングビデオ

このビデオでは、ディレクトリアプリをゼロからセットアップする方法について説明します。私達はします：

CLIを使用して新しいSupabaseプロジェクトをセットアップします
アプリにリンクします
セットアップ環境変数
DB移行を実行して、スキーマを構成します
認証を構成します
管理者ユーザーを登録する（有料）
3段階のAI濃縮スクリプトを実行して、ディレクトリ（有料）を入力します
管理者パネルを確認する（有料）

特徴

特徴	無料版	有料版
next.js v13	✅	✅
/アプリディレクトリ	✅	✅
Tailwind CSS	✅	✅
SHADCNコンポーネント	✅	✅
Vercel AI SDK	✅	✅
サパベース統合	✅	✅
モバイルレスポンシブ	✅	✅
製品RSCを提出します	✅	✅
ダーク＆ライトモード	✅	✅
ユーザー認証	✅	✅
製品フィルター	✅	✅
カスタムカラーテーマ	✅	✅
無料アップデート	✅	✅
管理ダッシュボード		✅
管理者分析		✅
バルクAIデータ濃縮		✅
ライセンス	GPL-2.0	コマーシャル

価格設定	無料	119ドル

カルトに参加してください

Payに含まれる追加のテンプレート

カルトに参加すると、他のさまざまなプレミアムテンプレートに生涯アクセスできます。

テンプレート	説明	特徴	リンク
旅行隠し場所	旅行目標の管理と計画のために設計された、リアルタイム同期とPWAサポートを備えたオフラインファーストトラベルアプリ。	オフライン機能、リアルタイム同期、PWAサポート、Next.JS、Tailwind CSS、Claude AI、RXDB Progressive Webアプリ	旅行隠し場所
カルトSEO	Webサイトをrawう、SEOの格付け、AI主導の改善を提供するためのツール。	RSC Webスクレイピング、Webバイタル、構造化されたAI出力、Next.JS、TailWind CSS、ClaudeAI	カルトSEO
マニフェスト	ベクトル埋め込みとぼろきれの取得を備えたAIアプリを出荷するためのフルスタックテンプレート。	ベクトル埋め込み、ぼろきら検索、スパバーズ、next.js、tailwind css、open ai	マニフェスト
ランディングページ	デザインサブスクリプションランディングページ。	アニメーション、ユニークなナビゲーション、Next.js、Tailwind CSS	ランディングページ
バックエンド	さまざまなニーズのためのさまざまなバックエンドテンプレート。	さまざまなユースケース用のさまざまなバックエンドソリューションとスニペット。	バックエンド

これらのテンプレートはそれぞれ、カルトディレクトリのように完全に設計されており、制作の準備ができています。カルトスタックは次のようになります。

適切に設計されたスタートアップを迅速に構築および立ち上げるのに役立つように設計されています。

はじめる

オンボーディングビデオをご覧になってすぐにスピンアップしてください

## Supabase

Supabase CLIをインストールします

Mac： brew install supabase/tap/supabase

Windows：

scoop bucket add supabase https: // github.com / supabase / scoop - bucket.git
scoop install supabase

Linux： brew install supabase/tap/supabase
npm/bun： npx supabase <command>

Supabaseプロジェクトを作成します

SupabaseダッシュボードでSupabaseプロジェクトを作成するか、CLIを介して作成します。
```
npx supabase projects create -i " your-saas-app "
```
組織IDは、orgを選択した後、URLに記載されています。

CLIをプロジェクトにリンクします

CLIをプロジェクトにリンクします。
```
npx supabase init
npx supabase link
```
作成したプロジェクトを選択します。

supabase url＆public anon key in `.env.local` for next.jsを保存

supabase url＆public anon key in .env.local for next.js：
```
NEXT_PUBLIC_SUPABASE_URL= < api-url >
NEXT_PUBLIC_SUPABASE_ANON_KEY= < anon-key >
```
API設定ページからプロジェクトAPI URLと匿名キーを取得できます。

セットアップDBスキーマ

セットアップDBスキーマ：
これによりsupabase/migrationsディレクトリにあるすべての移行が実行されます
```
supabase db push
```

`.env`変数が正しく構成されていることを確認してください

cp .env.local.example .env.local

 # Example Supabase Config
NEXT_PUBLIC_SUPABASE_URL= " https://examplesqnwerasdfaser.supabase.co "
SUPABASE_PROJECT_ID= " examplesqnwerasdfaser "
NEXT_PUBLIC_SUPABASE_ANON_KEY= " xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx.. "

開発する

依存関係をインストールし、next.jsクライアントを実行します

別の端末で、次のコマンドを実行します。

pnpm i

pnpm run dev

http：// localhost：ブラウザで3000を開きます。

お勧めします電子メールをオフにします

SupabaseのデフォルトのSMTPレート制限は、現在非常に低いです。

プロバイダーメール - API設定ページ。

製品をディレクトリに追加します

新しい製品をディレクトリに追加するには、送信ページにアクセスしてください。

製品を提出します

おめでとう！

これで、独自のカルトディレクトリの構築を開始するために必要なすべてのデータを備えた完全にシードされたデータベースができました。

管理者のセットアップ

有料版のみ

カルトに参加してください

管理者アカウントに必要な電子メールにサインアップしてください

お勧めします電子メールをオフにします

SupabaseのデフォルトのSMTPレート制限は、現在非常に低いです。

ビルトインSMTPサービスのレートは4年/時間に引き下げられました。
生産には低すぎます。独自のSMTPサービスを使用する必要があります。

プロバイダーメール - API設定ページ。

確認が必要な場合は、これらのガイドに従ってください

サパベースのサインアップレート制限を増やす方法（3000無料メール /月）
ドメインから電子メールを送信するようにSupabaseを構成する方法

ログイン

新しく作成されたユーザーUIDをコピーします

Auth Users Table API設定ページから取得します。

in .env.local SUPABASE_ADMIN_ID変数をコピーして、それをSQLエディターに貼り付けます。

管理者の権利の割り当て

Supabase API設定ページのSQLエディターに移動します。

 UPDATE auth . users
SET raw_app_meta_data = jsonb_set(
    coalesce(raw_app_meta_data, ' {} ' ),
    ' {claims_admin} ' ,
    ' true ' ::jsonb
)
WHERE id = ' USER_UUID ' ;

管理者の権利をユーザーに割り当てるには、次のSQLスクリプトを実行します。 'USER_UUID' Autherユーザーテーブルからコピーしたのと同じユーザーIDに置き換えます。

3ステージAIバルク濃縮スクリプト

シードスクリプトはかなり複雑です。概要ドキュメント0。supabase supabase/seed/src/README.mdおよび各段階のドキュメントがあります。

supabase/seed/src/stage-1-crawl/readme.md
supabase/seed/src/stage-2-enrich/readme.md
supabase/seed/src/stage-3-seed/readme.md

走るのにできるだけ安くしようとしました。 APIサポートレベルに応じて、並行性とタイムアウト値で再生することにより、スクリプトのパフォーマンスを向上させることができます。

オプション1

supabase/seed/src/stage-2-enrichを実行するには、 .env.localファイルにANTHROPIC_API_KEYまたはANTHROPIC_API_KEYが必要です。

APIキーがある場合は、 .env.localファイルにコピーします。
オプションで、 supabase/seed/src/main.tsのSEED_URLS変数を編集して、こすり濃いURLを含めます。
スクリプトを実行します：
```
pnpm run enrich-seed
```

オプション2

APIキーがない場合は、前の実行の事前に豊富なデータセットを含めました。これはsupabase/seed/src/stage-2-enrich/__data__/enriched-20240611T210738.jsonで見ることができます。

キーを使用して濃縮するのではなく、このデータセットを使用するには：

supabase/seed/src/main.tsでファイルを開きます。

コメント104 - 110 ：

 // console.log("Step 1: Crawl and save raw data")
// await crawlAndSave(SEED_URLS)
// console.log("Step 1 completed successfully")

// console.log("Step 2: Enrich the latest raw data")
// await enrichLatestData()
// console.log("Step 2 completed successfully")

スクリプトを実行します：
```
pnpm run enrich-seed
```

管理ダッシュボードにアクセスします

管理者ダッシュボードを介してディレクトリのコンテンツとユーザーを管理します。ここにアクセス：

管理ダッシュボード

カスタマイズ

カスタムカラーテーマ

ディレクトリにユニークな外観を与えるには、カスタムカラーテーマを作成します。

あなたのテーマをデザインします
カスタムShadCNテーマページにアクセスして、テーマを設計してください。
あなたのテーマを適用します
テーマを取得したら、関連するCSSをコピーしてapp/globals.cssファイルに貼り付け、5〜67行を置き換えます。

展開する

新しいリポジトリを作成し、プロジェクトをGitHubにプッシュします。
vercelに移動して、githubリポジトリ：展開をインポートします。
Vercelで環境変数を設定します
vercelのプロジェクト設定に移動し、 .env.localファイルからコンテンツをコピーして環境変数を設定します。次の変数が含まれていることを確認してください。
- NEXT_PUBLIC_SUPABASE_URL -supabase api url
- NEXT_PUBLIC_SUPABASE_ANON_KEYあなたのSupabase Anonymous Key
- SUPABASE_PROJECT_IDあなたのSupabaseプロジェクトID
- SUPABASE_ADMIN_IDアプリケーションの管理者ユーザーID
- プロジェクトのセットアップに固有の他の環境変数
環境変数がどのように見えるかの例は次のとおりです。
```
 NEXT_PUBLIC_SUPABASE_URL="https://abcd1234.supabase.co"
NEXT_PUBLIC_SUPABASE_ANON_KEY="eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9..."
SUPABASE_PROJECT_ID="abcd1234"
SUPABASE_ADMIN_ID="efgh5678"
```
プロジェクトを展開します
環境変数が設定されたら、プロジェクトを展開できます。 Vercelは、ビルドおよび展開プロセスを処理します。
ライブアプリケーションにアクセスします
展開後、Vercelが提供するURLを介してライブアプリケーションにアクセスできます。これで、アプリケーションはライブで使用できるようにする必要があります。