All Tutorials

In part two of this series, you’ll use our iOS Chat SDK sample application to prototype several gestures that you’ll use for refreshing page content, adding seamless swiping and pagination to message lists and photos, revealing in-app actions to messages in message channels, and …

Angular is a UI framework for building mobile and desktop web applications. It is built using TypeScript and can support single-developer projects to enterprise-level applications. You can create amazing client-side applications using HTML, CSS, and Typescript using Angular. At S…

Animated message reactions, like the ones found in iMessage, offer you a way to quickly respond and add your sentiment to a single chat message. In this tutorial, we will focus on making animated message reactions more lively by adding animations to the reaction icons and their c…

To get started, you’ll learn how to customize the chat features you build with Stream’s Compose Chat SDK. Specifically, you’ll work with Stream’s Compose ChatTheme component to define these features so that your app truly looks and feels the way you want it to. You can find all t…

Many chat apps today implement /slash commands for their end-users. When done right, these commands can be both practical and engaging, serving a variety of use cases. For this tutorial, you’ll create a custom /gcal command that will populate your app’s chat channel with your upc…

This tutorial will focus on designing the elements that make up the ChannelListView and ChatsView components. In parts two and three, you’ll build on these components by adding interactions and animations, creating a more seamless chat experience. Resources You can download the X…

Before you dive in, make sure you’ve read Building an Avengers Chat Application for Android (Part 1), where we cover foundational concepts like the app’s architecture, Gradle setup, integrating Stream, and more. Once you’ve caught up, you can dive into part two, where you’ll lear…

Our original implementation to track file upload progress worked, but it had some in-code usability and UX issues that we wanted to clean up. The following account gives an up-close look into the process we had, the problems we encountered, and what we did to improve. Warning: As…

The Stream Chat SDK for Jetpack Compose makes extensive use of slot APIs, which allow you to provide pieces of Composable layout that you can then use within one of the chat components provided by the SDK. For this post, you’ll use the MessageList component and its itemContentpar…

Authentication is a basic necessity when building a messaging app with Stream. It helps secure the messaging environment and also provides a customized experience on a per-user basis. Stream uses JWT (JSON Web Tokens) to authenticate users. Generally, to generate and provide thes…

WebSockets are at the core of every chat app. At Stream, whenever you connect a user to a channel, you create a WebSocket connection. That means for every connected user, there’s at least one connection open. But, did you know it’s possible for a single user to connect multiple t…

The Problem Recently, as a result of Stream’s work on the stream_feed_flutter sample application, it became problematic to not have some kind of "mock” authentication system in place to better test the application. After all, what good is a social feed if there’s only one person …

When designing and prototyping touch interactions for iOS devices, designers typically rely on interaction design tools such as Framer, Origami Studio, Adobe XD, Figma, InVision, Flinto, Principle, and ProtoPie. While there is nothing wrong with these design tools, they create an…

To get started, you’ll learn how to build an Android Avengers messaging application using Kotlin, Coroutines, and Jetpack libraries like Hilt, Room, and Databinding. The app will also implement a model-view-viewmodel (MVVM) architectural pattern. After reading this article, you w…

Building a chat app from scratch can be a difficult, frustrating process that can take months — and that’s just for a bare-bones messaging application with none of the engaging features today’s savvy app users expect. But with Stream’s Chat API, coding doesn’t have to be a huge h…

Specifically, this tutorial will cover: What an AttachmentFactory is Creating a custom AttachmentFactory Customizing Stream Compose UI Components Sending custom files as attachments Adding previews for your custom attachment Note: Stream recently announced their Jetpack Compose U…

Did you know you can integrate Stream’s Android SDK with other open-source libraries? To show you just how easy it is, in this tutorial you’ll leverage data from Stream’s Chat API to power the messaging UI from ChatKit. Specifically, this tutorial will cover: Stream Setup Impleme…

Many chat applications today allow users to send voice notes as messages. In this tutorial, you’ll learn how to send voice notes, or audio attachments, in your Stream Chat Flutter app. By the end, your app will feature a chat experience similar to the shown here. This tutorial wi…

Building a chat app that is both feature-rich and scalable can be difficult and time-consuming. But in just under four hours, this YouTube video by JavaScript Mastery demonstrates how to build and deploy a telemedicine chat app designed for a medical or hospital setting using the…

Stream now offers two separate Android UI implementations that you can use to integrate Stream’s Chat API with your app: Compose UI Components (preferable if you’re using Jetpack Compose) UI Components (preferable if you’re building XML layouts) In almost all cases, you should us…

Whether you are a veteran developer seeking to shore up your Typescript skills or a new coder who is interested in getting an introduction to TypeScript, Stream is proud to sponsor Traversy Media’s recent tutorial, “TypeScript Crash Course 2021.” We’re excited about this video fo…

Adding a peer-to-peer payment integration to your Flutter application creates a richer in-app experience for your end-users. However, you need to make sure your payment process is fast and secure. In this tutorial, you’ll learn how to integrate a peer-to-peer payment solution in …

When you communicate over a chat application with another person or group, you may exchange sensitive information, like personally identifiable information, financial details, or passwords. To ensure that your data stays secure, a chat application must use end-to-end encryption. …

A stand-out feature of the most popular messaging applications is the ability to share a user’s location quickly and conveniently with trusted peers. Using Stream Chat and Flutter, we can implement a similar feature in very little time. In this article, we will build a small loca…

Stream’s Android Chat SDK supports sending custom attachments with messages. In this tutorial, you’ll learn how to send location data as a custom attachment. Note: This tutorial assumes you already know the basics of the Stream API. To get started, check out the Android In-App Me…

