stream chat angular

ストリーム チャット用の公式 Angular SDK

チャット アプリケーションを構築するためのサービスである Stream Chat の公式 Angular コンポーネント。

クイックリンク

• 登録してストリーム チャットの API キーを取得します
• Angular チャットのチュートリアル
• ドキュメント
• チャットUIキット
• デモアプリケーション
• コードサンドボックス

コンポーネント ライブラリを使用すると、次のようなさまざまなチャット ユース ケースを構築できます。

• オーバーウォッチやフォートナイトなどのゲーム内チャット
• Slackのようなチームスタイルのチャット
• WhatsApp や Facebook のメッセンジャーなどのメッセージング スタイルのチャット
• Drift や Intercom などのカスタマー サポート チャット

Angular チャットのチュートリアル

始めるための最良の方法は、Angular Chat チュートリアルに従うことです。この SDK を使用して完全に機能するチャット アプリケーションを構築する方法と、一般的なカスタマイズが含まれている方法を示します。

メーカーは無料

ストリームは、ほとんどの副業プロジェクトや趣味のプロジェクトに無料で利用できます。資格を得るには、プロジェクト/会社のチーム メンバーが 5 人以下で、月収が 10,000 ドル未満である必要があります。完全な料金と詳細については、チャット料金ページをご覧ください。

ドキュメント

このドキュメントでは、ライブラリ内のコンポーネントとサービスについて簡単に説明します。

Angular ライブラリは、stream-chat-js ライブラリを使用して作成されます。最も一般的な使用例では、当社のサービスはこのライブラリを適切に抽象化する必要がありますが、より高度なカスタマイズに必要になる場合があります。ドキュメントは当社の Web サイトにあります。

貢献する

このライブラリを改善したり、問題を修正したりするコード変更を歓迎します。 GitHub でプル リクエストを送信する前に、すべてのベスト プラクティスに従い、該当する場合はテストを追加してください。必要に応じて、コードを公式リポジトリにマージさせていただきます。最初に必ずコントリビューターライセンス契約 (CLA) に署名してください。詳細については、ライセンス ファイルを参照してください。

採用を行っております。

最近、3,800 万ドルのシリーズ B 資金調達ラウンドを完了し、積極的に成長しています。当社の API は 10 億人を超えるエンドユーザーによって使用されており、Stream で働くことで、非常に強力なエンジニアのチームに大きな影響を与えるチャンスがあります。

現在の募集を確認し、Stream の Web サイトから応募してください。

インストール

NPM を使用してインストールする

Angular 19 を使用している場合は、次のコマンドを実行します。

npm install stream-chat-angular stream-chat @ngx-translate/core@15 ngx-float-ui@19

サポートされている Angular バージョン: Angular 15 ～ 18

Angular 18 を使用している場合は、次のコマンドを実行します。

npm install stream-chat-angular stream-chat ngx-float-ui@18

Angular 17 を使用している場合は、次のコマンドを実行します。

npm install stream-chat-angular stream-chat ngx-float-ui@17

Angular 16 を使用している場合は、次のコマンドを実行します。

npm install stream-chat-angular stream-chat ngx-float-ui@16

Angular 15 を使用している場合は、次のコマンドを実行します。

npm install stream-chat-angular stream-chat @ngx-translate/core@14 ngx-float-ui@15

サポートされているノードのバージョン: 18+

サンプルアプリ

このリポジトリには、ライブラリをテストするためのサンプル アプリが含まれています。

アプリをテストするには:

次の内容を含む.envという名前のファイルをルート ディレクトリに作成します。

 STREAM_API_KEY=<Your API key>
STREAM_USER_ID=<Your user ID>
STREAM_USER_TOKEN=<Your user token>

テスト目的でトークンを生成する最も簡単な方法は、トークン ジェネレーターを使用することです。

npm install実行して依存関係をインストールします。

npm startを実行し、 http://localhost:4200/に移動します。

カスタマイズ例

このリポジトリには、SDK 内のさまざまなコンポーネントに独自のテンプレートを提供する方法を示すサンプル アプリが含まれています。

アプリを実行するには:

次の内容を含む.envという名前のファイルをルート ディレクトリに作成します。

 STREAM_API_KEY=<Your API key>
STREAM_USER_ID=<Your user ID>
STREAM_USER_TOKEN=<Your user token>

npm install実行して依存関係をインストールします。

npm run start:customizations-example実行し、 http://localhost:4200/に移動します。

地域発展

このリポジトリには、ライブラリをテストするためのサンプル アプリが含まれています。

アプリをテストするには:

次の内容を含む.envという名前のファイルをルート ディレクトリに作成します。

 STREAM_API_KEY=<Your API key>
STREAM_USER_ID=<Your user ID>
STREAM_USER_TOKEN=<Your user token>

プロジェクトのルートでnpm install実行します。 npm run start:devコマンドを使用すると、自動リロードで SampleApp を起動できます。