チャットアプリ – RamyaChat作成の備忘録
2月に自宅サーバーにこのブログ等を引っ越したけど、サーバーに余力があるのでふと思い立ち、試しにチャットアプリを作る事にしたのがきっかけなのです。
本当は音声通話まで実装してアップしたかったけれど、少し手間がかかるので次回に持ち越し！
自宅サーバーの役割はIPとIPを紐づけるだけで、端末間でP2Pで匿名で通話ができるのが特徴の技術、まぁテンプレ使うだけなのだけど、一旦アップしました。
QRコードで友達追加もできます♪
※ 因みに音声通話のテンプレはこれ👇です。
- WebRTC (Web Real-Time Communication)
- 「STUNサーバー」もしくは「TURNサーバー」
主な機能と特徴
主な機能と特徴を簡単に紹介します。
📞 電話番号は不要！IDとQRで繋がる安心設計
スマホの連絡先を勝手に同期するような機能なく、専用のユーザーID（@ID）やQRコードを使って、本当に繋がりたい相手とだけ繋がるプライバシー重視の設計。
💬 テキストも、画像も、音声も！サクサクやり取り
シンプルで高速なリアルタイムチャット。
写真と音声メッセージ、各種ファイルの送信に対応（最大10MBまで）しているので、伝えたいことをサクサク共有できます。
画像やPDFなどのファイル（10MBまで）や音声も録音して送れます。
🌐 アプリでもブラウザでも！シームレスな体験
スマホアプリだけでなく、PCやスマホのブラウザからインストール不要で使える「Web版」も用意してます。
※ 実はこのブログのドメインのサブドメインです。
家でも外でも、環境に合わせて使い分けられます！
🎨 迷わず使えるシンプルUI（ダークテーマ対応）
ごちゃごちゃした複雑な機能を削ぎ落とし、誰でも直感的に使えるデザインに仕上げました。
目に優しいダークテーマへの切り替えもワンタップで可能です。
🌍 多言語対応！アプリ内でサクッと切り替え
日本語はもちろん、英語やフランス語、ヒンディー語など多数の言語に対応。
スマホの本体設定を変えなくても、アプリ内の設定からいつでも好きな言語に切り替え可能です。
🛡️ いつでも「やめられる」クリーンな自己管理
もし使わなくなっても、アプリ内の設定からいつでも即座に、自分の手でアカウントや関連データを完全に削除できます。
また、アカウント認証の裏側にはGoogleの「Firebase」を採用しており、セキュアで透明性の高い設計になっています。
「とりあえず試してみる」がしやすいアプリです。
🛡️ 迷惑ユーザー対策もバッチリ！安心のブロック・通報機能
誰もが気持ちよく、安全にコミュニケーションを楽しめる環境を目指しています。
万が一、不適切なユーザーや不快なメッセージに遭遇しても、ブロックや通報機能ですぐにシャットアウトできるので安心です。
Google等の審査では必須というのもあるけれど、実際スパム放置してるチャットアプリは使いたくないわよね。
🛠️ 少しだけ裏話：RamyaChatを支える技術たち
「アプリの裏側ってどうなってるの？」という方向けに、開発に使った技術を少しだけご紹介！
専門用語が苦手な方でも雰囲気が伝わるように、簡単に身近なもので例えてみました！
📱 アプリの店舗デザイン：React Native
通常、スマホアプリは「iPhone」と「Android」で別々の言語を使って２回作る必要があります。
でもこの「React Native」を使えば、１つの共通言語で両方のアプリをいっぺんに作れるのです。
サクサク動く画面の裏側は、この技術で構築されています。
あ、Web版もこれで書き出して作っています。
🗄️ 頑丈な地下金庫：PostgreSQL
みなさんの大切なメッセージデータを保管する「データベース」です。
世界中の大企業も使っている超本格的なシステムで、データが迷子にならないよう、きっちり整理整頓して守ってくれる頼もしい金庫番です。
🛡️ 鉄壁のセキュリティゲート：Firebase (Google)
ユーザーのログイン認証などを担当。
セキュリティの要となる部分は、Googleの強固なシステムを借りることで、大手アプリと遜色のない安全性を確保しています。
まぁ丸投げって事ですけれどね
💻 魔法の作業台：VS Code
RamyaChatのすべてのプログラム（コード）を書くために使った、最強のテキストエディタです。
この作業台の上で、アプリの形を作っていきました。
因みにこのVS CodeはMicroSoft謹製のソフトで、プラグインを使って色々な事が出来る万能エディタといっても過言ではありません。
プログラミング以外でも使えるので、興味がある方は調べてみてくださいね！
⚡ 超速のテスト環境：Expo
React Nativeでの開発を爆速にしてくれる強力な助っ人ツールです。
「コードを直したら、手元のスマホですぐに動かして確認する」という魔法のようなテスト環境を作ってくれます。
また、クラウド経由でiOSのソフトもビルドできる機能もあります。
※ ただ実機での動作確認は当然必須なので、iOS版はまた気が向いたらアップします。
🏭 アプリの最終組み立て工場：Android Studio
VS Codeで書いたコードを、Androidスマホで実際にインストールできる「アプリ（App Bundle）」の形にガチャン！と変換・パッケージングしてくれる巨大な工場です。
因みにうぷ主はImage Assetで、ストアのアイコンや通知のアイコンを一発で作ってくれる機能がお気に入りです。
🏠 全ての司令塔：自宅サーバー
冒頭でも少し触れたけれど、N100搭載のミニPCが今回のメイン拠点！
クラウドの便利なサービス（Firebase）と組み合わせつつ、中核となる部分は自宅のサーバーが「秘密基地」として24時間バリバリ働いてくれています。
まとめとつぶやき
さて、アプリやストアの制作者にRatoLabと出てるのは単純に屋号ですので、気にしないでくださいｗ
※ うぷ主一人でやってます。
あと、Ramya、RamyaParryk（ラミヤ、ラムヤパリーク）の名前ですが、ApexLegendsのキャラにRampartってのがいるんですよね。
それが由来ですｗ
AIでApexと仮想通貨と、進撃の巨人の世界観を交えて作ってとむちゃ振りしてできたのがキャッチアイに出ているキャラクターですｗ
それでは最後に、RamyaChatへのリンクを張りますので、よければ試してみて下さいね！
因みに電話番号認証なしにした理由ですが、無料ではなくGoogle先生にお金を都度払うので、無理！というのも理由の一つです。
※ しかも日本は1通10円程度！！(ソース：Identity Platform の料金)
うぷ主いわく、
ポジティブな表現にすると、プライバシー重視の設計ってなりましたとさ。
👇 スマホアプリ版（Android）のダウンロードはこちらから！
※ アプリ版のダウンロードリンクは、Google Playの審査が通り次第ここに追記します！
最近のアプリストアは、個人情報の扱いやデータ削除処理の実装など、審査がすごく厳しいのです…(当然ですよね)。
無事に公開されるまで、まずは下の「Web版」で遊んでみてください！
💻 インストール不要！PCやスマホのブラウザですぐ使えるWeb版はこちら
つぶやき
さて、春になり大学の3年次の授業が始まるので、ネットで受講できるとはいえ、また時間が取れなくなりそうですが、今年はゆとりを取れるよう努力しようと思います。
※ 大したこと学んでないし、受講するだけで精いっぱいですが。
でゎでゎ！
コメント