1.概要
- サイト名: 日本まとめ地図
- URL: https://prod.jpn-map-status.com/
「日本地図ステータス」は、日本の各都道府県のさまざまな統計情報を視覚的に表示するウェブサイトです。このサイトは、次のような特徴を持っています。
- Leafletを使って視覚的に情報を表示しています。
- 地図ライブラリはフリーのleafletを使用しています。
- 各市区町村ごとにステータス１６段階色分け
- 平均年収・賃貸・人口密度・治安で順位づけしてます。
- 治安は1000人あたりの犯罪認知件数から算出
- ヘッダーのメニューから項目の切り替え
- 各地域をクリックすることで詳細を表示
- 具体的な数値を表示
情報元
政府統計ポータルe-Statと各都道府県の警察HPからデータを取得してまとめてます。
基本的には最新の令和5年（2023年）のデータを参考にしています。
2.背景
私は現在東京に住んでいますが、毎日の通勤ラッシュに疲れ果てています。満員電車でのストレスはかなりのもので、これが日常の一部であることに嫌気がさしてきました。独身で身軽なこともあり、地方への移住を真剣に考えるようになりました。
移住先を考えるにあたり、まずは各地域の治安や生活環境について調べ始めました。治安は特に重要なポイントで、各地域の犯罪率や安全性を知りたかったのです。しかし、ネットで情報を探してみても、散在しているデータを見比べるのは大変でした。「これを地図で見れたらもっと分かりやすいのにな」と思ったのが、このプロジェクトの始まりです。
どうせなら自分だけでなく、他の移住を考えている人や、地域の安全性に関心のある人たちにも役立つようなウェブサイトを作ろうと思い立ちました。そこで、各都道府県の統計情報を集めて視覚的に表示する「日本地図ステータス」というサイトを作ることにしました。このプロジェクトを通じて、地方移住を考える人々の参考になるデータベースを提供できればと思っています。
3.技術要素
フロントエンド
TypeScript, React, Next.js: フロントエンドの基盤にはTypeScriptとReactを使用し、Next.jsを用いてサーバーサイドレンダリングと静的サイト生成を実現しています。TypeScriptは静的型付け言語であり、コードの保守性と信頼性を向上させます。ReactとNext.jsは現在広く流行しているフレームワークであり、最新の技術トレンドを追求することで、開発効率を高めています。
状態管理
- ReactQuery
- データのフェッチ、キャッシュ、同期、更新の管理をシンプルにするためにReactQueryを使用しています。これにより、効率的なデータ管理とユーザー体験の向上が可能となります。特に、非同期データの取り扱いが容易で、リアルタイムデータの更新が求められる場面でその特性が非常に有効です。
- zustand
- 状態管理をシンプルかつ柔軟に行うためにzustandを採用しています。軽量で直感的なAPIを提供し、アプリケーションの状態を簡単に管理できます。シンプルな状態管理ライブラリとして、Reactコンポーネント間での状態の共有が容易です。
- 地図ライブラリ:
- react-leaflet: 地図表示にはreact-leafletを使用し、インタラクティブで使いやすい地図機能を提供しています。react-leafletはオープンソースでありながら高性能であり、ユーザーが地図上で直感的に情報を取得できるように設計されています。他の地図ライブラリと比較しても、機能とパフォーマンスのバランスが優れている点が選定の理由です。
バックエンド
- Golang, Gin
- バックエンドはGolangを使用して構築し、Ginフレームワークを用いて高パフォーマンスなAPIを提供しています。Golangはその高速な処理能力で知られており、大規模なデータ処理に適しています。
データベース
- PostgreSQL
- データの永続化にはPostgreSQLを使用しています。PostgreSQLは堅牢で拡張性があり、高いパフォーマンスを提供するオープンソースのリレーショナルデータベースです。
インフラ
- AWS
- インフラストラクチャはAWS上に構築されており、EC2インスタンスを使用してアプリケーションをホスティングしています。AWSは多くのサービスを提供しており、GitHub Actionsとの連携が容易です。これにより、継続的デプロイメントの設定や管理がシンプルになり、スムーズな運用が可能となります。
DevOps
- GithubActions
- 継続的インテグレーションとデプロイメントにはGithubActionsを使用しています。GithubActionsを使用することで、コードの変更が自動的にビルド、テスト、デプロイされるため、迅速なリリースサイクルを維持できます。特に、AWSとの連携が容易であるため、デプロイメントの自動化がスムーズに行える点が利点です。
4.まとめ
このプロジェクトは、僕自身の地方移住に向けた情報収集がきっかけで始まりました。でも、最終的には多くの人に役立つツールにしたいと思っています。これからもデータを更新したり、機能を追加したりして、どんどん改善していきますので、
もし興味があれば、ぜひサイトを見てみてください。そして、何か意見やフィードバックがあれば教えてください。皆さんの意見を参考に、さらに良いものにしていきたいと思います！