Build a Real-Time Chat App with Ionic, React, and Stream

Nick Parsons
Webtips
Published in
8 min readFeb 20, 2020

--

How to Build an Ionic Chat App with React and Stream

There is a massive difference between platforms such as React Native and Flutter compared to Ionic. Ionic believes that the open technology that powers today’s web is the future and should be used to build mobile apps. Due to that approach, Ionic is one of the only popular platforms that allow you to reuse the same codebase for both web and mobile devices — allowing you to keep your code DRY (don’t repeat yourself).

Flutter and React Native, on the other hand, replace the web tech stack. Flutter does this with its rendering engine, and React Native hooks into the iOS and Android’s native rendering engine.

The benefit of Ionic is that you’re using web-based technologies and can reuse a single codebase. Whereas, Flutter and React Native do not allow you to reuse code as much; however, their performance is much closer to a native application feel. Still, having the ability to keep your code DRY is and should be the primary goal with any application build.

In this tutorial show, I’ll walk you through how to build a real-time chat application using Ionic, React (yes, the same version you use for the web) and Stream’s real-time Chat API.

If you want to skip ahead, a demo is available on Appetize, so you can evaluate performance yourself (note that Appetize does slow things down…

--

--