Tutorials (3)

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 these authentication tokens to your app, you need to maintain a backend server.

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 times? This is what we refer

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 in it? The stream_feed Dart package (upon which stream_feed_flutter

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 extra step for developers who must translate animations and interactions built with these tools

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

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 headache. Stream challenged developer Vadim Savin, CEO

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 UI components, which are currently in beta. This follows the announcement of the stable version of Jetpack Compose. You

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 Implementing the ChatKit Interfaces Building the Channels Screen Building the

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 will cover the following sections in detail:

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 Chat API. We love this tutorial because it

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.

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 for several reasons. First and foremost, Brad Traversy, the creator of

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

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

It should be no surprise that some of the world’s most popular apps contain an activity feed as their core functionality. This comprehensive guide is a crash course in activity feed types, activity feed benefits and best practices, and real-world activity feed examples and use cases. We’ll also explore how you can quickly integrate a

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

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

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

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

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

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

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

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

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

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

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.

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

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,

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

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

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

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 and want users to be able to search blog posts by category.

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 core data models. It's now possible to use it in

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 folders. It also supports binary frameworks. It's clear that it's

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,

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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.

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

Android Studio makes it easy to push changes to your favorite Open Source, professional, or personal projects on GitHub. In this tutorial, we'll learn how to use GitHub with Android Studio. We'll use an Open Source contribution for context. Android developers use Open Source projects to speed up development or enable functionality that is otherwise

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

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

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

In this post, we'll create a simple social network, called "The Stream", that allows a user to post messages to followers. The app will allow a user to post a message to their followers. Stream's Activity Feed API, combined with Android, makes it straightforward to build this sort of complex interaction. All source code for

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

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

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

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

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

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

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

This article is the fourth installment of a tutorial series focused on how to create a full-stack application using Flask, React/Redux and Stream. In this article, we are going to start creating, editing, and fetching collections, or groups of links, for our web application. Be sure to check out the repo to follow along! Getting

💡 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.

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

In the second part of our series, we'll implement direct messaging between users by integrating Stream Chat. 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 so our mobile application can communicate directly with Stream's Chat API. The

In this post, we'll be creating a simple social network with SwiftUI, 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 view updates from people they follow. Stream's Activity Feed API, combined with Swift, make it straightforward to

In this series of tutorials, we'll create a simple social network, called The Stream, that allows a user to post messages to followers, chat either 1-on-1 or in groups. Stream's Activity Feed API and Chat API, combined with Swift, makes it straightforward to build this sort of complex interaction, with far less overhead than creating

"Social logins" are a very popular alternative to creating a login and password for a website or application that is new to a user. With "social login", a user makes use of an existing account, like Google or Facebook, to sign up for or log in to another application. This means users don't have to

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, we'll go through the

This article is the third installment of a tutorial series focused on how to create a full-stack application using Flask, React/Redux and Stream. In this article, we are going to finish implementing our authentication flow as well as integrating a basic profile component into our app. Be sure to check out the repo to follow

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 chat room where 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 world today is 3.5 billion; this means 45.12% of the

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 Chat makes that task just as

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 to still be able to win them over?!

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 chat on multiple platforms. When they come together, magic happens... 🔮 In

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, Stream Chat makes it super easy to create such an app quickly; you can

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 tutorial together. The

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 can be a frustrating experience. However, with advances

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 better and better in terms of development speed

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 iMessage Clone GitHub repo 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 Android, iOS, and the browser, which significantly reduces the time and cost

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 Laravel-based application. One

This article is the second installment of a tutorial series focused on how to create a full-stack application using Flask, React/Redux and Stream. In this piece, we are going to be starting our authentication flow with registration and user confirmation, as well as getting up and running with React-Redux. Be sure to check out the

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 providing a real-time chat solution, their feature set and capabilities were way

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 appropriately, giving the information it has gathered. Prerequisites You'll

This article is the first installment of a tutorial series focused on how to create a full-stack application using Flask, React/Redux and Stream. This tutorial is an adaptation of my previous series on creating a Stream-based web app with Flask, so be sure to check it out to understand some of the structure behind it

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 expect as a developer when creating a messaging app.

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 natural speech capabilities to implement this feature and Stream's Messaging Platform

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 your app, you need to follow

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 deploy it to Heroku, to take it public. The final application

This segment is the eleventh installment of a tutorial series focused on how to create a full-stack application using Flask and Stream. In this article, we walk through setting up our web app for deployment using Zappa and AWS Lambda. Be sure to check out the Github repo to follow along! This portion of the

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 application with Stream instead of months)!. By the end of

An activity feed is a list of recent actions happening in realtime. In this article, we’ll build a simple feed app powered by GitHub WebHooks and Stream Feeds in JavaScript. The app will track the activities of your GitHub organization or personal repositories. So, we’ll see what is happening right there from our app. For

💡 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 post below for its concepts and ideas, but

This segment is the tenth installment of a tutorial series focused on how to create a full-stack application using Flask and Stream. In this article, we are going to start styling our app and adding cool new features like notification counts and link previews. Be sure to check out the Github repo to follow along!

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 view. This allows us to focus on the text