インフルエンサー タイアップ投稿 自動まとめサービス
ブランド企業のマーケティング担当者が、競合ブランドのインフルエンサータイアップ投稿を横断的に検索・分析できるWebサービスです。
| レイヤー | 技術 | 選定理由 |
|---|---|---|
| フロントエンド | Next.js 16 (App Router) | SSR/SSGでSEO対策、React Server Componentsで高速化 |
| バックエンド | Next.js API Routes | フロントエンドと統合、Vercelとの親和性 |
| DB | Supabase (PostgreSQL) | RLS対応、リアルタイム、管理画面付き |
| 認証 | Supabase Auth | メール/Google認証、JWTベース |
| AI分類 | Claude API (Anthropic) | 投稿内容の分析・ブランド分類・トーン分析 |
| スタイリング | Tailwind CSS v4 | ユーティリティファースト、高速開発 |
| アイコン | Lucide React | 軽量・一貫性のあるアイコンセット |
| ホスティング | Vercel | Next.jsネイティブ対応、Cron Jobs |
npm install.env.local.example をコピーして .env.local を作成し、各APIキーを設定:
cp .env.local.example .env.local必要な環境変数:
| 変数名 | 説明 | 必須 |
|---|---|---|
NEXT_PUBLIC_SUPABASE_URL |
Supabaseプロジェクト URL | DB接続時 |
NEXT_PUBLIC_SUPABASE_ANON_KEY |
Supabase匿名キー | DB接続時 |
SUPABASE_SERVICE_ROLE_KEY |
Supabaseサービスロールキー | Worker実行時 |
INSTAGRAM_ACCESS_TOKEN |
Instagram Graph APIトークン | Instagram収集時 |
INSTAGRAM_BUSINESS_ACCOUNT_ID |
Instagramビジネスアカウント ID | Instagram収集時 |
YOUTUBE_API_KEY |
YouTube Data API v3 キー | YouTube収集時 |
ANTHROPIC_API_KEY |
Anthropic Claude API キー | AI分類時 |
CRON_SECRET |
Cronエンドポイントの認証シークレット | 定期収集時 |
Supabaseプロジェクトを作成し、マイグレーションを実行:
# Supabase CLIでマイグレーション実行
supabase db push
# またはSQL Editorで直接実行:
# supabase/migrations/001_initial_schema.sql
# ブランドマスターデータのシード
supabase db seed # supabase/seed.sql を実行Excelファイルからシードデータを生成:
npx tsx scripts/seed-brands.tsこれにより以下が生成されます:
supabase/seed.sql- DB投入用SQLファイルsrc/lib/brand-master.json- フロントエンド用JSONファイル
npm run devhttp://localhost:3000 でアクセス可能です。
src/
├── app/ # Next.js App Router
│ ├── page.tsx # ダッシュボード（トップページ）
│ ├── brands/ # ブランド検索・詳細
│ ├── posts/ # 投稿詳細
│ ├── influencers/ # インフルエンサー一覧・詳細
│ ├── auth/ # 認証（ログイン・サインアップ）
│ └── api/ # API Routes
│ ├── posts/ # 投稿一覧API
│ ├── brands/ # ブランド検索API
│ ├── collect/ # データ収集トリガー
│ └── cron/ # 定期収集Cronエンドポイント
├── components/ # UIコンポーネント
│ ├── layout/ # Header, Sidebar
│ ├── dashboard/ # PostCard, StatsOverview
│ └── ui/ # Badge等の共通UI
├── lib/ # ライブラリ・ユーティリティ
│ ├── supabase/ # Supabaseクライアント
│ ├── collectors/ # Instagram/YouTube収集ロジック
│ ├── ai/ # Claude API分類
│ ├── utils/ # フォーマット等
│ ├── mock-data.ts # テスト用モックデータ
│ └── brand-master.json # ブランドマスターデータ
├── types/ # TypeScript型定義
└── middleware.ts # 認証ミドルウェア
supabase/
├── migrations/ # DBマイグレーション
│ └── 001_initial_schema.sql
└── seed.sql # ブランドマスターシードデータ
scripts/
└── seed-brands.ts # Excel→SQLシード生成スクリプト
docs/
├── TieUpWatch_Claude_Code_Instructions.md # 実装指示書
└── TieUpWatch_Brand_Master.xlsx # ブランドマスターExcel
- Instagram: Graph API (Hashtag Search) で
#PR#ad#タイアップ等を検索 - YouTube: Data API v3 で PR関連キーワードの動画を検索
- ルールベース一次判定: ハッシュタグ・キャプションのパターンマッチでスコアリング
- Claude API二次判定: ブランド特定・カテゴリ分類・トーン分析
- DB保存: Supabaseに投稿データ+AI分析結果を保存
# Instagram
curl -X POST http://localhost:3000/api/collect/instagram \
-H "Authorization: Bearer YOUR_CRON_SECRET"
# YouTube
curl -X POST http://localhost:3000/api/collect/youtube \
-H "Authorization: Bearer YOUR_CRON_SECRET"Vercelデプロイ時、vercel.json で設定された6時間ごとの定期収集が自動実行されます。
# Vercel CLIでデプロイ
npx vercel
# 本番デプロイ
npx vercel --prodVercelダッシュボードで以下の環境変数を設定してください:
- 上記「環境変数の設定」セクションの全変数
Proprietary - Stats Corporation