Tutorials: Chat

Since April 2020, all apps that use a third-party or social login service are required to offer Sign in with Apple if they want to be accepted in the App Store. In a previous tutorial, we walked through the process of building a simple clone of Apple’s iMessage. In this tutorial,…

Group chat can get a bit messy, especially if it’s public and anyone can join. Making a group chat invite-only can help manage the content of the group and the sanity of those in it, in addition to preventing spam users and bots. In this tutorial, we’ll be building an invite-only…

Messaging apps are becoming more and more popular as a means through which to connect with friends and family. They’re convenient and provide an easy and affordable means of communication. A recent study by Statista revealed that the current number of smartphone users in the worl…

One of the fastest ways to build applications has always been Ruby on Rails. Ruby on Rails is a feature-packed web development framework that makes it easy for novices and experts alike to easily stand up an application. When you want to add chat to your application, using Stream…

Language barriers can hinder growth and build a wall between your business and its potential customers, ultimately limiting your market and costing you money. If a customer reaches out to you by chat in German or Spanish, but you don’t understand the language, wouldn’t it be nice…

Flutter is the latest cross-platform UI toolkit (provided by Google) for building Android, iOS, and even desktop apps that is gaining popularity amongst developers. Stream Chat, on the other hand, is an enterprise-grade chat solution that offers extensive APIs and SDKs to power c…

Customer support live chat is an incredible tool for collecting valuable feedback from your customers and increasing your website engagement rate. With that said, it can take weeks or even months to build a functional, scalable, reliable real-time chat application. Luckily, Strea…

Are you thinking of building a chat application in Go? You’ve come to the right place! This post will walk you through everything you need to know to make a chat app with the Stream Chat API and will show a working example server that ties all the concepts discussed in this tutor…

Interest in and application of artificial intelligence and machine learning have been rapidly rising in the last few years. One of the most popular ways in which this interest has manifested is a rise in the use of chatbots. Especially in years past, communicating with a chatbot …

Note: This blog is archived due to limited compatibility with an old version of the React Native chat SDK. Please check our latest tutorial or our finished Slack clone. React Native has a significant footprint in the mobile development world. And with every new release, it gets b…

In this tutorial, we’ll build a functional clone of iMessage using Stream Chat iOS SDK. Building a messaging app used to be difficult; but in this tutorial, you’ll get a chat experience up and running in roughly 20 minutes! If you get lost during this tutorial, you can check: The…

Apache Cordova is an application development framework that allows you to develop cross-platform apps using web technologies such as HTML, CSS, and JavaScript. Its main advantage over traditional app development workflows is that it allows for the use of a single codebase for And…

Add Messaging Functionality to Your Laravel App If you are building an app with Laravel and want to add a social aspect, such as chat, Stream Chat provides exactly what you need. In this tutorial, we’ll do a deep dive into how to use Stream to add a messaging feature to your Lara…

As previously mentioned in a blog post by Stream, Pusher recently announced its intention to shut down their real-time messaging service, Chatkit, effective April 23rd, 2020, to narrow its product focus to Channels and Beams. Although Pusher Chatkit fulfilled the basic premise of…

This tutorial will take you through how to create a live chat app that responds in real-time, with the help of Dialogflow and Stream’s Messaging Platform. We’ll be making a chatbot that interprets the intent of a user’s input using Natural Language Processing (NLP) and responds a…

In this tutorial, we’ll build an encrypted chat/messaging example app for Android. To do this, we will combine the Stream Chat Platform and Virgil Security. Stream and Virgil make it easy to build a solution with excellent security by combining all of the features you would expec…

In this article, we’ll take a look at how to make chat applications more accessible to visually impaired users by adding text-to-speech functionality, which makes it possible for these users to have incoming messages read to them in realtime. We’ll be leveraging AWS Polly’s natur…

The General Data Protection Regulation (GDPR) is an EU data protection law (passed into law in 2018) that determines how companies use and protect EU citizens’ data. While you might feel this doesn’t concern you, it very likely does! As long as you have EU residents making use of…

In this article, we will be creating a chat application using React and Stream Chat. The app will feature an authorization page for login/signup, followed by a chat view that allows for communication between several authorized users. After creating the chat application, we will d…

Stream’s Messaging API allows you to build real-time chat applications that are scalable, fault-tolerant, secure, and fast, so you don’t have to re-invent the wheel by starting from scratch. You’ll take less time to create a robust app (like days to create a real-time chat applic…

💡 This blog post describes an outdated approach to using Javascript against our Chat platform. Javascript developers can now use SDKs specfic to their tech stack, like our dedicated Angular Chat SDK. It allows you to build chat experiences with ease. You can still refer to the p…

In this post, we’ll explore how to do two things: 1) create live chat message bubbles in Android that are similar to WhatsApp and iMessage and 2) customize Stream Chat’s UI Components. We’ll customize Stream Chat Android’s built-in UI components by plugging in a custom message vi…

Let’s create a functional chat interface right in the terminal with Node.js! Although building a chat app is no small task, with the help of Stream’s fully featured Chat API, it’ll only take a few lines of code, as you’ll see. Here’s a demo of what the final application will look…

How much do you love when you can just jump on a company’s website and chat with one of their representatives to take care of your business; no picking up the phone, no waiting days for an email back?? Customer support live chat is a critical tool for every forward-thinking busin…

