stream chat react
v12.8.1
Komponen reaksi resmi untuk obrolan stream, layanan untuk membangun aplikasi obrolan.
Tautan cepat
Dengan pustaka komponen kami, Anda dapat membangun berbagai kasus penggunaan obrolan, termasuk:
Cara terbaik untuk memulai adalah dengan mengikuti tutorial obrolan React. Ini menunjukkan kepada Anda cara menggunakan SDK ini untuk membangun aplikasi obrolan yang berfungsi penuh dan termasuk kustomisasi umum.
Stream gratis untuk sebagian besar proyek sisi dan hobi. Untuk memenuhi syarat, proyek/perusahaan Anda harus memiliki tidak lebih dari 5 anggota tim dan mendapatkan kurang dari $ 10 ribu dalam pendapatan bulanan. Untuk harga dan detail lengkap, kunjungi halaman harga obrolan kami.
npm install react react-dom stream-chat stream-chat-react
yarn add react react-dom stream-chat stream-chat-react
<script src="https://cdn.jsdelivr.net/npm/[email protected]/umd/react.production.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/react-dom@16/umd/react-dom.production.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/stream-chat"></script>
<script src="https://cdn.jsdelivr.net/npm/stream-chat-react"></script>
Kami telah membangun lima aplikasi demo yang menampilkan berbagai kasus penggunaan obrolan, termasuk pesan sosial, kolaborasi tim, dukungan pelanggan, permainan langsung, dan acara virtual. Anda dapat melihat pratinjau demo ini di situs web kami. Juga, kode ini open source.
Kami menggunakan generator DOC untuk membangun dokumentasi komponen kami. Kami memberikan deskripsi singkat tentang setiap komponen obrolan dan mendefinisikan semua alat peraga yang diterimanya.
Komponen React dibuat menggunakan perpustakaan stream-chat-js. Jika Anda menyesuaikan komponen, kemungkinan Anda perlu melakukan panggilan tambahan ke API obrolan kami menggunakan klien JavaScript kami, yang memiliki dokumentasi di situs web kami.
Pada versi 5.0.0 , pustaka komponen telah dikonversi ke TypeScript. Harap baca panduan TypeScript untuk detail dan bantuan implementasi.
Untuk komponen yang menerapkan logika yang signifikan, akan sangat membantu untuk membagi komponen menjadi dua bagian: komponen tingkat atas yang menangani fungsionalitas dan komponen tingkat bawah yang membuat UI. Dengan cara ini Anda dapat bertukar UI tanpa mengubah logika yang memberikan komponen fungsionalitasnya. Kami sering menggunakan pola penyedia/konsumen ini di perpustakaan, dan contoh di bawah ini menunjukkan cara menukar komponen UI Message dengan MessageTeam , tanpa mempengaruhi logika apa pun di aplikasi.
< Channel Message = { MessageTeam } >
< Window >
< ChannelHeader />
< MessageList />
< MessageInput />
</ Window >
< Thread />
</ Channel >Metode yang disukai untuk mengesampingkan gaya yang telah ditentukan sebelumnya di perpustakaan adalah untuk proses dua langkah. Pertama, impor CSS yang dibundel ke file tempat Anda membuat aplikasi obrolan Anda. Kedua, temukan gaya aliran apa pun yang ingin Anda ganti menggunakan inspektur browser atau dengan melihat kode perpustakaan. Anda kemudian dapat menambahkan pemilih ke file CSS lokal Anda untuk mengesampingkan default kami. Misalnya:
import 'stream-chat-react/dist/css/v2/index.css' ;
import './App.css' ; Perpustakaan kami mendukung translasi otomatis untuk berbagai bahasa pengguna. Harap baca dokumentasi internasionalisasi kami untuk perincian lebih lanjut dan panduan pengaturan.
Kami menyambut perubahan kode yang meningkatkan perpustakaan ini atau memperbaiki masalah. Pastikan untuk mengikuti semua praktik terbaik dan menambahkan tes, jika berlaku, sebelum mengirimkan permintaan tarik di GitHub. Kami senang menggabungkan kode Anda ke dalam repositori resmi jika memenuhi kebutuhan. Pastikan untuk menandatangani Perjanjian Lisensi Kontributor (CLA) kami terlebih dahulu. Lihat file lisensi kami untuk lebih jelasnya.
Kami baru -baru ini menutup putaran pendanaan Seri B $ 38 juta dan berkembang secara aktif. API kami digunakan oleh lebih dari satu miliar pengguna akhir, dan dengan bekerja di streaming, Anda memiliki kesempatan untuk membuat dampak besar pada tim insinyur yang sangat kuat.
Lihatlah pembukaan kami saat ini dan terapkan melalui situs web Stream.
Proyek ini menggunakan perpustakaan lamejs di bawah lisensi LGPL untuk mengonversi format audio ke MP3 yang direkam. Kode sumber perpustakaan diimpor secara dinamis dan hanya digunakan jika perekaman audio diaktifkan.
Anda dapat memperoleh kode sumber untuk lamejs dari repositori Lamejs yang merupakan garpu dari perpustakaan JS asli. Anda dapat menemukan kode sumber untuk timpang di https://lame.sourceforge.net dan lisensi di: https://lame.sourceforge.net/license.txt
