FoodlessMap

フードシェアリング・フードレスキューサービスの統合プラットフォーム

概要

FoodlessMap は、Androidモバイルアプリケーション と Web プラットフォームで構成される、食品を共有・救済するための地図ベースのサービスです。ユーザーは余った食品の情報（位置情報、店舗名、商品名、消費期限、価格など）をリアルタイムで投稿・共有できます。

主な機能

• リアルタイムマップ表示: Google Maps上に投稿された食品情報をピンで表示
• 食品情報の投稿: 位置情報、店舗名、商品名、消費期限、価格を入力して投稿
• リアルタイム同期: Socket.io を使用した複数クライアント間のリアルタイムデータ配信
• データ永続化: Firestore での投稿データの永続保存
• Firebase認証: Google認証対応

プロジェクト構成

FoodlessMap/
├── android/          # Android アプリケーション（Kotlin/Java）
│   ├── app/          # アプリメインモジュール
│   ├── build.gradle.kts
│   └── settings.gradle.kts
└── web/              # Node.js サーバ + Webクライアント
    ├── server.js     # Express.js サーバ
    ├── package.json
    └── public/       # フロントエンド（HTML/CSS/JavaScript）
        ├── index.html
        ├── login.html
        ├── app.js
        └── styles.css

技術スタック

Android

• 言語: Kotlin/Java
• 主なライブラリ:
  • Android Maps SDK for Google Maps
  • Firebase (Firestore, Authentication, Storage, Database)
  • AndroidX (AppCompat, Material Design)

Web

• バックエンド: Node.js + Express.js
• リアルタイム通信: Socket.io
• フロントエンド: HTML5, CSS3, JavaScript
• API統合: Google Maps JavaScript API
• BaaS: Firebase (Firestore, Authentication)

セットアップガイド

Android の準備

1. Android Studio でプロジェクトを開く

# プロジェクトディレクトリで
cd android

2. local.properties を設定

sdk.dir=C:\\Users\\[ユーザー名]\\AppData\\Local\\Android\\Sdk

3. Firebase設定

   • Firebase Console で新規プロジェクトを作成
   • android/app/google-services.json をダウンロードして配置

4. Gradle をビルド＆実行

./gradlew build
./gradlew installDebug

Web の準備

1. パッケージをインストール

cd web
npm install

2. .env ファイルを作成（ルート：web/.env）

GOOGLE_MAPS_API_KEY=your_google_maps_api_key_here
FIREBASE_API_KEY=your_firebase_api_key
FIREBASE_AUTH_DOMAIN=your_project.firebaseapp.com
FIREBASE_PROJECT_ID=your_project_id
FIREBASE_STORAGE_BUCKET=your_project.appspot.com

3. 開発サーバを起動

npm start          # 本番モード
npm run dev        # 開発モード (nodemon有効)

4. ブラウザで以下にアクセス
   • ログイン画面: http://localhost:3000/login.html
   • メイン画面: http://localhost:3000/index.html

使い方

Webプラットフォーム

1. ログイン

   • http://localhost:3000/login.html で表示名を入力
   • 「ログイン」ボタンをクリック（デモ用の簡易認証）

2. 食品情報の投稿

   • ログイン後、マップが表示されます
   • マップ上で投稿したい場所をクリック
   • フォームが表示されるので以下を入力:
     • 店舗・フロア名
     • 商品名
     • 消費期限
     • 価格
   • 「送信」ボタンをクリック

3. リアルタイム表示

   • 投稿されたデータが全クライアントのマップにピンで表示
   • 複数ユーザが接続している場合、即座に反映

Android アプリ

• Android端末から食品情報を投稿
• 詳細は android_send_sample.md を参照

API エンドポイント

POST /api/pins

食品情報を投稿する

リクエスト例:

{
  "lat": 35.6812,
  "lng": 139.7671,
  "storeName": "コンビニA",
  "productName": "おにぎり",
  "expiryDate": "2024-01-20",
  "price": 200
}