react slack clone

react slack clone

Clone Slack alimenté par Chatkit. Voyez-le en action ici https://pusher.github.io/react-slack-clone

Il s'agit d'une application Web statique d'une seule page démarrée avec create-react-app pour faciliter la configuration, la distribution et le développement. Il s'agit d'un mince wrapper d'interface utilisateur autour de la bibliothèque pusher-chatkit-client pour démontrer comment différentes fonctionnalités peuvent fonctionner ensemble pour former un client de discussion en temps réel convaincant avec diverses applications de produits potentielles.

Caractéristiques

Le SDK Chatkit vous permet d'implémenter les fonctionnalités que vous attendez d'un client de chat. Ceux-ci incluent :

• Salons de discussion publics et privés
• ? Envoi et réception de messages en temps réel
• ? Pièces jointes Rich Media (glisser-déposer)
• Indicateurs de frappe et de présence
• Lire les curseurs de message

Vous souhaitez vous impliquer ? Nous avons un tas de problèmes GitHub adaptés aux débutants.

Composants

La démo tente d'être complète selon la documentation ici. Les demandes de fonctionnalités doivent être effectuées via des problèmes ou des demandes d'extraction vers ce référentiel.

• CreateMessageForm - pour envoyer un message avec un corps textuel et déclencher des indicateurs de saisie.
• CreateRoomForm - pour créer une nouvelle salle et la rejoindre lors de la création.
• FileInput - pour envoyer un message avec une pièce jointe Rich Media.
• Message - pour afficher un message contenant potentiellement une pièce jointe.
• MessageList - pour afficher une liste de messages à partir d'un magasin de valeurs clés.
• RoomHeader - pour afficher des informations utiles sur une pièce donnée.
• RoomList - pour afficher une liste des salles auxquelles l'utilisateur actuel peut s'abonner.
• TypingIndicator - pour signifier à l'utilisateur qu'un autre utilisateur tape dans une pièce donnée.
• UserHeader - pour afficher des informations utiles sur un utilisateur donné.

Usage

Pour exécuter l'application localement ; clonez le dépôt, installez les dépendances et exécutez l'application.

 $ git clone https://github.com/pusher/react-slack-clone
$ cd react-slack-clone
$ yarn && yarn start

L'application démarre en mode développement et ouvre une fenêtre de navigateur sur http://localhost:3000 . Le projet se reconstruit et le navigateur se recharge automatiquement lorsque les fichiers sources sont modifiés. Toutes les erreurs de build ou d’exécution sont propagées et affichées dans le navigateur.

L'application dépend de l'authentification GitHub et d'un point de terminaison de création d'utilisateur hébergé sur https://chatkit-demo-server.herokuapp.com. Les points de terminaison sont /auth et /token .