3
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

日向坂46の出演情報を追いきれなくなったので、横断検索ポータルを作った話

3
Posted at

はじめに

日向坂46のファンを長年やっていたら、こんな悩みが出てきました。 それは活動を追いきれなくなってきたことです。 

2026年5月時点で、日向坂46には現役メンバーだけで31名。 さらに、20人近くいる日向坂46を卒業したメンバーの大半が芸能活動を再開し、ファンクラブも開設。 嬉しい悲鳴なのですが、芸能活動を追いかけるのは、さすがに厳しくなりました。 記憶力に頼るのはとっくに限界。 

舞台やミュージカルだけを見ても、2026年5〜6月は卒業された加藤史帆さん、佐々木美玲さん、濱岸ひよりさん、富田鈴花さん、松田好花さんと同時期に5人分の情報を追う必要があります。

それに加え、日向坂46にはYouTube公式チャンネルがあります。 キーワードでタイトル検索はできますが、出演メンバー名での検索は当然できません。 そのため「〇〇さんが気に入ったのでおすすめ動画を教えてください」と聞かれても、過去動画は記憶頼みになりがちでした。

そこで、少なくともTV番組・ラジオ番組・YouTube動画を、メンバーの名前で横断的で簡単に検索できる形にしたいと思い、横断検索のポータルサイトを作成しました。

構築・運用しているサイト

おひさまポータルと名付けて構築・運用しています。

サイト名の由来は、日向坂46のファンの総称で「おひさま」とポータルサイトを掛け合わせて、おひさまポータルとしました。


設計で意識したこと

  1. メンバー名で複数のサービスを横断的に検索できる設計
  2. 見逃し防止のため、/almost-over を起点にした導線設計
  3. 著作権や肖像権を守り、あくまで案内サイトの形を守る(サムネイル非掲載、視聴は外部サイトへ遷移)
  4. アクセス過多のスクレイピングは避け、1日1回の定期実行に抑える

作ったもの

2つのリポジトリで構成しています。

リポジトリ 役割
ohisama-backend データ収集・加工・API提供
ohisama-portal フロントエンド(Next.js)

ohisama-portal(フロントエンド)

YouTube・TVer・Radikoのコンテンツをメンバー・種別・キーワードで横断検索できるポータルサイトです。

主なページ

  • /almost-over — 3日以内に配信終了するコンテンツ(見逃し防止のための最重要ページ)
  • /all — 全コンテンツ一覧
  • /:type — 種別(YouTube / TVer / Radiko)ごとの一覧
  • /:type/member/:member — メンバーごとの一覧

技術スタック

  • Next.js 15 (App Router) + React 19
  • TypeScript + Tailwind CSS
  • Playwright
  • Vercel(ホスティング)

ohisama-backend(データ基盤)

TVer・YouTube・Radikoからコンテンツを収集・加工し、フロントエンドが利用できるデータとして配信する基盤です。

技術スタック

  • Python 3.12 / Django 5.x / Django REST Framework
  • Playwright(スクレイピング)
  • YouTube Data API v3
  • GitHub Actions(定期実行・自動化)
  • X API(将来的に停止を検討中)

アーキテクチャの概要

本システムは ohisama-backend(データ収集・加工)と ohisama-portal(フロントエンド)の2リポジトリで構成されています。

データフローの流れ:

  1. 収集: GitHub Actionsが毎日早朝にトリガーし、PlaywrightでTVer・Radikoをスクレイピング、YouTube Data APIでコンテンツを取得
  2. 加工: Pythonスクリプトがメンバーや配信日時でデータを整形し、タグを付与してJSONファイルを生成
  3. 同期: GitHub Actionsが指定の場所へJSONファイルを自動コミット・プッシュ
  4. 配信: Next.jsがJSONをビルド時にimportし、Vercelを通じて静的ページとして公開

実装上の工夫と課題

スクレイピングの頻度と負荷への配慮

TVer・Radikoのスクレイピングは1日1回の定期実行に抑えています。ページ構造の変化やタイムアウトで失敗した場合は、GitHub Actionsの "Re-run jobs" で対応できる構成にしています。

配信終了タグの精度管理

TVer側の公開期限情報は事後的に変動することがあります。そのため、タグの付与は「既存タグを全削除 → 再付与」の方式を採っており、常に最新の状態を反映するようにしています。

データ同期のタイムラグ

JSONファイルをポータルへ同期してから実際にVercelへ反映されるまで、再ビルドのタイムラグ(通常数分)があります。緊急で反映が必要な場合は手動同期ワークフローを実行します。

一番大変だった箇所

YouTube動画とその動画に出演している日向坂46のメンバーの紐づけが大変でした。 いろいろ考えた結果、1つずつ動画を見ては誰が出演しているかの設定をひたすら人力することで解決させました。 数百本ありましたが、地道にやって完了させました。

今後行う予定のこと

  1. Radiko反映に続き、ポッドキャストも反映する
  2. メンバー名でフィルタリングの際、公式プロフィールURLや個人Instagram URLも表示する
  3. 現在はJSON運用のため、将来的にSupabase等への置き換えを検討する
  4. AWS採用を段階的に進める(S3, EventBridge Scheduler, CloudFront, Athena, Glue Data Catalog)
3
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
3
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?