|
| 1 | +# 福井県観光ロケーション・トレンドレポート |
| 2 | + |
| 3 | +オンライン地図やウェブ検索ツールからのインプレッション数を集計・分析し、福井県の観光活動のトレンドを可視化するインタラクティブなWebアプリケーションです。 |
| 4 | + |
| 5 | +**[アプリケーションを開く](https://code4fukui.github.io/fukui-kanko-trend-report/)** |
| 6 | + |
| 7 | +## 主な機能 |
| 8 | + |
| 9 | +- **エリア別・県全体の集計**: 13の個別エリア、または福井県全体のデータを表示できます。 |
| 10 | +- **時系列分析**: 日別、週別、月別の粒度でデータを分析できます。 |
| 11 | +- **2期間比較**: 2つの異なる期間のトレンドを並べて比較できます。 |
| 12 | +- **包括的な指標**: 地図検索、Web検索、ルート検索、電話、Webサイトクリック、レビュー投稿、星評価のトレンドを可視化します。 |
| 13 | +- **データエクスポート**: 可視化されたデータをCSV形式でダウンロードし、さらに詳細な分析に活用できます。 |
| 14 | + |
| 15 | +## データソース |
| 16 | + |
| 17 | +本アプリケーションのデータは、Gitサブモジュールとして組み込まれている [fukui-kanko-trend-data](https://github.com/code4fukui/fukui-kanko-trend-data) リポジトリから取得しています。 |
| 18 | + |
| 19 | +- **形式**: CSV |
| 20 | +- **カラム**: `Date`, `Map Searches`, `Web Searches`, `Route Searches`, `Calls`, `Website Clicks`, `Reviews Submitted`, `5-Star Reviews`, `4-Star Reviews`, `3-Star Reviews`, `2-Star Reviews`, `1-Star Reviews`, `Average Rating` |
| 21 | +- **自動化**: GitHub Actionsのスケジュールワークフローにより、データは自動的に更新されます。 |
| 22 | + |
| 23 | +## 技術スタック |
| 24 | + |
| 25 | +- **フロントエンド**: React 19, TypeScript |
| 26 | +- **ビルドツール**: Vite |
| 27 | +- **スタイリング**: Tailwind CSS, shadcn/ui |
| 28 | +- **チャート**: Recharts |
| 29 | +- **状態管理**: React Context API |
| 30 | +- **パッケージマネージャー**: pnpm |
| 31 | + |
| 32 | +## はじめに |
| 33 | + |
| 34 | +### 前提条件 |
| 35 | + |
| 36 | +- Node.js 20.19+ または 22.12+ |
| 37 | +- Git |
| 38 | + |
| 39 | +### インストール手順 |
| 40 | + |
| 41 | +1. **リポジトリのクローン:** |
| 42 | + ```bash |
| 43 | + git clone https://github.com/code4fukui/fukui-kanko-trend-report.git |
| 44 | + cd fukui-kanko-trend-report |
| 45 | + ``` |
| 46 | + |
| 47 | +2. **Corepackの有効化とpnpmバージョンの設定:** |
| 48 | + CorepackはNode.jsとパッケージマネージャーの橋渡しをするスクリプトで、Node.js 16.9.0以降に標準で同梱されています。 |
| 49 | + ```bash |
| 50 | + corepack enable |
| 51 | + corepack use pnpm@10.11.0 |
| 52 | + ``` |
| 53 | + |
| 54 | +3. **データサブモジュールの初期化と依存関係のインストール:** |
| 55 | + ```bash |
| 56 | + git submodule update --init --recursive |
| 57 | + pnpm install |
| 58 | + ``` |
| 59 | + |
| 60 | +4. **開発サーバーの起動:** |
| 61 | + ```bash |
| 62 | + pnpm dev |
| 63 | + ``` |
| 64 | + ブラウザで `http://localhost:5173` を開きます。 |
| 65 | + |
| 66 | +## 利用可能なスクリプト |
| 67 | + |
| 68 | +| コマンド | 説明 | |
| 69 | +| --- | --- | |
| 70 | +| `pnpm dev` | 開発サーバーを起動します。 | |
| 71 | +| `pnpm build` | 本番環境用にアプリケーションをビルドします。 | |
| 72 | +| `pnpm preview` | 本番ビルドをローカルでプレビューします。 | |
| 73 | +| `pnpm lint` | ESLintを実行してコードの品質をチェックします。 | |
| 74 | + |
| 75 | +## デプロイ |
| 76 | + |
| 77 | +`main` ブランチに変更がプッシュされると、`.github/workflows/pages.yml` で定義されたワークフローにより、自動的にビルドされ GitHub Pages にデプロイされます。 |
| 78 | + |
| 79 | +## コントリビューション |
| 80 | + |
| 81 | +コントリビューションを歓迎します。既存のコードスタイルに従い、プルリクエストを送信してください。 |
| 82 | + |
| 83 | +## ライセンス |
| 84 | + |
| 85 | +このプロジェクトは MIT License のもとで公開されています。 |
| 86 | + |
| 87 | +--- |
| 88 | + |
| 89 | +保守・運用: [Code for FUKUI](https://github.com/code4fukui) |
0 commit comments