ReactJSとBack4Appを使ったSlackクローン – NoCode

この記事では、Back4AppをバックエンドとしてVercel上にSlackクローンアプリをデプロイする方法を紹介する。

SlackクローンアプリはReact（フロントエンド）とBack4App（バックエンド）で構築されており、Auth、リアルタイム、リレーショナルクエリなどのParseの主要な機能を使用しています。このアプリケーションは、以下の手順でVercel上にコードなしで簡単にデプロイすることができます。

いつでもこのボタンを使ってSlack CloneをVercelにデプロイすることができます：

Slackの概要

Slackは効果的で効率的なビジネスコミュニケーションアプリケーションであり、ビジネスコミュニケーションのニーズに応えるオールインワンプラットフォームとして使用できる。最も重要なのは、以下のような素晴らしい機能を提供していることです：

• リアルタイム・メッセージング

• ファイル・アーカイブ

• 検索

• ファイル共有など。

このプラットフォームは、特に現代のチームのために設計されています。そのため、チームはオンラインコミュニケーション全体を一つのスペースで管理することができる。さらに、ここでの会話は即座に検索可能で、どんなデバイスを使っていてもすぐにアクセスできる。

幸いなことに、Slackは1,500を超える外部サービスやアプリケーションと連携しており、可能な限り最高の方法で完全に柔軟で拡張可能なプラットフォームを提供している。

Slack・コミュニティ

Statistaによると、Slackは2019年10月現在、毎日1200万人以上のアクティブユーザーにサービスを提供している。Slackはアメリカのコラボレーションハブで、2013年の創業以来、ユーザーベースを大きく拡大している。

驚くべきことに、Slackユーザーの大半は、日本、フランス、ドイツ、イギリス、オーストラリアなどのトップ市場を含む、アメリカ国外から来ている。

それ以上に、Slackは2019年以降、有料ユーザーも大きくシフトしている。それは主に、チームコミュニケーションにおけるSlackの利便性がユーザーに支持されているからだ。また、Slackが持つチーム文化の向上に対する姿勢もある。

全体として、Slackの素晴らしい機能と利点は、Slackにお金を払っているユーザーベース全体を最高の形で向上させるのに役立っている。

Slackの特徴

Slackは、トピックごとに整理された永続的なチャットルーム、ダイレクトメッセージ、重要な議論のためのプライベートグループなど、様々なIRCスタイルの機能を提供してきた。最も重要なのは、会話であれファイルであれ、Slackで利用可能なコンテンツはすべて検索可能だということだ。

さらに、チャットに絵文字ボタンを入れることもできる。他のユーザーは絵文字をクリックしてリアクションすることができる。

それだけでなく、Slackの無料版でも必要な機能はすべて揃っている。最近の10,000件のメッセージからチャットやファイルを検索することもできる。さらに、Slackは可能な限り最高の方法でユーザー体験を向上させるためにプラットフォームを再設計した。

それに伴い、Slackの最も素晴らしい機能のいくつかを楽しむことができるようになりました。以下に、Slackのエキサイティングかつ重要な機能についてご紹介します。

それでは、どうぞ：

チーム

Slackのチームは、オーナーやチーム管理者が送る招待状によって、ワークスペースに参加することができる。このプラットフォームはビジネスコミュニケーションツールとして発展してきたが、時を経てコミュニティプラットフォームとして採用されるようになった。

統合

Slackはまた、Tello、Google Drive、Dropbox、GitHub、Crashlyticsなど、大量のサードパーティアプリやサービスとも統合している。Slackは、ユーザーがSlackソフトウェアディレクトリからこれらのアプリケーションを簡単にインストールできるようにしている。

メッセージング

パブリック・チャンネルは、グループSMSやEメールを使うことなく、チームの交流を可能にする。なぜなら、パブリック・チャンネルは職場の誰もが利用できるからだ。

しかし、プライベートな会話をするために、ユーザーはプライベートチャンネルを作成することができます。このチャンネルを使えば、より大きなチームを簡単に管理することもできる。

また、グループではなく、特定のユーザーにダイレクトメッセージを送ることもできます。

API

Slackはまた、ユーザーがアプリを作成し、人間の入力に基づいて自動的にメッセージを送信したり、特定の条件に対して通知アラートを送信したり、社内のサポートチケットを自動的に作成したりといったプロセスを自動化するためのAPIも提供している。

Slackクローンをデプロイする

Back4Appテンプレートをクローンする

Database HUBに行き、Slackテンプレートのバックエンドをクローンする。

鍵を手に入れる

Back4Appのダッシュボードで “App Settings -> Security & Keys “に移動し、アプリケーションIDとJavaScript Keyの値をコピーしてください。

リアルタイムを有効にする

App Settings -> Server Settings -> Server URL and Live Query “に移動します。無料のBack4Appサブドメインを有効にしてから、Live Queryを有効にしてください。Back4AppサブドメインのURLをコピーしてください。

Vercelへのデプロイ

下の展開ボタンをクリックしてください：

Vercelでは、前のステップでコピーした3つの変数を通知する必要があります：アプリケーションID、Javascriptキー、ライブクエリーURL（サブドメインURL）。

デプロイをクリックしてください。これでVercel上でSlackクローンアプリが動くようになった！

コード

デ・テンプレートをより深く理解したい方は、以下のリンクにアクセスしてください：

テクニカルガイド – Slackクローンテンプレートの仕組み

ReactJSコード – Javascript

タイプスクリプト・コード – タイプスクリプト

結論

この記事では、Slackの概要、コア機能、有料ユーザーについて説明した。また、Back4appやVercelのようなローコードツールを使ってSlackクローンアプリをデプロイする方法についても説明した。

よくあるご質問