What is Supabase and how to work with it

I’m talking about the Supabase project – a progressive database that can become a full-fledged alternative to platforms from Google and other providers.

Briefly about databases

A database (DB) is a repository of information for your services, websites, applications, offline businesses, and in general any type of content that needs more or less strict categorization and convenient sorting tools. Databases are used in almost every digital product you use: Notion’s note list is a database, Apple Music’s playlist is a database, even Community articles are stored in a database. Therefore, if you are a developer (and even a front-end developer), it is important to be able to work with the database at least at a primitive level.

But the database itself is a complex structure that requires many man-hours to master it at the proper level. But other developers have taken care of you, creating services that make it much easier to store information on the network, protect it, and transfer it to third-party applications. Supabase is just one of these services that turns complex into simple in just a couple of clicks.

What is Supabase?

It is a relational database based on the same technologies as PostgressSQL, one of the most popular and reliable databases in the world. But such a description is clearly not enough for Supabase, because this is a large project that includes much more interesting solutions than it might seem at first glance.

Supabase is a free analogue of Firebase, a multifunctional platform that combines several important software solutions and simplifies their implementation to an extremely primitive level, so that even beginners in development can easily add functions such as authorization, file storage, content updating to their applications or sites. on the site in real time, etc.

And you can try it all for free. Developers require money from the user only when the number of requests reaches certain values. That is, at the development stage, you will not have to pay for the database, all the features of Supabase can be tested on your own, and not rely on reviews and demos.

Let’s take a closer look at each aspect of Supabase.

Database

As noted above, Supabase is a relational database using SQL syntax. SQL is a special language focused on interacting with databases. It allows you to create special commands that force the mechanisms built into the database to either read information or add it (and perform dozens more actions, depending on the complexity of the command and the number of add-ons).

Supabase is open source, and therefore anyone can analyze it, which has a positive effect on the reliability of the service as a whole.

Of the features of the database, it is worth highlighting adequate support for web sockets, which allows you to track the appearance of new data in the database in real time and immediately reflect them in the application interface. In practice, this functionality can be used to create an analogue of Twitter, where it is important to always reflect up-to-date information.

Supabase also boasts a convenient visual table editor. With it, you can add new information to the database without using program code. Outwardly, it looks more like Microsoft Excel – you just add columns with data types, and then write this data into rows. The interface is obvious and familiar to everyone who has ever worked with tables (not even in the database).

Supabase is great for beginners because it doesn’t force you to write your own API to get “application to database communication”. Instead, developers offer their own library of already configured functions for connecting to Supabase, searching for information inside and adding new data programmatically. Ready-made functions for JavaScript can already be viewed in the official documentation, and their counterparts for other languages ​​will appear in the near future (according to the developers).

Authentication mechanism

An important advantage of Supabase is the built-in authorization function, implemented at an almost perfect level. This is the most convenient authorization service combined with a database that a novice (and not only) developer can find.

1. The developers offer their own API system for creating new profiles and logging in. No need to write your own code or connect third-party utilities. Is everything ready. It is enough to copy the code from the Supabase documentation, and now your site or application already has a fully functional and secure authorization window.
2. Supabase supports login with social media profiles and third party providers. For example, it supports Sign in with Apple, GitHub login or Google profile, Twitter, Slack, Discord, and many other platforms.
3. Authorization is closely related to the database, so the developer has the opportunity to clearly set up a security policy and, without leaving Supabase, set rules for users (to allow viewing or creating content, for example).
4. The Magic Link feature allows you to log in by email without using a username or password. Just ask the user to enter an email, and in a moment they will receive a login link without the need to provide additional data.

Also, the creators of Supabase took care of React developers and created a whole series of ready-made components that you can immediately add to your program without much work on the code.

File storage

Supabase comes with its own file storage that can be connected to the database to display content in the application interface that is not “suitable” for storing in tables. For example, you can add image files to Supabase, even at the stage of loading them into the database, create special links and assign them to articles, comments, profiles in Supabase tables. Thus, it is possible to bind files from the repository to records from the database, creating a seamless system.

Naturally, as in the case of authorization, the developers have provided all the code for you and created a bunch of ready-made commands for managing files. Loading, deleting, changing and displaying them in the interface is nowhere easier. Just copy a couple of lines from the documentation and substitute your own values.

In the near future, the Supabase developers want to add a few more expected features to the store:

• CDN servers so that file data reaches users faster.
• Transformations – mechanisms for transforming uploaded images and documents in order to reduce their size before “shipping” into the application.

Also, file storage is directly related to Supabase’s authorization mechanisms, which means that data security policies work for them as well. Unauthorized access excluded.

Functions

So far, this additional Supabase service is not available to the general public, but it already promises to be interesting, since in theory it will become an analogue of functions in Netlify and other cloud platforms.

The idea of ​​”functions” is to get rid of the server. Instead of renting your own VPS and setting up a backend to run any procedures and operations, Supabase will offer you its own resources to run specific functions.

For example, you have a website where the list of prices is updated daily due to some external function (parsing or API). And this function must be run on the server (either using your own scripts or using the cron scheduler). Supabase will allow the same functionality to be written into its production environment without the need to rent a separate server and set up a shell program to run a single procedure.

What can be created with Supabase?

Supabase is a fairly versatile product that includes many of the components needed to build complete applications. Therefore, the list of types of programs that can be created based on Supabase is quite wide.

You can:

• Develop an online store, as Supabase is based on PostgreSQL , and this platform is great for creating massive, complexly structured databases.
• Create your own equivalent of Twitter or online chat, as Supabase supports web sockets and allows you to exchange information through a real-time database.
• Launch a full-fledged blogging platform with its own backend instead of WordPress and other CMS. Supabase offers both a convenient system for issuing privileges to users and a built-in file storage for this.
• To dabble in creating full-fledged clones of such popular services as Trello or Notion.

The Supabase service is suitable for any task and at the same time it is designed in such a way as to remove almost all the work and responsibility from the developer. Therefore, the creation of the above applications and sites will not seem to you something unbearably difficult or too long. All the hard backend work has already been done for you.

Basic instructions for setting up Supabase

Getting started with Supabase is easy. It is enough to follow the simple instructions described in the official documentation of the service.

1. Create your own account on Supabase.com or sign in with your GitHub account.
2. Immediately after that, we get into the Supabase application, where you need to click on the New Projectbutton .
3. We indicate personal data, the name of the database, your location (you can specify any).
4. In the next window, click on the Create new tablebutton and enter the name of the table.

You will see an interface that resembles Excel or Google Sheets. Here we can manually enter the necessary information. For example, if we wanted to create a table with articles, we would make several columns (by clicking on New column ) and name them Title and Content (the title and content of the article). And then we would add rows (by clicking on Insert row ) to create a new data object inside the table and fill it with information according to the columns used. And in this way you can build a table for any kind of content.

To see how you can interact with tables programmatically from your application, you need to open the API section at the bottom of the sidebar of the Supabase interface. There is a list of commands for connecting to the database from third-party projects, and for managing information in the database.

Once connected, you can use other Supabase features without further configuration. You can use authorization mechanisms and storage using ready-made commands from the API that the Supabase developers have prepared for you.

It remains only to find hosting directly for your site or application.

Instead of a conclusion

That’s all. Supabase is a powerful product that replaces several third-party services at once, without which almost no modern application can do. At the same time, Supabase maintains ease of use, convenience, and security. This service can become a full-fledged basis for your front-end project. You will not notice any disadvantages in comparison with analogues in the spirit of Firebase and you will not spend a lot of time studying the features of the backend before launching your own project on the web.