Electron & React JS: Build a Native Chat App with Javascript


Learn how to build a chat app with Electron & React JS. Utilize React JS + Firebase(DB) to create a fully native app.

What you’ll learn

  • Understand how Electron JS works
  • Create a “real-life” chat application
  • Create native apps with Javascript, Html + CSS
  • Learn how to use React JS in combination with Electron


  • Basic/Mid understanding of JS(ES6) & React JS required!



If you can build a website, you can build a desktop app. Electron is a framework for creating native applications with web technologies like JavaScript, HTML, and CSS. It takes care of the hard parts so you can focus on the core of your application.

React JS:

React makes it painless to create interactive UIs. Design simple views for each state in your application, and React will efficiently update and render just the right components when your data changes.


Firebase gives you functionality like analytics, databases, messaging, and crash reporting so you can move quickly and focus on your users.

— Course Overview —

In the first section, you are going to learn what Electron JS is and what features it offers. We will learn basic concepts like the main and renderer process among many others.

In the second section, we will create multiple views like Home, Chat, Settings views, and many others. We will integrate the routing system so we can navigate between the views. I will show you how to use Firestore queries, how to fetch and manipulate data.

The third section will be dedicated to authentication. We will create a login and register form and I will teach you how to handle errors coming from Firestore. Only logged in users will have full access to our application.

In the fourth section, we will explain redux middleware and we will work on the Notification feature. The application will be able to detect whether the user is offline or online.

Who this course is for:

  • Developers looking for a very practical guide
  • People wanting to utilize web technologies(JS, Html, CSS) to create native apps
  • Developers looking for an easy way to create native applications

Electron & React JS: Build a Native Chat App with Javascript Download Link