Company
Date Published
Author
Arek Nawo
Word count
1610
Language
English
Hacker News points
2

Summary

Firebase is a popular backend as a service (BaaS) offering created by Google that provides a database, file storage, user authentication, and real-time communication. However, it's closed source, meaning all data is under Google's control. Supabase is an open-source Firebase alternative that offers similar functionalities without controlling users' data. In this article, we'll learn how to use Supabase with Replit to create a real-time chat app. The stack for the chat app includes Vue 3 and Tailwind CSS, allowing users to post short text messages to a public space. The backend is handled by Supabase's hosted solution, which offers a free plan sufficient for this tutorial. We'll set up both the frontend and backend of the application using Replit and Supabase, connecting them with the client library and implementing real-time communication. The chat app will be powered by a simple database to store users and their messages, and a reliable transfer method to post and retrieve messages. With the API connector ready, we'll design the frontend UI, creating a message list and input form using Vue Composition API. The returned object contains values required for the UI, like username and messages, as well as wrapper methods for sending new messages and loading older ones.