FYDLI URL Shortener

A URL shortener for the JAMStack.

This URL shortener uses Supabase to store short code and the long URLs they are to redirect to.

Redirects are processed using Netlify Functions (prior to v0.3.0 a Scheduled functions was used to rebuild the _redirects file at a set interval) which facilitates query strings on short URLs (see CHANGELOG for more on this and the additional /test path.)

New URLs are added via a single-input form—short codes are automatically generated.

Setup Steps

• Deploy the pre-launch directory to Netlify (use drag and drop.) This is placeholder.
• Next, configure a custom domain using Netlify DNS.
• While waiting for propagation of DNS, work through the configuration section below.
• Once propagation and configuration are complete, deploy the site from git (you can remove the pre-launch directory as it is no longer required.)

Configuration

For local development, store the following in a .env (or .env.local) file in the project root. When deploying to Netlify, configure these environment variables in the UI.

Supabase

A simple Supabase table is required. In the SQL editor, paste this SQL to generate the required table (changing table_name.)

-- Create the table
CREATE TABLE test_table (
  id bigint GENERATED BY DEFAULT AS IDENTITY PRIMARY KEY,
  created_at timestamp with time zone DEFAULT timezone('utc'::text, now()) NOT NULL,
  -- Make sure each short code is unique
  short varchar NOT NULL UNIQUE,
  long varchar NOT NULL,
  disabled boolean default false,
  user_id uuid NOT NULL
);
-- Insert some links
INSERT INTO test_table (short,long,disabled,user_id) VALUES 
-- GitHub links
('git','https://github.com/coelmay/fydli',false,'ad154745-0934-4e6e-9438-f168b9ae31b1')
,('issue','https://github.com/coelmay/fydli/issues',false,'ad154745-0934-4e6e-9438-f168b9ae31b1')
,('license','https://github.com/coelmay/fydli/LICENSE',false,'ad154745-0934-4e6e-9438-f168b9ae31b1')
-- Other important links
,('ntl','https://netlify.com',false,'ad154745-0934-4e6e-9438-f168b9ae31b1')
,('jam','https://jamstack.org',false,'ad154745-0934-4e6e-9438-f168b9ae31b1')
-- reserve links you don't want used; set disabled true
,('about','https://fyd.li/about',true,'ad154745-0934-4e6e-9438-f168b9ae31b1')
,('contact','https://fyd.li/contact',true,'ad154745-0934-4e6e-9438-f168b9ae31b1')
;

Environment Variables (Required)

If the following variables are not set, the deploy (or functions) will fail.

Short URLs

Character set for short code generation

SHORT_URL_CHARS=ABC123abc

Supabase

Settings for your project/table

SUPABASE_URL=https://xxxxxxxxxx.supabase.co
SUPABASE_KEY=ey...
SUPABASE_TABLE=table_name

Scheduled rebuild

The API ID of the site, and your UA string

NETLIFY_API_ID=0ajsoas9cjapc9japsc9ja0cj
API_UA_STRING=Your Name <you@example.com>

Contact

Set SMTP details as per mail host. Ethereal Email is great for testing.

MAIL_HOST=smtp.ethereal.email
MAIL_USERNAME=you@example.com
MAIL_PASSWORD=securepassword
MAIL_NAME=Your Name
MAIL_EMAIL=you@example.com

Site Name

What is the name of the site?

SITE_TITLE=FYDLI

Environment Variables (Optional)

Short URL length (defaults to 5 if unset.)

SHORT_URL_LENGTH=3

Is the site public? If not explicitly true, the build will assume the site is private and rename index.html.

PUBLIC_SITE=true

If not public you can set MAIN_PAGE to rename the index.html or leave undefined to generate a random name (which is logged to console).

MAIN_PAGE=shorten

If this is run as a private shortener, you could entirely remove the index.html (modifying build-site.js to remove the rename) and functions other than redir.js. To add URLs, you could (would) run a version locally using Netlify CLI to add new URLs.

Other Environment Variables

Built-in environment variables are also utilised. These are URL, and SITE_ID.

Other Setup

If you wish to know that re-deploys are succeeding at the set interval, consider using Deploy Notification.

HTML

The HTML pages are basic and minimal by design. There are only two by default. The redir.js function will return HTML and does share the same stylesheet. Custom these as you see fit, or add an SSG to generate required site pages.

Security

This was designed to scratch an itch, as something (semi-) useful to test Netlify's Scheduled Functions Beta (which is no longer utilised in this project). This is a (relatively) basic, open system (free, open, is good.) Functions are not protected by default (see this thread on the Netlify Forums for more.) It is entirely possible (testing has proven this) to modify scripts/pages to require sign-up/login using Netlify Identity or Supabase Auth (or other provider) to limit users, and hold users accountable for the links they create (i.e. banning those who use the site for illegal/unethical endeavours.)

License

Jam License.