stream chat react
v12.8.1
공식적인 채팅 애플리케이션 구축 서비스 인 스트림 채팅을위한 공식 반응 구성 요소.
빠른 링크
구성 요소 라이브러리를 사용하면 다음을 포함한 다양한 채팅 사용 사례를 구축 할 수 있습니다.
시작하는 가장 좋은 방법은 React 채팅 자습서를 따르는 것입니다. 이 SDK를 사용하여 완전히 기능적인 채팅 애플리케이션을 작성하는 방법을 보여주고 일반적인 사용자 정의가 포함됩니다.
스트림은 대부분의 측면 및 취미 프로젝트에서 무료입니다. 자격을 갖추려면 프로젝트/회사는 5 명 이상의 팀원이 없어야하며 월 수익으로 $ 10K 미만을 벌어야합니다. 전체 가격 및 세부 정보는 채팅 가격 페이지를 방문하십시오.
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>
우리는 소셜 메시징, 팀 협업, 고객 지원, 라이브 스트림 게임 및 가상 이벤트 등 다양한 채팅 사용 사례를 보여주는 5 가지 데모 응용 프로그램을 구축했습니다. 당사 웹 사이트 에서이 데모를 미리 볼 수 있습니다. 또한 코드는 오픈 소스입니다.
우리는 DOC 생성기를 사용하여 구성 요소 문서를 작성합니다. 우리는 각 채팅 구성 요소에 대한 간단한 설명을 제공하고 수락하는 모든 소품을 정의합니다.
React 구성 요소는 Stream-Chat-JS 라이브러리를 사용하여 작성됩니다. 구성 요소를 사용자 정의하는 경우 웹 사이트에 문서가있는 JavaScript 클라이언트를 사용하여 채팅 API에 추가 호출을해야합니다.
버전 5.0.0 기준으로 구성 요소 라이브러리가 TypeScript로 변환되었습니다. 자세한 내용 및 구현 지원은 TypeScript 안내서를 읽으십시오.
중요한 논리를 구현하는 구성 요소의 경우 구성 요소를 두 부분으로 분할하는 것이 도움이됩니다. 기능성을 처리하는 최상위 구성 요소와 UI를 렌더링하는 낮은 수준 구성 요소. 이렇게하면 구성 요소에 기능을 제공하는 논리를 변경하지 않고 UI를 교체 할 수 있습니다. 우리는 라이브러리 에서이 공급자/소비자 패턴을 자주 사용하며 아래 예제는 앱의 논리에 영향을 미치지 않고 MessageTeam 으로 Message UI 구성 요소를 교체하는 방법을 보여줍니다.
< Channel Message = { MessageTeam } >
< Window >
< ChannelHeader />
< MessageList />
< MessageInput />
</ Window >
< Thread />
</ Channel >라이브러리에서 사전 정의 된 스타일을 재정의하는 선호하는 방법은 2 단계 프로세스입니다. 먼저, 번들 CSS를 채팅 응용 프로그램을 인스턴스화하는 파일로 가져옵니다. 둘째, 브라우저 검사관을 사용하거나 라이브러리 코드를 보면 재정의하려는 스트림 스타일을 찾으십시오. 그런 다음 로컬 CSS 파일에 선택기를 추가하여 기본값을 무시할 수 있습니다. 예를 들어:
import 'stream-chat-react/dist/css/v2/index.css' ;
import './App.css' ; 우리의 도서관은 다양한 사용자 언어에 대한 자동 변환을 지원합니다. 자세한 내용과 설정 지침은 국제화 문서를 읽으십시오.
이 라이브러리를 개선하거나 문제를 해결하는 코드 변경을 환영합니다. GitHub에 풀 요청을 제출하기 전에 모든 모범 사례를 따르고 해당되는 경우 테스트를 추가하십시오. 필요에 맞는 경우 귀하의 코드를 공식 저장소에 병합하게되어 기쁩니다. 기고자 라이센스 계약 (CLA)에 먼저 서명하십시오. 자세한 내용은 라이센스 파일을 참조하십시오.
우리는 최근 3 천 8 백만 달러의 시리즈 B 자금 조달 라운드를 마감했으며 적극적으로 성장하고 있습니다. 우리의 API는 10 억 명 이상의 최종 사용자가 사용하며 스트림에서 일함으로써 매우 강력한 엔지니어 팀에 큰 영향을 줄 수 있습니다.
현재 오프닝을 확인하고 Stream의 웹 사이트를 통해 신청하십시오.
이 프로젝트는 LGPL 라이센스에 따라 lamejs 라이브러리를 사용하여 녹음 된 오디오를 MP3 형식으로 변환합니다. 라이브러리 소스 코드는 동적으로 가져 오며 오디오 녹음이 활성화 된 경우에만 사용됩니다.
원래 JS 라이브러리의 포크 인 LAMEJS 저장소에서 lamejs 소스 코드를 얻을 수 있습니다. https://lame.sourceforge.net에서 절름발이 소스 코드와 라이센스를 찾을 수 있습니다. https://lame.sourceforge.net/license.txt
