はじめに
Tap4 AI WebUIは、オープンソースの軽量AIツールナビゲーションウェブサイトプロジェクトです。このプロジェクトは、Next.jsとSupabaseの技術スタックを使用し、多言語SEO最適化をサポートし、AIツールの分類、フィルタリング、検索、詳細表示機能を提供し、Tap4 AI Crawlerプロジェクトがウェブページのクロールの自動化をサポートします。AI愛好家であろうと開発者であろうと、このプロジェクトを通じて独自のAIツール・ナビゲーション・サイトを素早く構築することができる。
機能一覧
- AIツールリスト表示：豊富なAIツール情報の表示をサポート
- カテゴリーで絞り込む：カテゴリー別にAIツールの閲覧をサポート
- 検索機能：AIツール検索機能の提供
- 詳細プレゼンテーション: AIツールのMarkdown形式でのプレゼンテーションのサポート 詳細プレゼンテーション
- SEOフレンドリー：多言語SEOサポート
ヘルプの使用
設置プロセス
- Tap4 AIクローラーの導入::
- まず行わなければならないのは、T.ap4 AIクローラー プロジェクト。デプロイされると、AIツールのウェブコンテンツを生成するためのAPIインターフェースとして、プラットフォームドメイン名またはカスタムドメイン名を使用できます。
- Tap4.AIクローラー機能：ウェブサイトの自動スクリーンショットとCloudflare R2へのアップロード。ウェブサイトの詳細のクロールをサポートし、AIを介してウェブサイトのタイトル、説明、およびMarkdown形式の特定の導入を生成します。
- Supabaseデータベースの作成とSQLスクリプトの実行::
- Supabaseに登録し、データベースを作成し、SUPABASE_URLとSUPABASE_ANON_KEYを記録し、その後のVercel環境変数の設定に使用する。
- SupabaseバックエンドのプロジェクトdbディレクトリにあるSQLファイル、create_table.sql、insert_category_data.sql、insert_data.sqlを実行する。
- Vercelでの展開::
- 打込むこちらプロンプトに従ってデプロイしてください。注：環境変数の設定を忘れないでください！
- 環境変数の設定例：
next_public_site_url="https://tap4.ai" google_tracking_id="g-xxxxxxx" google_adsense_url="https://xxxx.googlesyndication.com/xxxxx/xxxxx" contact_us_email="contact@tap4.ai" next_public_supabase_url="https://xxxyyyzzz.supabase.co" next_public_supabase_anon_key="xxx.yyy.zzz" CRAWLER_API="https://{crawler_domain}/site/crawl_async" CRAWLER_API_KEY="xxxx" CRON_AUTH_KEY="keyxxxx" SUBMIT_AUTH_KEY="xxxx"
- ローカルオペレーション::
- クローニング・プロジェクト
git clone https://github.com/6677-ai/tap4-ai-webui.git - 依存関係をインストールします：
ノードNVM PNPM - 環境変数の設定：ルート・ディレクトリの作成
.env.localファイルに、対応する環境変数の値を記入する。 - 開発モデルを実行する：
pnpm dev
- クローニング・プロジェクト
- コンテンツの更新::
- データベースの手動修正: Supabase の web_navigation テーブルのデータを直接修正します。
- クローラーの自動更新：クローラーが失敗した場合、手動でサブミットテーブルにクエリーを行い、関連するウェブサイトのコンテンツを作成し、web_navigationテーブルに挿入することができます。
