follmy

サッカーまとめサイトを作った

March 30, 2025

はじめに

個人開発でサッカー関連のRSSフィードを集約するWebサイトを作ってみたので、その技術構成とかをざっくり紹介。

どんなサイト？

ざっくり、こんな感じのサイト。

  • サッカー関連のrssから定期的に記事を取得して表示するまとめサイト

いくつか同じようなサイトがあったので、自分好みに作りたい&収益出せたら出したいというのでつくった。

前に一度作ってデザイン周りとかでめんどうくさくなったのでやめたけど、cursorを使って開発するのに良さそうなので開発。今回はClaude3.7ベースで作ってる。

開発の進め方

自作MCPを使ったプロンプト開発スタイルで進めた。プロンプトテンプレを使い回す感じで進める方式で、大まかには以下のようなテンプレを使って進めた。

  • make_request -> 要求整理をするためのヒアリングシートを作ってくれるコマンド
  • make_rdd -> 要件定義
  • make_design -> システム設計
  • make_tasks -> タスク設計
  • exec_task -> タスク実行

上に当てはまらない部分は都度チャットでやり取りしつつ、基本は上の流れでとりあえず最小限を作って、順次機能追加する形で進めた。うまくいかずやり直したりしたものの、いい感じにいいペースで作れた。

現状は、最小限のものに加えていったん以下の機能を追加したところ。

  • 試合結果を取得して保存&表示する機能（取得元のapilimitを考慮した実装）
  • render.comのコールドスタートを回避するためのジョブ
  • アクセス解析（ga4導入）

サービス的にはいったん動くようになったので、機能追加を順次ほかのやることと並行して積んでいきたい。

プロンプト管理のMCPサーバーはこの記事を参照

使ってる技術とか

使ってる主な技術はこんな感じ。

フロントエンド・バックエンド
  • Next.js (App Router)
  • TypeScript
  • Tailwind CSS
データベース・ORM
  • PostgreSQL - データベース。ローカル開発では Docker で立ててる。
  • Supabase - 本番環境のデータベースとして利用してる。無料なのでありがたい。
  • Prisma
インフラ
  • Docker / Docker Compose
  • Google Cloud Platform (GCP)
    • Cloud Run Jobs: 以下の用途で使ってる。
      • RSS取得バッチ（Cloud Run Jobs）
      • render.comのコールドスタートを回避するために定期的にアクセス
    • Artifact Registry
  • Terraform: インフラ構成をコードで管理 (IaC) するために使ってる。初めて使ってみたんだけど、まだ全然最適化とかはできてないかも。でもコードで管理できるのはやっぱり便利。
  • GitHub Actions: Terraformのデプロイ周りに使ってる
  • render.com 無料なのでありがたい。
その他
  • Cloudflare Workers: 試合結果を一時的に保存しておくのに使ってる。DB に入れるほどでもない、バッチで取るほどでもない、みたいな一時的なデータ置き場として活用。
  • Google KMS: Cloud Run Jobs で使う環境変数（APIキーとか）を暗号化/復号化するのに使ってる。
cursor開発は今のところいい感じ

Claude3.7がいい感じにデザインしてくれた&いい感じにコーディングしてくれたので、ほぼコーディングせずに開発できた。ただ、いったん動くものを作りたくて全然レビューはしていないので、いったんざっくりリファクタリングするフェーズは挟んだ方が良さそうな状況。

直近でgemini2.5proをcursorで使い始めた感じでは、Claude3.7よりも丁寧にコーディングしてくれそう&設計などに丁寧に対応してくれそうな印象なので、こっちをメインにして開発を進めていっても良さそう。

AI開発をもっと効率よくしていきたい

今回cursor（Claude3.7）と自作MCPでの開発を進めた感じ、悪くない印象だった。

なので、今の開発スタイルをブラッシュアップしつつ、他のMCPなども取り入れて、もっと開発効率を上げていきたい。現状、自作以外のMCPはGitHubのものしか使っていないので、最新ドキュメントを読み出すようなMCPサーバーとかがあれば取り入れていきたい。

あとは、MCPを通じて自作外部エージェントみたいなのを作って、そことやり取りして自律度を上げていくような仕組みもつくれたらいいなと思ってる。

最近Rulesに以下のような記述を追加したら、いい感じに次のアクションを提示してくれるから、これがさらにレビューして実行までしてくれるようになったら、いけそうだと思ってる。

3. 「am recom_cmd」をcmd-serverにprocess_commandツールで問い合わせてコマンド定義を取得する
4. 取得されたコマンド定義の内容を解釈し、その解釈に基づいて次のコマンド候補を、私がコピーペーストできる状態で提示する

recom_cmdの内容はこれ

## このコマンドで達成すること
今までの実行内容と成果物を確認し、要求を満たすという観点から考えた際に、次に実行すべきコマンドとして最適なものを、コマンドリストから検討し、ユーザーに提示すること。

利用なコマンドは、「list_commands」から取得すること。「list_commands」から取得できるコマンド以外は提示しないこと。推測しないこと。

## 出力
- 次に実行すべきコマンドの候補と、それぞれの候補の推奨度とその理由
おわり

🐻