【ITニュース解説】I have created a whatsapp and facebook like social gaming platform

2025年09月04日に「Dev.to」が公開したITニュース「I have created a whatsapp and facebook like social gaming platform」について初心者にもわかりやすいように丁寧に解説しています。

作成日: 更新日:

ITニュース概要

ウガンダの21歳独学エンジニアが、チャットとゲームを融合したSNSプラットフォームを2.5ヶ月で開発。リアルタイムメッセージや自作ゲームを販売できるマーケットプレイス機能を搭載し、バックエンドにSupabase、フロントにReactを採用した。

ITニュース解説

アフリカのウガンダに住む21歳の独学エンジニアが、わずか2.5ヶ月で多機能なソーシャルゲーミングプラットフォームを開発した。このプラットフォームは、日常的なコミュニケーションツールであるWhatsAppやFacebookの機能と、ゲームの要素を融合させたユニークなアプリケーションである。開発の動機は純粋な好奇心からであり、長い休暇期間を利用して個人のプロジェクトとして進められた。この事例は、現代のWeb開発で利用可能なツールを組み合わせることで、個人でもいかに迅速に複雑なサービスを構築できるかを示す好例である。

このアプリケーションは「モバイルファースト」という設計思想に基づいて作られている。これは、開発の初期段階からスマートフォンでの利用を最優先に考え、画面デザインや操作性を最適化するアプローチである。現代のユーザーが主にモバイル端末からインターネットを利用する実情に即した、合理的な開発方針と言える。プラットフォームの核となる機能は、リアルタイムのメッセージング機能だ。ユーザーは一対一、またはグループでテキストチャットを楽しむことができる。これに加えて、Facebookのようなコメントセクションや、WhatsAppのステータス機能に似たコンテンツ投稿機能も実装されている。ユーザーはテキスト、画像、動画を投稿して自分の近況を共有できる。特に動画投稿においては、アップロード後に自動でファイルが圧縮される仕組みが導入されており、ユーザーのデータ通信量の削減や表示速度の向上に貢献している。

このプラットフォームが単なるSNSと一線を画すのは、ゲームを中心としたエコシステムを備えている点である。アプリ内にはマーケットプレイスが設けられており、開発者自身が作成したHTML5ゲームやAndroidゲームが販売されている。ユーザーはチャットの合間にゲームをプレイしたり、新しいゲームを購入したりすることができる。これは「チャットする相手がいない時や、チャットする気分ではない時でも楽しめるソーシャル空間」というコンセプトを具現化したものである。将来的には、ゲームランチャーとしての役割も担うことが想定されている。決済システムも実装されており、ウガンダ国内では一般的なモバイルマネー、国外のユーザーはクレジットカードを利用してゲームを購入することが可能だ。

この多機能なアプリケーションを短期間で実現するために、最新の技術スタックが戦略的に採用されている。ユーザーが直接触れる画面部分、すなわちフロントエンドは、JavaScriptライブラリであるReactを用いて構築された。ReactはUIを「コンポーネント」という独立した部品の組み合わせとして作るため、複雑な画面でも効率的に開発・管理できる特徴を持つ。さらに、デザインを整えるためにReact BootstrapやFont Awesomeといったツールが利用されている。特筆すべきは、メッセージ履歴や投稿一覧といった大量のデータをリスト表示する際に、パフォーマンスを最適化する「React Window」というライブラリが使われている点である。これにより、画面に表示されている部分だけを描画するため、アプリケーション全体の動作が軽快に保たれる。

一方、アプリケーションの裏側を支えるバックエンドとデータベースには、SupabaseというBaaS (Backend as a Service) が採用された。BaaSは、データベース、ユーザー認証、リアルタイム通信といったサーバーサイドの機能をクラウドサービスとして提供するものであり、開発者はこれらの機能をAPI経由で呼び出すだけで利用できる。本来であれば複雑なサーバー構築が必要な機能をサービスとして利用することで、開発者はフロントエンドの開発に集中でき、開発期間を大幅に短縮することが可能になる。このプロジェクトがわずか2.5ヶ月で実現できた大きな要因の一つが、このSupabaseの活用である。

ユーザーが投稿した画像や動画などのメディアファイルの保存先には、Cloudinaryというクラウドストレージサービスが利用されている。これにより、大容量のファイルも効率的に管理し、ユーザーに高速で配信することができる。また、前述した動画の圧縮処理は、FFmpegというソフトウェアをGitHub Actionsという仕組みを通じて自動実行することで実現している。GitHub Actionsは、特定のアクション(例えば、リポジトリへのコードのプッシュや、今回のケースのようなファイルのアップロード)をきっかけに、あらかじめ定義された処理を自動で実行するサービスだ。これにより、手動での作業を介さずに、投稿された動画を最適な形式に変換するプロセスが自動化されている。

現在、このプラットフォームは実験的にGitHub Pagesでホスティングされているが、これは本来、動的なアプリケーションを動かすためのサービスではない。今後、サービスが本格的にスケールしていく段階では、より適切なホスティング環境への移行が検討されるだろう。このプロジェクトは、アイデアを形にするために既存の優れたサービスやツールをいかにうまく組み合わせるかという、現代的なソフトウェア開発の縮図を示している。システムエンジニアを目指す者にとって、フロントエンドからバックエンド、インフラに至るまで、各技術要素がどのように連携して一つのサービスを構成しているのかを具体的に理解するための、非常に価値ある学習教材となるだろう。

関連コンテンツ

【ITニュース解説】I have created a whatsapp and facebook like social gaming platform | いっしー@Webエンジニア