「キャップ野球情報局」に使っている技術
キャップ野球情報局とは
まだマイナースポーツですが、ペットボトルのキャップを打つ野球競技「キャップ野球」の試合や大会、練習会、チーム情報などを掲載しているWEBサービスです。2019年12月に運用開始しました。
システム構成
フロントエンド
Netlify
GitHubにコードをpushすると、Netlifyでビルドが走るようになっています。
NextJS
2020年5月にReactJSからNextJSへ移植しました。
NextJSは基本的にstatic exportを使っています。
別システム「みんなのSCORE」や別サービス「パワプロジェネレータ」のデータを連携させて表示させています。
firebase
2020年6月のversion 2.0からログイン機能を実装し、ユーザ認証にfirebaseを使用しています。
サーバサイド
nginx
コンテナにするとLet's Encryptの更新周りが面倒だったので単体のnginxを使っています。
docker-compose
もともと、2019年12月の運用開始時は別システムである「みんなのSCORE」のデータを主に使用していました。version2になった現在は、独自のデータベースを持った上で「みんなのSCORE」と連携しています。
NodeJS
Typescriptを使用しています。様々なデータの処理を行っています。
MySQL
最近絵文字に対応しました。
Vercel/puppeteer
主にパワプロジェネレータなどのOGP生成に使っています。
選手カードの合成を行って画像として保存したりしています。
Cloudinary
画像保存・リサイズなどの変換サービス。
imgurと迷った経緯がありますが、最終的にユーティリティが充実しているこちらにしました。
slack
全てではないですが、ユーザの情報更新などを通知するようにしています。
外部システム
みんなのSCORE
2015年6月から開発している成績管理(スコア入力)を行うシステム。
メインがReactJS、firebaseとcloudinaryを使っていないところを除けばほぼ同じ構成です。
パワプロジェネレータ
2020年3月リリース。
フロントエンドは分離していますが、みんなのSCOREとバックエンドを共有するサービスです。
今後の展望
死活監視やエラーログ収集はそのうち入れたいなと思いつつ、あまり着手できていません。
Discussion