リアルタイムアプリを作る
双方向通信と共有状態を分け、切断や再接続を前提に設計します。
代表的な構成
唯一の正解ではなく、理解しやすい出発点です。
- 01
JavaScriptへ静的な型検査を加えるプログラミング言語。
- 02
状態に応じた画面をコンポーネントで組み立てるUIライブラリ。
- 03
ブラウザ外でJavaScriptを動かす代表的な実行環境。
- 04
クライアントとサーバーが双方向通信を続けるWeb プロトコル。
- 05
メモリ中心で高速にデータ構造を扱うキー値データベース。
- 06
標準SQLと拡張性に強いオープンソースリレーショナル DB。
なぜこの構成？
- WebSocketでサーバーとブラウザの双方向通信を維持できる。
- Redisを使うと、複数サーバー間の一時的な通知を中継できる。
- PostgreSQLには、失ってはいけない確定データを保存できる。
向かない場面
- 常時接続は通常のHTTP要求より、障害時の再接続と監視が複雑になる。
- 更新頻度が低い画面なら、一定間隔の取得やSSEの方が簡単に保てる。
別ルートもある
- サーバーからの一方向通知だけなら、SSEで接続管理を簡素化する。
- 同期基盤を自前で運用しないなら、FirebaseやConvexを利用する。