In this post, we’ll be creating a simple social network, called Stream Flutter, that allows a user to post messages to followers. The app will allow a user to post a message to their followers and chat with them. Stream’s Activity Feed API and Chat API combined with Google’s Flut…

In the second part of our series, we’ll implement direct messaging between users by integrating the Stream Messaging Platform. This post assumes you’ve followed along with part 1. Leveraging our code from part 1, we’ll modify the backend to generate a Stream Chat frontend token s…

In the third part of our series, we’re building group chat into our social application. This allows users to chat with multiple people at the same time. We leverage Stream Chat to do the heavy lifting. This post assumes you’ve gone through part 1 and part 2. Using our code from p…

💡 There’s a newer version of this tutorial! Stream now offers a dedicated Angular Chat SDK, paired with a new official Angular Chat App Tutorial. The new SDK drastically simplifies the development process described below. You can still skim this post for inspiration, but please …

Building a fully functional and scalable chat platform is time-consuming. Luckily, Stream can help you build one in minutes! In this tutorial, we are going to use the Stream API to build a chat messaging platform in PHP. Prerequisites To follow along with this tutorial, you need …

One increasingly common feature in chat apps is the ability to send self-destructing messages, also known as "ephemeral" messages. When this feature is enabled, the messaging system automatically erases the content minutes or seconds after the message is sent. This deletion is ef…

People long for connection, and technology has allowed us to connect with those who aren’t physically near in increasingly many ways over the last few decades. With applications like text messaging, and then group messaging, with our music, photos and movies moving to the cloud, …

In any chat application, one of the most integral features is being able to notify users of new messages. While providing this feature comes with its own set of challenges (listeners, timing, notification types, keeping track of which messages are read, etc.), notifying users of …

Update: Here is an excellent post on the vision for 2020’s tech trends in cloud computing between the CEO of Ionic, Max Lynch, and CEO of Stream, Thierry Schellenbach. There is a massive difference between platforms such as React Native and Flutter compared to Ionic. Ionic believ…

In this post, we are going to implement a simple Group Chat application with Vanilla Javascript and Stream Chat! Stream Chat allows you to rapidly ship real-time messaging systems that are reliable and robust, without the overhead cost and time of managing the infrastructure by y…

Creating an application is a lot of work! Deploying your application shouldn’t be. Every developer has said at one time or another, "it works locally, but I can’t get it to work on the server!"; it can take you hours, or even days, to figure out what went wrong and to put a fix i…

Getting Started In any business interaction, it is vital to hold on to records of how you got to where you are. Not only can being able to reference previous transactions and interactions teach you about what you’ve done, it can help you make informed decisions about what you are…

Ionic is an open-source framework that allows you to build and deploy apps that work across multiple platforms, such as iOS, Android, desktop, and the web as a Progressive Web App – all with the same code base. At first, Ionic was built to work with Angular, but with the release …

This is the third installment of a tutorial series focusing on how to create a full-stack application using Flask and Stream. Originally, this article was going to cover the creation of the initial database models for your app, as well as handling registration/login and other con…

For the last little while, I’ve wanted to develop a new kind of social media site. Between the privacy issues, relentless ads, and the pervasiveness of bots on almost every service, I wanted to build something that would allow people to have a new source to discover the newest an…

In this tutorial, we will show you how to process webhooks to send a message to a Slack channel! Here at Stream, we are big fans of Chat. With our chat product, we offer a webhook so that you can relay data to an endpoint of your choice. Webhooks are an excellent way to make

Managing microservices manually can get very complicated and takes the focus away from business logic. API gateways help take care of the various collective management and housekeeping tasks necessary for running microservices. One of the most popular API gateways is Kong. As the…

Unlike an API request that’s triggered when a request is sent, a webhook gets triggered when certain events occur within the cycle of an application. For example, when a new message is added on Stream Chat, the message.new event sends a payload to the webhook endpoint containing …

This article describes how you can build and deploy a React Chat application powered by Stream’s Chat API to Netlify and Heroku. In this case, the React app will be deployed on Netlify, while the accompanying Node server will be deployed to Heroku. At the end of this article, you…

Initial Thoughts This tutorial will teach you how to build your own customer support chat experience and create a serverless chatbot! The end result will look much like this: The customer-facing chat experience is shown on the left, and the screen on the right shows the interface…

Many applications today inform users about important messages related to their application by sending notifications – this can be via push or web. With a web notification, a user can click on the notification and instantly get back to the application to further act on that piece …

Stream Chat provides a JS Chat SDK that you can use to build custom messaging solutions for your application. Requests from the SDK are authorized via an access token provided by a backend API. Due to the restriction of having to generate a JWT token on the backend, you will need…

React hooks, released in February 2019, have huge benefits when implemented in your application. Whether you’ve used hooks before or are just learning, this post aims to show you just how simple it is to implement them with Stream Chat. The Basics Using hooks with Stream Chat is …

Overview Here at Stream, we’re known for our Feeds as a Service as well as our Chat as a Service product. Stream Chat was released out of beta late last year, and we’ve been receiving quite a few inquiries on how to structure a RESTful API to support the backend portion of chat. …

In this tutorial, we will build a chat application that’ll allow users to participate in a group discussion similar to how channels work in Slack. We’ll handle user authentication, and management using Auth0’s Authentication-as-a-Service solution that allows developers to add aut…

Conversational UI is a user interface that emulates a human to human conversation, while in reality, the human is interacting with a computer program. We’ve often seen this with the use of chatbots and voice assistants. Conversational UI that involves speaking allows you to inter…