How I used Supabase and n8n for my background tasks

Mathias Michel — Wed, 07 Dec 2022 09:22:53 +0000

If you're looking for a way to run background jobs, Supabase and n8n are two great options. Supabase is an open source Firebase alternative, and n8n is an open source Node-based workflow automation tool. Together they are a powerful combination for background tasks. In this post, I'll show you how I use these two tools for my projects einfachcrypto.de and illostration.com.

Setup of Supabase and n8n

If you have not worked with Supabase or n8n, here are some steps on how you can set these up.

Create a project on Supabase
Either use the cloud version of n8n or you can host it on Railway. They offer a template which you can use.
Connect your Supabase by creating a credentials entry in n8n. You can find them in Supabase under Project Settings -> API. You can read more here

1. Update coin data from CoinGecko

My passion project, einfachcrypto.de, lists the top 250 cryptocurrencies. It is a static site built with GatsbyJS. The list of cryptocurrencies is saved in a coins table in Supabase, and the gatsby-source-supabase plugin pulls all the data into the frontend. CoinGecko is the main data source. As the data, especially the price, changes quite often, I needed a way to update some of the data regularly. I am using n8n for a cron-triggered job, which fetches the latest information from CoinGecko and updates the coin entry in Supabase. This is how my workflow looks like.

Explanation of the steps

Cron: Trigger the workflow every X minutes.
Supabase: Get all coins which are outdated. I check the timestamp here to see when it was last updated.
CoinGecko: Get the latest data for each coin.
JavaScript node: Normalize and prepare the data structure so that it can be easily saved to columns.
Supabase: Update normalized data into the Supabase

2. Check the status of AI generation

I am using replicate.com to run the Stable Diffusion AI model for illostration.com. It is an AI infrastructure service that runs AI image generation (they call them predictions) for me. The API is built so that you first send a post request which triggers the prediction. You then have to poll every second and check the status of the prediction to see if it is finished. The response also includes the generated image. In Supabase, each prediction is saved in a predictions table, so I can track the status and retrieve the image.

This polling usually happens on the client side, but I have a case where I create multiple predictions in bulk. I am using a background job to update the status of the prediction and to retrieve the generated images. As I have production and staging Supabase environments, I am doing the same steps for both.

Explanation of the steps

Cron: Trigger the workflow every X minutes. (1 minute in my case)
Supabase: Get all predictions with a status of pending.
HTTP Node: Get the latest status from replicate API. This also gets the image url of the result.
Supabase: Update status and image url in prediction table

3. Reset credit at the end of the month

I used the nextjs-subscription-payment boilerplate for illostration.com. This boilerplate already includes two tables, subscriptions and users. For my credit system, I decided to keep it simple and just add a column for credits on the users table. Now I only have to check for active subscriptions and reset the credits at the end of the month. Each subscription includes the user_id and the amount of credits included.

Explanation of the steps

Cron: Trigger the workflow on the first day of each month
Supabase Get: Get all active subscriptions.
Supabase Update: Update user based on user_id and reset credits to the subscribed amount.

Resources

Check out Supabase launch week 6, which starts next week. They are releasing amazing features to Supabase in the next days. Head over to their launch week page and register for free.
Supabase Documentation
N8n documentation
Replicate Documentation

PS: This is my first blog post on dev.to. Let me know what you think. Should I share more insights like this?

DEV Community: Mathias Michel

How I used Supabase and n8n for my background tasks

Setup of Supabase and n8n

1. Update coin data from CoinGecko

2. Check the status of AI generation

3. Reset credit at the end of the month

Resources