目次
1. 概要
2. 背景
3. 技術スタック
4. アプリの詳細
5. GitHubリポジトリ
6. まとめ
はじめに
このアプリはGolangとWebsocketによる双方向通信を学びたいというモチベーションのもと、唐突な思いつきで作成したアプリです。(現在もまだ修正中。最終的には一時的にでもデプロイしたい。)
やさしい目で見てもらえると嬉しいです。
とりあえずアプリの発信のために本記事を書いてます。
(※使用する場合はリポジトリの注意書きを参照して下さい。)
また双方向通信やGolangについてはまた別でまとめられればと思ってます。
(現状あまりやる気が...)
1. 概要
みなさん、こんな経験ないですか?
学校で、授業中寝てる友達に先生が気づくように、音を立てて先生の注目を引いたりして、どうにか友達をチクりたい!
みたいな経験ありませんか?(周りにはないと言われてしまった...)
そんなふざけ合いや、チクリ合いをアプリという形で行えるものになります!
2. 背景
初めはただただGolangとWebsocketを触ってみたいというモチベーションからはじまりました。
僕は何か新しい言語やライブラリ、技術を触る際は実際にやってみる。とりあえず何か作ってみるというのが性に合っているので今回もとりあえず何か作ってみるか精神でした。
ただチャットアプリなどはあり触れてたのでもう少し違うものが作りたいとなり今回のアプリを作成しました。
3. 技術スタック
大まかなスタックは以下の通りです。(詳細はリポジトリを見てみて下さい。)
-
Frontend
- TypeScript
- Next.js
- React
- Recoil
- Websocket client
- daisyUI!
-
Backend
- Golang
- gin
- gorilla/websocket
- Swaggo
4. アプリの詳細
まずは以下のホーム画面で自身の座席番号を入力してログインします。
ログイン後は以下の画面に遷移します。
基本的にアプリからのメッセージや通知はサイドにあるヒストリーにて表示されます。
その後は同様にログインしている他の席の人の席番号を指定して密告ボタンを押すことで密告対象とされたユーザーの画面にモーダルが表示されます。
この密告し、対象ユーザーにモーダルを出す部分や密告する部分にてWebsocket通信を用いています。
タイムオーバーになった場合は、以下の画像のように接続されている密告対象以外のユーザーへ寝ていることがブロードキャストされてしまいます。😱
(通知はサイドにあるヒストリーにて表示されるが、いずれはタイマーオンを鳴らすなどを検討したい)
5. GitHubリポジトリ
よかったらリポジトリも覗いてみて下さい。
(あまり参考にはなりません...)
6. まとめ
今回はGolang、Websocket通信を触りたいから始まり、よくわからんアプリを作るまでのお話でした。
まだまだバグや未完成部分が多いことやコードが汚すぎるのでこれから直しつつ、できればデプロイまでしてみなさんに遊んでいただけるようにしたいです。
(できるように頑張れ、わい)
また、中身のGolang、Websocketについてはまた別でまとめたいと考えてます。
(気が向いた時にやるお)
ここまで読んでくださった方、長々とお付き合いありがとうございました。
(何かあればコメントください。)