In today’s world, chat or instant messaging apps have completely superseded traditional text messages. We all use chat app to communicate with the people around us due to the capability of the chat application to provide features such as message read receipts, user presence, reac…

Music has always been an oasis for me while coding and writing. I love chatting for hours on end with my friends, exploring our peculiar music taste. What if we had an app where we could listen to music and discuss with a like-minded community? This tutorial will create a music c…

Almost every application needs an authentication strategy. The most common being the classic username and password combo. However, there’s a new approach some apps are taking to avoid handling or storing user passwords: passwordless authentication. It generally involves sending a…

Stream’s Chat SDK for Android provides a way for you to add reactions in your application in a matter of minutes. The SDK has a free trial, and it’s free to use for small companies and hobby projects with a Maker Account. In this tutorial, you’re going to learn how to do the foll…

Messages in Stream Chat can contain a number of attachments. The UI Components library for Android renders these by default depending on their type. Images are rendered in a gallery layout, files are shown in a list, and links show rich previews of the content they’re leading to.…

Previously, in Get up and Running With Stream Chat, we looked at how to register your organization for Stream Chat, and get an API key and secret for your app. Now it’s time to create a new Android project, add the Stream Chat Android SDK to it, and create your first users and ch…

Previously, in Get up and Running With Stream Chat, we looked at how to register your organization, and get an API key and secret for your Stream Chat app. Now it’s time to create your first users and channels in this environment. One of the ways of doing that is by using our fri…

Registering an account First, go to the trial registration page, and fill out the required details. (Note that your organization name can not have spaces in it.) The chat trial lets you play around with Stream Chat APIs for 30 days, for free. If you’re a small business or you’re …

Stream now provides a fully-featured Jetpack Compose Chat SDK that you can use instead of the basic approach described in this article. Check out the Compose Chat Messaging Tutorial and give it a try today! Intro and context In our previous article about Jetpack Compose, we share…

Authorization is one of the essential parts of any iOS application. Once a user is logged in, it’s your authorization scheme that will make sure users can’t interact with your app in ways they’re not allowed to. Without a robust authorization scheme, hackers could easily access s…

In this tutorial, we’ll build a functional clone of iMessage using Stream Chat Flutter SDK. Building a chat in your app at scale is not an easy task; but in this tutorial, you’ll get a chat experience up and running in roughly 20 minutes! You can follow this tutorial without a de…

Technology once reserved for broadcast journalism, televised concerts, and important sporting events is now available to all with a WiFi connection and a smartphone. Live streaming, defined as the real-time transmission of events over the internet, grew exponentially in 2020. Acc…

Message Markup Language (MML) enables you to build an interactive messaging experience. MML supports embedding elements as simple as a button to your message or as complex as date pickers and custom forms within your chat experience. MML also supports images, icons, and tables ou…

Livestreams are everywhere these days, from popular gaming sites such as Twitch to more casual everyday apps like Instagram. Apps use live streaming and live video to help connect users and add another level of interactivity to their platform. If you think about modern live strea…

When you’re modeling and building an API, storing ID references to other documents to create relationships between types of data within your domain is paramount to efficient querying, scalability, and even your own sanity. Imagine you’re building the backend for a blog platform a…

Since Swift 5 and Xcode 11 were released, SPM became a viable dependency manager for many iOS projects. It’s also been heavily improved upon in Xcode 12 with the support of binary frameworks and resource files such as storyboards, nibs, localization folders, asset catalogs, and c…

As of Swift 5 and Xcode 11, Swift Package Manager supports the iOS, macOS, and tvOS build system. This support has also been greatly improved in Xcode 12 with the addition of non-source files, including asset catalogs, storyboards and nibs, core data models, and localization fold…

In Part 2 of this tutorial, we covered how to build Slack-like navigation, channel list screen, channel screen, reaction picker, and action sheet. In this tutorial, Part 3, we will build various search screens and thread screen. Resources 👇 Below are a few helpful links if you g…

React Native has come a long way since its first release in 2015. In fact, it has enough components, APIs, and supporting libraries in its present state that you can re-create every app that’s out there on the Google Play Store or Apple App Store in no time! In this series, we wi…

SwiftUI becomes more popular as it gets more capable with each iOS release. However, it may take some time until it’s a better option than UIKit to build complex user experiences such as chat and video calls. That doesn’t mean you need to stick with UIKit until all the SDKs you u…

In most cases, when building a chat app, it’s essential to provide adequate privacy and security to your users. This can be done using cryptographic methods such as end-to-end encryption. End-to-end encryption is becoming a mainstream expectation, as it’s featured in the biggest …

In this guide, we’ll create the a basic Psychotherapy App for iOS with Stream Chat, for its fully featured chat components, and Dolby.io, for its excellent audio and video capabilities. Both offerings are HIPAA compliant. When you finish following the steps, you’ll get an app lik…

When transmitting or storing user data, especially private conversations, it’s essential to consider employing cryptographic techniques to ensure privacy. By reading this tutorial, you’ll learn how to end-to-end encrypt data in web applications using nothing but JavaScript and th…

Most of the time, when building a chat application, it’s essential to have some level of control over what your users can share and say to each other. In this tutorial, we’ll use Swift Lambda and Stream’s powerful chat API to build a content moderation system that can prevent use…

This tutorial demonstrates how to set up notifications for these events using a Stream Feed in conjunction with AWS S3. We will walk through a basic set up that shows how to create a timeline (flat feed) to display a list of events tied to an AWS S3 bucket – think user uploads, d…