Make All The Things Web on Andrew Smith

Supabase JavaScript library is not a ORM or a query builder, it's a RESTful API URL constructor

Tue, 27 Jan 2026 00:00:00 +0000

Many people think of the @supabase/supabase-js library as an ORM or a query builder, but in reality, it’s neither. Instead, it provides a clean API layer for many of Supabase’s services. In this discussion, we’ll focus only on the .from portion of the library, as this is where its querying capabilities live.

.from()

There’s a common misconception that this part of the JavaScript library is an object relational mapper (ORM) or a query builder. Under the hood, however, it’s simply constructing a RESTful API URL path. That request is then sent to a server, PostgREST in this case, which handles query construction and executes it against your database.

First things I do when setting up a Supabase project

Wed, 07 Jan 2026 00:00:00 +0000

Here is a list of some things I like to do when first setting up a Supabase project.

Update the Email Templates

This step is critical when working with Supabase. The @supabase/supabase-js library was originally designed for single-page applications (SPAs). When building server-side rendering (SSR) applications, the library is not fully compatible by default. To address this, Supabase provides the separate @supabase/ssr library. However, this library uses Proof Key for Code Exchange (PKCE) authentication by default, which does not work well with certain email-based authentication flows, such as confirmation links.

Integrating Supabase Storage with Payload CMS Using S3 Compatibility

Mon, 14 Jul 2025 00:00:00 +0000

Supabase streamlines the process of working with file storage by offering an S3-compatible API. This compatibility enables developers to integrate Supabase Storage seamlessly with any library or tool that supports the S3 protocol, such as those designed for Amazon S3. Leveraging this feature allows you to implement robust file management without having to learn a proprietary system, making Supabase a practical and efficient choice for both new and existing applications.

Performing full text search with the Supabase Python library

Tue, 23 Apr 2024 00:00:00 +0000

Prerequisites

This article assumes you are familiar with Python. It also assumes that you have read the Supabase documentation and are familiar the with concept of Full Text Search.

We will use the following tools

Poetry - we used version 1.8.2 for this article.
Supabase CLI - we used version 1.161.0 for this article installed via npx. Alternatively you can use the Supabase Dashboard if you don’t wish to setup the CLI and docker in order to use it.

Setting up project

We will first create out project directory and install all the dependencies with Poetry.

Your database is the source of truth

Sat, 17 Jun 2023 00:00:00 +0000

There is this new trend where some developers are saying if they want to see what the database looks like when using a migration strategy then the declarative strategy is better because you can look at a single file (schema) to see what the database looks like.

Migrations can contain more than table schemas

I find the single file argument to be false because a database contains more than table schemas and most of the declarative migration tools mainly cater for database table schemas. But what about functions, views. row level security (RLS) policies and even custom enum types? these normally don’t get catered for in an easy to manage way with these declarative migration tools.

Writing more, procrastinate less

Sun, 12 Jun 2022 00:00:00 +0000

I want to write more but I keep on starting then stopping, I’m not sure why this happens. I sometimes feel like my writing isn’t that great and get put off from writing, but at times I am very passionate about a topic and can write for a good 3 - 4 hours about it.

I know the on/off writing is something that happens every year for me because when I look at my blog posts on my personal website I can see a pattern. I go a few months where I am in full on writing mode, then the rest of the year is just full of no writing at all.

Using PowerShell to remove a directory and its content

Fri, 21 May 2021 00:00:00 +0000

As a returning user of Windows after a long time using macOS I now need to do certain tasks with a command line/terminal. On macOS, I’ve gotten used to all the commands in iTerm 2 and have created several aliases to make certain commands easier to type.

I was trying to remove a directory and all its content recently on Windows and noticed that rm will only take you thus far as it doesn’t allow the removal of directories with content in it. I started looking at how this can be accomplished inside of PowerShell and while doing so I found the Remove-Item command. I dug a bit further into this command and found out it has a -recurse and -force parameters, these can be used to remove an entire directory and its content with it.

