stream chat react
v12.8.1
Los componentes oficiales React para el chat de transmisión, un servicio para crear aplicaciones de chat.
Enlaces rápidos
Con nuestra biblioteca de componentes, puede construir una variedad de casos de uso de chat, que incluyen:
La mejor manera de comenzar es seguir el tutorial de chat React. Le muestra cómo usar este SDK para crear una aplicación de chat completamente funcional e incluye personalizaciones comunes.
La transmisión es gratuita para la mayoría de los proyectos laterales y de pasatiempos. Para calificar, su proyecto/empresa no debe tener más de 5 miembros del equipo y ganar menos de $ 10k en ingresos mensuales. Para obtener precios y detalles completos, visite nuestra página de precios de chat.
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>
Hemos creado cinco aplicaciones de demostración que muestran una variedad de casos de uso de chat, que incluyen mensajes sociales, colaboración en equipo, atención al cliente, juegos en vivo y evento virtual. Puede obtener una vista previa de estas demostraciones en nuestro sitio web. Además, el código es de código abierto.
Utilizamos un generador DOC para construir nuestra documentación de componentes. Proporcionamos una breve descripción de cada componente de chat y definimos todos los accesorios que acepta.
Los componentes React se crean utilizando la biblioteca Stream-Chat-JS. Si está personalizando los componentes, es probable que deba hacer llamadas adicionales a nuestra API de chat utilizando nuestro cliente JavaScript, que tiene documentación en nuestro sitio web.
A partir de la versión 5.0.0 , la biblioteca de componentes se ha convertido en mecanografiado. Lea la Guía TypeScript para obtener detalles y asistencia de implementación.
Para los componentes que implementan una lógica significativa, es útil dividir el componente en dos partes: un componente de nivel superior que maneja la funcionalidad y un componente de nivel inferior que representa la interfaz de usuario. De esta manera, puede cambiar la interfaz de usuario sin alterar la lógica que le da al componente su funcionalidad. Utilizamos este patrón de proveedor/consumidor con frecuencia en la biblioteca, y el siguiente ejemplo muestra cómo intercambiar el componente de interfaz de usuario Message con MessageTeam , sin afectar ninguna lógica en la aplicación.
< Channel Message = { MessageTeam } >
< Window >
< ChannelHeader />
< MessageList />
< MessageInput />
</ Window >
< Thread />
</ Channel >El método preferido para anular los estilos predefinidos en la biblioteca es al proceso de dos pasos. Primero, importe nuestro CSS agrupado en el archivo donde cree su aplicación de chat. En segundo lugar, ubique los estilos de transmisión que desee anular el uso del inspector del navegador o viendo el código de la biblioteca. Luego puede agregar selectores a su archivo CSS local para anular nuestros valores predeterminados. Por ejemplo:
import 'stream-chat-react/dist/css/v2/index.css' ;
import './App.css' ; Nuestra biblioteca admite la auto-traducción para varios idiomas de usuario. Lea nuestra documentación de internacionalización para obtener más detalles y orientación de configuración.
Agradecemos los cambios en el código que mejoran esta biblioteca o solucionan un problema. Asegúrese de seguir todas las mejores prácticas y agregar pruebas, si corresponde, antes de enviar una solicitud de extracción en GitHub. Nos complace fusionar su código en el repositorio oficial si satisface una necesidad. Asegúrese de firmar primero nuestro Acuerdo de Licencia de Contributor (CLA). Vea nuestro archivo de licencia para obtener más detalles.
Recientemente cerramos una ronda de financiación Serie B de $ 38 millones y estamos creciendo activamente. Nuestras API son utilizadas por más de mil millones de usuarios finales, y al trabajar en Stream, tiene la oportunidad de tener un gran impacto en un equipo de ingenieros muy fuertes.
Consulte nuestras aperturas actuales y aplique a través del sitio web de Stream.
Este proyecto utiliza la biblioteca lamejs bajo la licencia LGPL para convertir el audio grabado en formato MP3. El código fuente de la biblioteca se importa y se usa dinámicamente solo si la grabación de audio está habilitada.
Puede obtener el código fuente para lamejs del repositorio de Lamejs que es una bifurcación de la biblioteca JS original. Puede encontrar el código fuente de Lame en https://lame.sourceforge.net y su licencia en: https://lame.sourceforge.net/license.txt
