Tutorials : Chat
Customizing Stream Chat iOS/Swift App for a Unique Look: A Quick Start Guide
This article demonstrates how to perform basic customizations such as swapping colors, fonts, and icons with assets, color, and typographic styles from your style guide. You can create a free chat trial account to follow along with the tutorial. Resources You can find and download the completed Xcode project on GitHub. This tutorial is for
How To Build A Facebook Messenger Clone
You’ll need to integrate a chat solution, but how do you build one that encourages modern connection through futuristic features? Stream sponsored Web Dev Simplified YouTube to provide a developer-focused guide on implementing Stream's React Chat SDK to create a Messenger-style clone. In just an hour and a half, this tutorial demonstrates how to build
Build a Real-Time Android WhatsApp Clone With Jetpack Compose
In this article, you will learn how to build your own real-time Android WhatsApp project with Jetpack Compose and Stream’s versatile Compose Chat SDK. Also, you will learn the overall architecture, each layer, and theming that are used in WhatsApp-Clone-Compose project. Before you dive in, we recommend cloning the WhatsApp-Clone-Compose on your local device with
Building an Avengers Chat Application for Android (part 1)
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 will learn the entire architecture of this application, and how to build out the messaging features
Most Recent Posts
Jetpack Compose vs. XML-based UI Components for Stream Chat
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 use the library that’s native to the rest of your app’s UI.
Peer-to-Peer Payment Integration With Stream and Flutter
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 your Stream Chat Flutter application using an in-app digital wallet that provides
End-to-End Encrypted Chat in Flutter
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. In this tutorial, you’ll learn the basics of end-to-end encryption and how to use it in
Add Location Sharing to a Messaging App Using Flutter
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 location-sharing chat feature using Flutter, Stream Chat, and the
Location Sharing With Custom Attachments on Android
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 Messaging Tutorial, and take a look at the Android SDK
Building a Responsive Desktop Chat with Flutter
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, reactions, typing indicators, etc. As a result, users enjoy and hardly
Build a Music Chat iOS App Using SwiftUI
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 chat app where you
iOS Passwordless Chat Application with Auth0
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 one-time PIN (OTP) through a user-owned channel such as their phone or email. If the
Creating a fast and beautiful chat with Flutter
We all have probably written chat apps multiple times in our lives, and we all know that it takes time! So I always wondered if there is a way to make a custom and beautiful chat app using some lib/service that does all the heavy lifting for me. A few weeks ago, I came across
All About Reactions with the Stream Chat Android SDK
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 following with
Creating Custom Attachments on Android
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. You can render attachments in a custom
Your First Steps with Stream Chat on Android
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 channels! If
Get up and Running With Stream Chat
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 building a hobby project, you
Build an Android Chat app with Jetpack Compose
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 shared our initial impressions and recommended some learning resources.
Generate JWTs with Swift on AWS Lambda
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 sensitive user data and engage in other damaging activities
Build an iMessage Clone with Stream's Flutter Chat SDK
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 deep knowledge of Flutter,
How to Create a Live Stream Event
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. According to StreamElements and Arsenal.gg, the live streaming sector grew 99% from 2019 to 2020
Build an Interactive Messaging App with Stream, MML, Node and React
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 out of the box. The goal for MML is to provide
Live Streaming With Mux, Stream, and Flutter
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. This post is still useful, but out of date. Stream now offers a Live Video Streaming
Tutorial: How to Build a Slack Clone with React Native - Part 3
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. 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,
Tutorial: How to Build a Slack Clone with React Native - Part 2
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 come a long way since its first release in 2015. In fact, it has enough components, APIs, and supporting libraries in its present
How to Use an SDK Built for UIKit in Your SwiftUI App
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 use support SwiftUI. In
End-to-End Encrypted iOS Chat with Apple's CryptoKit
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 chat apps, such as WhatsApp and Telegram. In this article, you'll learn
Build a Psychotherapy App with Video and Chat for iOS
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 like in the image below. Additionally, it will be compatible
End-to-End Encrypted Chat with the Web Crypto API
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 the Web Crypto API, which is a native browser API. Please note that this tutorial is very
Moderate Chat Content with Swift on AWS Lambda
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 users from sending unwanted content. In
Build a Realtime Notification Feed for AWS S3
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, downloads, and
Create A Support Chat Admin Dashboard
In this tutorial, we'll build a chat app with a dashboard that allows an admin user to switch between one-on-one customer chat channels in the same window. As a busy customer support representative, you don’t want to be stuck with a chat app that opens each chat in a new window, forcing you to cycle
Save and Send Chat Transcripts with SendGrid
In this tutorial, we'll build a chat app that sends a copy of a chat transcript in an email using SendGrid. Imagine being able to automatically inform your sales team when one of their clients has chatted with your support team. This app sends a transcript of that chat directly to the salesperson's email address
Syncing Sales Chat Transcripts in Real-Time with Zendesk Sell CRM and Stream Chat
Can you imagine viewing your sales chat transcripts in real time from your sales CRM? Would your chat applications improve with more timely handling of customer chat inquiries? This post demonstrates how to leverage the powerful Stream Chat API to take action with a chat transcript as the chat takes place, response by response. The
Write a Chatbot in Swift and Deploy to AWS Lambda
Did you know you can use Swift in the backend to build a chatbot and deploy it to AWS? We've recently published an Open Source project called Swift Lambda to make the process easier. In this tutorial, we'll use Swift Lambda to build a chatbot that can reply to user messages automatically using Stream's powerful
Send Chat Transcripts to HubSpot
This tutorial will explore how to make a chat widget that connects to the HubSpot CRM to (1) create or update a HubSpot CRM Contact with the user’s info, and (2) save chat transcripts in HubSpot. We’ll use the versatile Stream Chat client and its webhooks to accomplish this. The steps provided here will help
How to Implement Chat in Your E-Commerce iOS App
In this tutorial, we'll integrate chat in an e-commerce app using Stream Chat's Swift SDK. It's crucial for buyers that may need immediate communication for payments, delivery status, last-minute changes, and refunds. Those screenshots show a button leading to a chat screen where the buyer can get information in real time from the seller. This
How To Capture Leads From Live Chat In Zendesk
This post will demonstrate how to configure a Lead creation in Zendesk from a customer inquiry via a landing page/sales chat widget. We'll build a full-screen experience that can be embedded on your homepage or landing pages. Our chat experience will start with a simple user registration to lead capture. It will ask for first
How to Capture Leads From Live Chat In HubSpot
In this tutorial, learn how to build a Stream chat widget that connects to the HubSpot CRM to automatically create a new contact when a customer initiates a chat. This widget, backed by the Stream chat API, can be easily embedded to your site as a chat widget for sales, support, lead capture, or a
How to Build a Live Fitness iOS App
In this tutorial, we'll build a TeleHealth iOS app where gym members and instructors can interact in an online virtual fitness class using Stream Chat, to deliver fully featured chat components, and Dolby.io, to provide quality audio and video. By the end, we'll have an application similar to the screenshots below. As a bonus, it's
How to Build an iOS App for Livestream Events
In this tutorial, we'll build an iOS app for livestream events where attendees and speakers can interact in a virtual conference room using Stream Chat, to deliver fully featured chat components, and Dolby.io, to provide quality live-streamed audio and video for large audiences. By the end, we'll have an application similar to the screenshots below.
How to Build a Virtual Classroom iOS App with Video and Chat
In this tutorial, we'll build an iOS app where students and teachers can interact in a virtual classroom using Stream Chat, to deliver fully featured chat components, and Dolby.io, to provide quality audio and video. By the end, we'll have an application similar to the screenshots below. As a bonus, it's compatible with both light
How to Implement In-App Support Chat on iOS
In this tutorial, we'll build an in-app support system using Stream Chat's Swift SDK, which you can quickly integrate in new or existing apps. It's crucial for users that may need immediate information or assistance in completing a task. It's frequently present in banking, e-commerce, delivery, and ride sharing apps. Those screenshots show a button
How to Build a Telemedicine App with Video and Chat for iOS
In this tutorial, we'll build the basis of a Telemedicine app for iOS using Stream Chat, to deliver fully featured chat components, and Dolby.io, to deliver quality audio and video. Both solutions provide HIPAA compliance. By the end, we'll have an application similar to the screenshots below. As a bonus, it's compatible with both light
How to Build a Chat App with SwiftUI: Part 2 (Channels)
In Part 1 of this series, we created a simple chat application for iOS and macOS using SwiftUI and Stream Chat's Swift SDK, but it only had a single channel. In this tutorial, we'll improve on it by implementing a channels screen with three features: join, create, and search channels. Although Stream Chat provides a
Build a 1-on-1 Video Chat with SwiftUI and Dolby.io
In this tutorial, we'll integrate video chat into an iOS application. To do this, we integrate Dolby.io's Interactivity APIs, formally known as Voxeet, into our application. Video chat can easily be integrated with Stream Chat API for a seamless communication experience. Note: This article's content is outdated. We now have our own Voice & Video
How to Build a Twitch Clone Game Live Streaming App for iOS
In this tutorial, we'll use Stream Chat and Dolby.io's Client SDK to build an app that lets you create a room that streams the contents of your screen and your voice for a large number of viewers and allows them to interact with each other via chat. It will be as simple as possible for
How to Build a Chat App with SwiftUI: Part 1
In this tutorial, we'll build a simple chat application for iOS and macOS using SwiftUI and Stream Chat's Swift SDK. Although Stream provides a suite of UIKit components that work out-of-the-box, we can use use the low-level client to develop custom components with SwiftUI. If you get lost during this tutorial, you can check the
Add Livestream Chat to your Android App
Live streaming apps have become the most popular type of application in the App Stores. Big companies, like Google, Amazon, Facebook, and Twitter, have, at least, one app offering this kind of service. For example: YouTube, Twitch, Instagram, and Periscope. All of those have a common companion feature: Livestream Chat. Livestream Chat is a crucial
How to Build a Cross-Platform iOS and macOS Chat App using Stream
Apple's recent release of Mac Catalyst makes it possible for iOS and macOS apps to share mostly the same native codebase. While in the past, a desktop and mobile cross-platform codebase commonly meant a web app packaged in a portable format, now it can be achieved with native code just as quickly. That means less
Encrypted Chat on iOS (Swift)
In this tutorial, we'll build encrypted chat on iOS using Swift. We'll combine Stream Chat and Virgil Security. Both Stream Chat and Virgil make it easy to create a solution with high security with all the features you expect. These two services allow developers to integrate chat that is zero-knowledge. The application embeds Virgil Security's
How to Create a Live Streaming App for Android
As we seek to still connect with friends and family while we all #stayhome, live streaming and video conferencing have become insanely popular. These technologies have always been great tools for connecting with coworkers and loved ones who are not located nearby; however, we are now seeing incredible growth in their use for connecting with
Creating a Realtime Chat Application with Django and Angular
💡 An updated version of this tutorial exists! Angular devs can now use our dedicated Angular Chat SDK to build in-app messaging experiences faster than ever. You can still skim the post below for inspiration, but our new official Angular Chat App Tutorial is the place to find up-to-date info and a much simpler approach.
Building a Social Network with SwiftUI – Part 3 (Group Channels)
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 part 2, we only