How to use dotenv with Svelte 3

Mon, 11 May 2020 00:00:00 +0000

I have seen this question come up numerous times in the svelte discord chat, so I have decided to write a short guide on how to get dotenv working with Svelte 3 . I won’t be walking through setting up Svelte 3 in this guide, but you can check out the Svelte website for that. Before we go into how to set up dotenv, let’s talk a little about dotenv first.

What is dotenv?

Dotenv is a node module that loads .env files, which contains environment variables into node’s process.env.

Creating a reusable component with Svelte 3

Wed, 22 Apr 2020 00:00:00 +0000

Svelte 3 has a small API surface and allows you to create components as simple as you want. You can also create complex components with a bit more effort. Reusable components is one of the goal’s of all major frontend framework and Svelte is no stranger to this. When I talk about reusable components I mean components that you can define what action it should take and how it looks.

Props vs event dispatcher with Svelte 3

Tue, 21 Apr 2020 00:00:00 +0000

Depending on what other component libraries you’ve used, you may be used to handling events by passing callback functions to component properties, or using a special event syntax – Svelte supports both, though one is usually more appropriate than the other depending on your situation. This post explains both ways.

This is the basic button component that we will be using for this article.

<button on:click={() => alert('Life has never Svelte better')}>
	Hello World
</button>

The Property (prop) way

This method is widely known in the React community and its the idea of passing the action down as a prop to the component itself. With this setup, we can create a default action that should take place if one wasn’t passed down.

Multiple zsh configs in iTerm

Sun, 12 Apr 2020 00:00:00 +0000

Create a profiles directory inside of .zsh

Inside of your user’s directory find the .zsh directory, cd into it and create a directory called profiles.

This profiles directory is where we will put our different config files for zsh.

Create an .zshenv file

Create a .zshenv file inside of your user’s directory (/Users/~username) if you don’t already have one.

Add a ZSH_DIR path pointing to the ~/.zsh directory you created earlier.

Switching from Dropbox to OneDrive

Wed, 11 Mar 2020 00:00:00 +0000

The Reason

Like many people, I started using Dropbox to store data in the cloud and sync data between different computers. Before getting a paid plan I invited people and got up to 5GB which was good at first. As my needs got bigger I had to upgrade to one of their paid plans in 2016. This plan cost £79.00 a year, it was called Dropbox Pro then and this changed to Dropbox Plus in 2018.

Writing Process

Sun, 08 Mar 2020 00:00:00 +0000

Thinking of a topic

I normally take some time to think about what I should write about, I have a few questions I normally ask myself:

who am I writing this for future me or someone else?
do I have enough knowledge on the topic?
what should be the take away from this topic?

Using a mind mapper tool to get my thoughts out

I then dive into my mind mapper tool of choice WriteMapper, as it is more built around a writers experience and it also has a really good keyboard shortcuts.

How to bulk delete Firebase authentication users

Wed, 11 Dec 2019 00:00:00 +0000

I have been working with Firebase a lot in the last year, we make heavy use of anonymous users. I have noticed that the system generates a lot of anonymous users each time I open new browser sessions.

I needed to remove some of these over time but found there was no easy way of doing so. The Firebase Authentication console allows you to remove these users one by one. But as a developer, I wanted to remove these programmatically.

Protecting routes using Regex in Amber Framework

Sat, 12 Jan 2019 00:00:00 +0000

This felt like a better way of defining public routes as it gave more control. Adding REGEX_PATHS alongside PUBLIC_PATHS allowed for a more flexible and fine grained auth check.

Using the following code in the public_path method worked really well.

private def public_path?(path)
    return true if PUBLIC_PATHS.includes?(path)
    REGEX_PATHS.any? { |word| path =~ word }
end

