GiraMatch

https://github.com/TaiyoYamada

Next.js

GitHub

DynamoDB

Node.js

Lambda

スタジアムで新しい仲間とつながる観戦マッチングアプリ

森本鉄平

山田大陽

推しアイデア

同じチームを応援する仲間が、試合前から試合後までつながれるファンアプリ。試合後は「ギラ飲み」によって感想を熱く語れます。

作った背景

地域密着型チームのファン創出には、人と人のつながりが欠かせないと感じた。ファン同士の関わりを通じて、地域全体に広がるコミュニティを育てたいと思った。

推し技術

ChatGPT: CI/CDで自動デプロイを構築し、サーバーレスと無料枠でインフラ管理を効率化。Dockerで開発環境を統一し、dev・local・prodを短期で整備。チャットはリアルタイム通信対応。

プロジェクト詳細

はじめに

これは「ギラ飲み」という食事会(飲み会)のマatchingを目的としたウェブアプリケーションです。 ユーザーは飲み会の募集を作成したり、他のユーザーの募集に参加リクエストを送ることができます。 マッチング後はチャット機能を通じてコミュニケーションをとり、開催後には相互レビューが可能です。

リポジトリ

https://github.com/sewii-men/hakkutsu-app

アプリの流れ

  1. ユーザー登録・ログイン: アプリケーションを利用するためのアカウントを作成し、ログインします。 image
  2. 募集・応募: 飲み会(ギラ飲み)の募集を作成するか、気になる募集に応募します。image
  3. マッチング成立: 募集者が応募を承認するとマッチングが成立します。
  4. チャット: マッチングした相手と専用のチャットルームで日程や場所の詳細を調整します。
  5. ギラ飲み: 試合終了後に開かれるチャットから一緒に飲みに行く人を探しますimage

ギラ飲みのススメ

  • 気の合う仲間と気軽に飲みに行ける
  • 新しい出会いの場が広がる
  • お店探しの手間が省ける

使用技術

フロントエンド

  • Next.js (v15)
  • React (v19)
  • TypeScript
  • Tailwind CSS (v4)
  • React Google Maps API

バックエンド

  • Node.js (v20.x)
  • Express
  • JSON Web Tokens (JWT)
  • bcryptjs

インフラ

  • AWS SAM (Serverless Application Model)
  • AWS Lambda
  • AWS API Gateway
  • AWS DynamoDB
  • Docker / Docker Compose (ローカル開発用)
  • GitHub Actions (CI/CD)

アーキテクチャ

image

苦労したところ

  • サーバレス構成のデプロイを簡単にするツール(Serverless Framework)の最新バージョンでデプロイがうまくいかなくて、結構ギリギリでAWS SAMに切り替えました。
  • AWSは初めてで、コンソールの操作に慣れるまで時間がかかりました。
  • CI/CD を初めて導入し、特にフロントエンド側でのビルドエラーやテストエラーが多くて苦しめられました。
  • vercelの無料プランの制限がきてしまって、仕方なくdev環境のCI/CDは走らないようにしました。

森本鉄平

@7eee76c68cd7b738