Build a URL Shortening service in dashdash

[choraria]

Hey!

I bet by now you’d know looking at the title what’s this going to be about and yes, it’s yet another implementation of how you could build a URL shortening service but no, I’m not from any company that sells this service

So, let’s begin!

Prerequisite

Here’s all you’d need, to get started -

1. A free Firebase account because we’ll use their Dynamic Links services to build our URL shortener
2. A domain name of your choice, preferably one that is super small - I recently purchased jnx.pw via Namecheap as it costed me less than $2

In case you find it boring already, here’s a view of the full implementation to get you going again -

Demo

I’ve also opened it up for ya’ll to give it a whirl

Setup

Let’s break this down into -

1. Setting up Firebase
2. The publicly available web app and
3. The bulk shortener where you could actually store your API credentials and other details

Firebase setup

1. Once you’ve signed up for a Firebase account, navigate to setting up your custom domain via Firebase console.

Note: DNS propagation may take it’s own sweet time - sometimes, it happens in under 15 mins. and other times, it could take as long as 24-48 hours and so, in case you need a / break, this could be a good time!

2. Get your “Web API Key”, which can be obtained on the project settings page in your admin console.

dashdash Defaults

1. Create 3 views; for ease of convenience, name the first one as ‘Web App’ (or whatever you find catchy)
2. Name the 2nd one as ‘Web App Logs’ - this is where we’ll store all the long & short URLs along with the time they were created - and the 3rd one as ‘Bulk URL Shortener’.

Bulk Shortener

Let’s start with this section first as it’ll contain our API credentials that will not have any public viewing access.

1. Update the following cells as below -

Col A:

A1: Web API key
A2: Endpoint
A3: Domain

Col B:

B1: < paste your Firebase web API here >
B2: < =CONCATENATE("https://firebasedynamiclinks.googleapis.com/v1/shortLinks?key=",B1) >
B3: < the domain name that you must've configured in Firebase's Dynamic Links >

2. Make cell D2 a button - for now, name it as Shorten it! and update cell D3 with the following formula -
   =IF(D2="Shorten it!",FILL(B6:D6,COUNTA(A6:A)-1,0),"")

3. Next, update the headers of the table in row 5 as below -

A5: LongURL
B5: Body
C5: POST request
D5: ShortURL

It should starting looking something like this post formatting -

4. Finally, update the formulas in the following cells as below -

B6: =IF(A6="","",PAIR2JSON("dynamicLinkInfo",PAIR2JSON("domainUriPrefix",$B$3,"link",A6),"suffix",PAIR2JSON("option","SHORT")))

C6: =IF(OR(A6="",B6=""),"",POST($B$2,"{}",B6))

D6: =IF(C6="","",PARSE(C6,"['shortLink']"))

All you’ll need to do now is start adding URLs under Col A i.e. ‘LongURL’ and once you’ve added a handful, hit the ‘Shorten it!’ button

Web App Logs

1. Start adding headers in row 3 as below -

A3: LongURL
B3: ShortURL
C3: CreatedDate

It would look something like this post formatting -

Web App

1. Update the following cells as below -

B1: URL Shortening Service
A3: Enter Long URL here:

2. Make cell B3 an “Input Field” & C3 a button - for now, name it as Shorten it!.

It’s not much but the view should look something like this post formatting -

3. Enter the formulas in the 2 required cells -

B5: =IF(B3="","",IF(C3="Shorten it!",PARSE(POST('Bulk URL Shortener'!$B$2,"{}",PAIR2JSON("dynamicLinkInfo",PAIR2JSON("domainUriPrefix",'Bulk URL Shortener'!$B$3,"link",B3),"suffix",PAIR2JSON("option","SHORT"))),"['shortLink']"),"Press 'Shorten it!'"))

B6: =IF(AND(C3="Shorten it!",B3<>""),INSERT_DATA(PAIR2JSON('Web App Logs'!A3,B3,'Web App Logs'!B3,B5,'Web App Logs'!C3,NOW()),'Web App Logs'!A3:C3),"")

4. Finally, under the “Publishing Settings”, change only this sheet to be publicly visible.

et voilà !

You should now be able to use this setup as both a web app and a bulk URL shortener.

Cheers,
Sourabh (@schoraria911)