【自作アプリ】草野球の募集掲示板を作成してみた

Posted at 2025-01-21

はじめに

はじめまして、yamamotoooonと申します。
今回は個人製作アプリとして草野球の募集掲示板を作成しました。その中での技術選定やよかった点、また悪かった点などを記録としてまとめます。これがどなたかの参考になれば幸いです。

実際のURL

触ってみていただけると嬉しいです。

以下の理由で草野球の募集掲示板をテーマに選びました。

簡単なシステム構成図は上記の通りです。バックエンドとフロントエンドを分離し、デプロイ環境に適した設計を心掛けました。

個人製作において最も重要な課題の一つはコストだと思います。
理想はAWSやGCPでのホスティングでしたが、費用面で断念しました。そのため、既存のリソースを活用する方向で進めました。

選定理由
一度クローズドのWEBアプリを個人製作した際、さくらサーバーにLaravelをデプロイした経験がありました。さくらサーバーは既に契約しているので、ほかの言語触ってみたいという気持ちを押し殺し今回もバックエンドはLaravelに決めました。

さくらサーバーにLaravelをデプロイする際、参考にさせていただいた記事

振り返り
普段バックエンドはJavaばかり触っていて、PHPは久しぶりに触ったのでなかなか苦労しました。
言語やFWの特徴を考慮した設計が必要だと改めて実感しました。
サービスとリポジトリの依存度が高すぎる形になってしまったことが反省点です。(ソースもいずれ修正していきたいと思います)

選定理由
当時プロジェクトでVueを使用しており、スキルをさらに伸ばしたかったため。
TypeScriptを導入することで、型定義による開発効率向上を図ることができたため。
振り返り
せっかくなのでNuxtにしておけばよかったなと思いました。
あとは状態管理がうまくいっていないこと(修正したい)、
IPhoneで実機確認ができなかったためリリースしてからいくつか問題を発見しました。
CORSやsamesiteあたりにも苦しめさせられました。

productionブランチプッシュ時
さくらサーバーにSSHで接続し、pull
migrationファイルが追加された場合はartisan migrateを実行

こちらは別途記事を執筆したいなと考えています

チャット機能があったためwebsocketを使用するために使いました。
websocketは今まであまり触ったことがなかったので勉強になりました。

完全に理解した記事(理解していない)

ユーザビリティを考えたときにサードパーティーでのログインが1つは必要だと思いました。
個人的にも経験がなかったので勉強になりました。
自分で使ってみても便利だなと思ったので実装してよかったです。
toCのアプリであれば今の時代は必須なのかなと思います。

WEBプッシュ通知は実装したいと考えていたので、FCMを選びました。
ただ、safariではPWAインストール後ではないと使えないことや、PWAとしてインストールできるのかどうか視覚的にわかりにくい部分からiosでのPWAはまだ実用的ではないと感じました。

HTTP v1での実装について

触ったことのない技術などをモリモリに使ったのでかなり学びがありました。
スクラッチでの開発経験は少なめ、ない方にとっては個人開発を1度本気でやってみるのはありだと思います。
また、自分の好きなもの、作りたいものを作成できたので非常に楽しかったです。

知らない技術などが多かったため、後から見直すとあまりよろしくない実装が多々あります。
一応一般公開しているアプリとしては低いクオリティになってしまったことが反省点です。
もっとしっかりリサーチをすべきだったと思います。

だらだらとしたポエムになってしまいましたが読んでいただきありがとうございました。
これが誰かの個人開発の参考になってくれたらうれしいです！