Tokyo Friendliness App
こんにちは 👋
久しぶりに個人プロジェクトを公開します。
今回は、ちょっとユニークなテーマに取り組んでみました。
「日本の都道府県を、どうグループ分けすれば一番仲良くなれるのか?」
このアプリでは、都道府県同士の「友好度」を数値化した**friendliness table(友好度テーブル)**をもとに、
x,東京都,神奈川県,埼玉県,千葉県,茨城県,栃木県,群馬県,山梨県
東京都,-,20,10,10,50,-10,-10,10
神奈川県,-,-,-30,-30,10,10,30,10
埼玉県,-,-,-,-50,-20,20,20,-20
千葉県,-,-,-,-,10,-30,30,20
茨城県,-,-,-,-,-,-30,-30,-30
栃木県,-,-,-,-,-,-,-30,10
群馬県,-,-,-,-,-,-,-,10
山梨県,-,-,-,-,-,-,-,-
それぞれの関係性(ポジティブかネガティブか)を分析し、最大3グループに分けることで、
グループ内の総合的な友情スコアを最大化することを目指しています。
たとえば、東京都と神奈川県のスコアが高ければ、同じグループに入れるのが自然です。
一方で、埼玉県と千葉県のスコアがマイナスなら、別々のグループにした方が良いかもしれません。
ただし、組み合わせの数は膨大で、最適な分け方を見つけるのは簡単ではありません。
そこで登場するのが、今回自作した最適化アルゴリズムです。
このアルゴリズムは、すべての有効なグループ分け(最大3グループ)を探索し、
それぞれの「友情スコア」を計算したうえで、最も調和の取れたグループ構成を選び出します。
さらに、e-Stat API を使って首都圏の人口データを取得し、
最適化されたグループ構成に応じて、人口表に色分けを適用しています。
都道府県のマッチングを、数学と統計でやってみたような感じです。
🧠 アルゴリズムの仕組み
この最適化アルゴリズムでは、以下の3つの手法を組み合わせています:
- 動的計画法(Dynamic Programming with Memoization)
重複する部分問題の結果を記憶して再利用することで、計算の無駄を省き、処理時間を大幅に短縮します。 - 枝刈り(Branch-and-Bound Pruning)
現在の最良スコアを超えられないと判断された探索パスは、即座に打ち切ります。これにより、探索空間を効率的に削減できます。 - バックトラック(Backtracking)
一つずつ選択肢を試し、行き詰まったら一つ前に戻って別の選択肢を試すことで、すべての可能なグループ分けを網羅的に探索します。
アルゴリズムとしてはシンプルですが、組み合わせの爆発を抑えながら、最適なグループ構成を見つける工夫が詰まっています。
🌐 e-Stat APIによる人口データ取得
このアプリでは、最適化されたグループ構成に応じて、各都道府県の人口データを色分けして表示しています。
人口データは、**政府統計ポータル e-Stat API(ver3.0)**から取得しています。
Next.js 15のサーバーコンポーネントを活用することで、APIキーや生データをクライアントに露出させず、
安全かつキャッシュ可能な設計を実現しました。
### 🔧 実装概要
- **取得対象**: 都道府県別の人口推計(例: statsDataId = `0003412315`)
- **地域コード**: 東京 `13000`、神奈川 `14000`、埼玉 `11000`、千葉 `12000` など
- **取得方法**: `getStatsData.ts` にて `fetch` を使用(サーバーコンポーネント内)
- **キャッシュ戦略**: `force-cache` を指定し、低頻度更新に対応
### 🧪 データ処理フロー
1. APIリクエストを構築(appId, statsDataId, cdAreaを含む)
2. XMLレスポンスを `xml2js` でJSONに変換
3. 最新の人口値を抽出し、`PopulationMap` に整形
4. 最適化されたグループ構成に応じて、人口表に色分けを適用
🗂️ アプリ構成とデータの流れ
このアプリは、以下のような構成で動いています:
🚀 ローカルで試すに
git clone https://github.com/your-repo/tokyo-friendliness-app
npm install
npm run dev
🌐 デプロイ環境
このアプリは AWS Amplify を使ってオンライン公開しています:
🔗 公開ページはこちら
SSR computeブランチからの自動ビルド- SSR(サーバーサイドレンダリング)と静的コンテンツの両方に対応
- 環境変数は安全に管理
✅ Lighthouse監査結果
Chrome DevTools の Lighthouse を使って監査した結果、すべて満点でした。
技術的にも、品質の高い仕上がりになっています。