We are checking if any of the PUBLIC_PATHS or REGEX_PATHS matches the path from the context.request. If there is a match this will return true and move on to the next middleware.

Rendering a different template with a Controller in Amber

Thu, 10 Jan 2019 00:00:00 +0000

In Amber if you want to render a different template with a controller not matching its name, you can just pass the path to it in the render function. Paths in render are by default relative to the views directory, lets look at an example below to illustrate this.

| HomeController

class HomeController < ApplicationController
  def index
    render "index.slang"
  end
end

In this controller, the render method will look for index.slang inside of the views/home/ directory.

How to use Google Analytics with Sapper

Sun, 20 May 2018 00:00:00 +0000

Adding Google Analytics to any website should be pretty straight forward once you have the code snippet that Google provides you with. But when you want to dynamically populate the actual tracking id it gets a bit harder, especially when using a Universal Javascript framework.

For this project I decided to use Sapper which is an Universal JavaScript framework built on top of Svelte. At the time of writing the version of Sapper is 0.12. Sapper has some really nice features out of the box, it has hot module reloading, directory based routing, code splitting and offline support to name a few.

Dynamic import in Sapper

Sat, 19 May 2018 00:00:00 +0000

There are times that you will need to use a library that is purely client side in Sapper and some of these libraries make use of client side properties that are not available on the server. i.e. document

When you have hit such a case, its time to employ dynamic import. Here is an example below of how to make use of this.

export default {
  async oncreate() {
    const { default: SomeLibrary } = await import('some-library')
    this.someLib = new SomeLibrary(this.refs.thing)
  }
}

That is all you would need in order to load up your library dynamically and since we are doing this in the oncreate, this will only every happen on the client side.

Creating a Twitter tweet box with Svelte

Wed, 20 Sep 2017 00:00:00 +0000

Today I want to go about creating a Twitter tweet box with Svelte. But before I start on this, I want to just point out some of the features that the official Twitter tweet box provides.

Features

Character count
Emoji selector
Image/Video upload
GIF selector
Poll creator
Location flag

We will not be attempting to build all of these features in our version, I am even inclined to say that our version like most versions you find online are not really Twitter tweet box clones. They are something completely different. So the only feature we will be adding to ours is the Character count feature, but lets look into this even more.

How to do web scraping with Cheerio

Tue, 29 Aug 2017 00:00:00 +0000

This past weekend (13 August 2017) I started on a quest to get some data from a cinema website here in Accra, Ghana. I thought this would have been easy, since the data is available publicly. I immediately opened the Chrome web inspector to see some markup like I have not seen in years.

The Problem

There was no structure to this data, the listings were just a bunch of <p> tags with some nested <span> and <br> tags inside. This to me was a sign of a no go, I even went on to state that there was no way of getting this data in the DevCongress (you might be wondering what DevCongress is, more to come soon) slack group, along with a solution I wasn’t too sure would work.

Getting started with Svelte

Wed, 02 Aug 2017 00:00:00 +0000

Svelte is not a framework like the other conventional Javascript frameworks. Svelte is an Ahead Of Time (AOT) compiler, so in the end the code that get shipped is just plain old Javascript with minimal runtime overhead. This is one of the reasons why Svelte is so fast, in some cases my entire Svelte application is smaller than the entire React library.

To use Svelte, you can install its cli tool or if you just want to experiment, you can make use of its online REPL. For our setup we will make use of the online REPL.

Refactoring to a service in Trails

Sun, 19 Mar 2017 00:00:00 +0000

Since I started working with Trails, I have come to like its approach to a lot of things. I feel its what I have always been looking for in a Node web framework. At the moment the documentation is not completed but there is enough information to got you started with Trails.

From my last post you can see I am trying to build something with the Instagram API, I had to change from using the bell for social authentication to the actual [Instagram node library][], the reason for this was that both were not compatible with each other (this however may be due to my lack of experience, if you know how to get them to work together reach out to me please). When I changed the code I started by writing the social auth in InstagramController, auth method. For authentication I was following an article about building a an instagram postcard app and they suggested using Bluebird to convert callbacks into promises. This is what my InstagramController looked like after I was finished:

