🌎

【個人開発】オンラインの作業部屋を提供するサービスを作った

2024/11/03に公開

皆さんは自宅で作業に集中できるタイプですか?
私は全然できません。よく図書館に行って作業しています。
ただ、図書館は開館時間が短いし、移動するのがめんどくさい。
そこでウェブ上の作業室を作ってみました。

ウェブ上のコワーキングスペース、略してウェブコワ。
ウェブコワではどこかのだれかとビデオ通話(音声はミュート)でつながり一緒に勉強ができます。
ぜひ使ってみてください。
https://web-co-working-landing.web.app/

ウェブコワでできること

どこかのだれかと一緒に作業できます

どこかのだれかとビデオ通話を通して一緒に作業できます(音声はミュート)
図書館やカフェにいるような、「適度な監視されている感覚」によって作業に集中できます

作業の履歴を記録できます

過去の作業時間をGithub風のヒートマップで確認できます。
努力を可視化することで、さらなるモチベーションアップにつながります.

技術的な話

以下を使用しました。

  • フレームワーク:Flutter
    • 状態管理:Riverpod
    • 画面遷移:go_router
    • ビデオ通話:flutter_webrtc
      など
  • バックエンド
    • Firebase:ユーザデータ保管、Authentication、シグナリングサーバ

フレームワークにはFlutterを使用しています。
将来的にモバイルアプリ版も作ってみたいと思い、Flutterを選びました。
(ただ、今はWebアプリ版のみです。)

ビデオ通話はflutter_webrtcというライブラリを使用しています。
flutter_webrtcはflutterでWebRTCを簡単に使用できるライブラリです。
WebRTCとはp2p(サーバレスの通信)で通信できる規格です。
WebRTCの仕組みの詳細については以下が分かりやすいです。
https://skyway.ntt.com/blog/entry/webrtc

WebRTCにはシグナリングサーバが必要です。(p2p通信はサーバーレスって聞いていたのに...)
今回、シグナリングサーバとしてFirestoreを利用しています。

最後に

初めて個人開発でWebアプリを作りました。
まともに動作確認もできていないのでバグが多発すると思われます。
バグを見つけたら、この記事のコメントかGoogle Forms(Webアプリ内にリンクを貼っています)からご報告いただけると
助かります!

Discussion