Social Auth with Trails using hapi and bell

Fri, 10 Mar 2017 00:00:00 +0000

This is my first time using Trails and I decided to follow to the guides. However as I continued I wanted to test it out on my own ideas. One of my idea was to get social login with Instagram and get some images from Instagram based on tags.

I read about Trailpack and thought I could just use one to deal with this, but after realising that I had chosen hapi during the creation of the project, there aren’t many Trailpacks for that setup. I then did a search online and found that there is a plugin for hapi called bell which allows for social authentication. After finding this, I thought the process should be straight forward to getting bell working, but due to my lack of experience with both Trails and hapi this didn’t seem so easy for me after all.

Passing Static Attributes Down With RactiveJS

Sun, 05 Jun 2016 00:00:00 +0000

I really like RactiveJS and how the inner workings work most of the time. I recently ran into an situation where I needed a component to behave a particular way and this was a challenge at first but with the help of Rich Harris (creator of RactiveJS) I was able to find a solution.

Before jumping to my current solution I will evaluate another potential solution and explain its shortcomings.

In my scenario I want to create a Ractive component and pass attributes (props or whatever you want to call them) into the actual template of the component. In this example I will do it all by manually stating the attribues I am expecting on the component template itself.

List of Slim 3 middlewares

Tue, 27 Oct 2015 00:00:00 +0000

Recently folks have been asking about what middlewares are available for Slim 3. Although Slim 3 is still in RC stage, there have been a number of developers who have decided to create middlewares already. Here I am going to list the ones I think are beneficial to the community and to keep an eye on.

Before I continue, do note that most PSR7 middlewares should work with Slim 3, we have intentionally not included an Interface for PSR7 middlewares in order to keep the PHP eco-system healthy. We also promote the use of PSR7 methods in middlewares and not use Slim specific methods where possible.

Lazy loading your controller action

Thu, 27 Aug 2015 00:00:00 +0000

In many popular frameworks these days you can lazy load your actions in order to not invoke every action unless it is the one matched that should be dispatched.

We have multiple ways of doing so and in this article I will talk about a few different ways of doing this. I will be using Slim 3 code for examples.

Anonymous Function

This is one of the popular approaches you might take when first starting with a micro-framework like Slim. Everything is stored in the anonymous function itself for quick and dirty prototyping.

Why is Slim 3 not so slim anymore

Sat, 01 Aug 2015 00:00:00 +0000

There is a common misconception that Slim 3 has plenty of files and is no longer slim. Slim 3 does indeed contain more files than Slim 2 and this has been the result of being more flexible and moving away from the Not Invented Here (NIH) philosophy.

Installing Slim 3 through composer will install all its dependencies, when doing a PHP file count you will notice we have doubled in file count. This is a given with the amount of flexibility we now have. Most developers might not see any benefit in this as they will likely just work with what is provided, but if at any point you should hit a limitation in any working part of the framework, you can easily swap it out without a fuss.

Aura Di service aliasing

Thu, 30 Jul 2015 00:00:00 +0000

I have been working on a legacy application and wanted to remove the old process of how it lookup its services from file name and database entry to using a service locator container instead. I looked at a few DI containers and went along with Aura Di.

I was happy that it would allow me to work with it as a service locator as I wanted for backward compatibility in the application. In the legacy code, service names vary and look like error.handler, while we want to refer to them by using PHP 5.5 class name resolution ErrorHandler::class.

Slim PHP 101 - Using Laravel config package

Fri, 11 Apr 2014 00:00:00 +0000

Over the past few years Laravel have become a popular full stack PHP framework and with its latest version (L4) the framework have been componentized. Now we can make use of most of Laravel components outside of the framework, the author of the framework have created packages under the name illuminate.

Today I will show you how to integrate the Config package into Slim and make use of it. Before we move on to that, some may ask what value will this add to Slim since we can already store settings inside of Slim. With the Config package we can store settings into separate files and we can also make use of the cascading folder structure for different environments.

Slim PHP 101 - How to use multiple view parsers

Thu, 10 Apr 2014 00:00:00 +0000

In this post we will go through setting up Slim to work with multiple view parsers, for this example we will look at using Slim’s PHP view library and the Twig view library. In order to use Slim with Twig we need a view parser, luckily enough there is already one created in the Slim Views repository.

We will be using composer to install all our dependencies.

Composer setup

Our composer.json file will look like below.

Why no promise AngularJS 1.2.0+

Wed, 20 Nov 2013 00:00:00 +0000

In the latest version of AngularJS (1.2.0+) there seem to have been a change which will probably break most apps which have in the past relied on the view unwrapping the promise object and showing the results directly in the view.

After searching online and not being able to find any fix for my issue, I resorted to Twitter as it seems like I normally get quicker results on Twitter than I do searching Google when it’s AngularJS related.

Using Schema Builder with CLI Migrations

Tue, 23 Jul 2013 00:00:00 +0000

The PHP Framework market landscape has changed recently with the anticipation of Laravel 4, the most expressive PHP Framework to have come out of the techworks. The anticipation of this framework is not only due to its easy to use expressive syntax but is also due to the changes that L4 was bringing to the community.

This version of the Framework has been moved to a component based approach which allows other developers in the PHP community to make use of certain aspects of the Framework outside of the Frameworks.

More is coming for MODX

Fri, 14 Jun 2013 00:00:00 +0000

Over the past few months some interesting development have been happening in the MODX community. One of those changes is the whole transition between the SiphonLabs team and the MODX team. Now that the skies have cleared of all the cloud, I am happy with the progress of both companies.

SiphonLabs will be at this year’s Wordcamp go check them out.

Other changes that I am really happy about is the announcement of modmore. This is a new company by community member Mark Hamstra selling professionally developed MODX addons (extras as some call them). This has been something the MODX community have been lacking in the past and to see a viable commercial marketplace being opened is a great thing.

Yet Another CMS/F Thingy called MODX

Mon, 01 Apr 2013 00:00:00 +0000

Some of you might have seen my many rants on Twitter about the state of MODX, I have grown weary and have now decided to fork it. I have decided to also name my fork “MODX”, yes this is for real, you don’t believe me. Proof right here.

I have been called fearless, but with the unknown of MODX why wouldn’t I be?

In this post I will be talking about what my MODX 3 will bring, I will try and be as un-detailed as possible (yes un-detailed is a word, well so I say).

Build Awesome

Sat, 16 Mar 2013 00:00:00 +0000

This article is not about building the next rad web app, if you are after that then you might want to go check out some of Drew Wilson’s work, otherwise continue reading.

The web is full of open source projects that developers use day to day, these projects might not always suit our needs or sometimes might not be built to our liking. There is a continuous trend of developers/designers complaining about how horrible an open source project is and some (including myself) take their rant onto twitter to complain. This then starts to spread like wildfire at times and can get out of hand.

About

Mon, 01 Jan 0001 00:00:00 +0000

I’m Andrew Smith, a Full Stack Developer passionate about building scalable, high-quality solutions and improving developer experiences. With experience spanning open-source contributions, product documentation, and end-to-end feature delivery, I combine technical depth with a collaborative, user-focused mindset.

Over the past several years, I’ve worked across developer advocacy, cybersecurity, and e-commerce projects most recently at Supabase, Spinning Fox, and Inocan Group. My work has included enhancing authentication workflows, integrating modern frameworks like Next.js and SvelteKit, gathering community feedback to inform product improvements, delivering core platform features under tight deadlines, and boosting application performance through smart architectural decisions.