URL shortener is a service or technique to make a long URL string is accessible through substantially short and more memorable URL, and most of you are probably already familiar with it. It is basically make a long URL like this https://note.hadna.space/getting-started-with-tuya-api-for-iot-development can be accessed through a shorter URL like this https://go.hadna.space/5dnkg.

There are several use cases why people love to use URL shortener:

• Sharing links through social media or chat app with character limit
• Aesthetic purpose; short URL tend to be more aesthetically pleasing to read
• Hiding the real URL destination; usually used by affiliate marketer
• Difficult or unfamiliar long URL string with multiple parameters
• The URL will be printed; think about magazines, posters, pamphlets, brochures, etc.
• And many other cases

Even though I mention the technical part in this note, but it is not about a tutorial on how to build a URL shortener, if you want to check the code, go to my Github repository.

Why I build this?

There are countless URL shortener services available in the internet (including the open source ones), but why did I still decide to build it myself?

The answer is: why not?

It is a nature or habits of a developer to build something, either to spend some free time or exploring a new tech. The latter is my reason why I build this URL shortener myself, and the techs that I'm currently exploring are FaunaDB and Auth0.

The URL shortener itself can be accessed at go.hadna.space.

FaunaDB & Auth0

If you haven't heard of FaunaDB, here's the explanation from their website:

Fauna is a flexible, developer-friendly, transactional database delivered as a secure and scalable cloud API with native GraphQL. Never again worry about database provisioning, scaling, sharding, replication, or correctness. Source.

And in case you haven't heard of Auth0, here's the explanation from their website:

Auth0 is an easy to implement, adaptable authentication and authorization platform. Basically, we make your login box awesome. Source.

I heard FaunaDB for the first time from a nice client I've worked for when he told me that they use FaunaDB in the company, and he asked me nicely to explore it. It was nice, fun, and such an enjoyable experience exploring it, although the learning curve is quite steep. Especially if you don't enjoy reading long documentation and learn by exploring it yourself. StackOverflow? I don't think you can really depend on it since there are less than 1,000 Google search result in SO about FaunaDB.

Here's the Google search results for FaunaDB compared with another popular databases when this note is written (September 26, 2021):

I'm using this search query: <database_name> site:stackoverflow.com

I would say that you have to be mentally ready and prepared if you want to explore this FaunaDB.

For Auth0, the first time I heard it was from Hashnode August Hackaton event which featuring Auth0 as the main partner. You can read more about this past event here https://go.hadna.space/84yav 😛.

About Go!

Currently, there are only 4 screens in this URL shortener: the login screen, the URL shortener screen, an interstitial screen (the screen you see before you are being redirected), and the 404 page.

All those screens are minimalist and straightforward and I'm really sure that you won't be confused.

1. Login screen

The login screen is featuring a big text saying "Go!" with a little description beneath and a login button.

Click the Login button to login using Auth0. You will be redirected to Auth0 login page when you click this button. I do not store your login information, instead it's 100% handled by Auth0 and I only receive the info of who is logging in after you are successfully logged in. That's it. Simple and convenience.

2. URL shortening screen

This URL shortening screen is also straightforward. There is an input form where you will put your long URL string with copy button at the right side which will automatically activated and able to be clicked after the short URL is generated by clicking the yellow "Reducio!" button.

At the time of writing this note, the check history link below the yellow button is not yet implemented.

3. Interstitial screen

It is just a plain purple screen with a line saying "Please wait while you are being redirected...". Behind this process, the Go! will check to the database whether the short URL is available or exist in the database or not.

If the short URL is exist, then it will redirect you to the destination URL. If the short URL does not exist in the database, it will show a simple 404 error line.

4... 04 screen

If the requested short URL does not exist in the database, you will see this message.

Wrapping up

The features from this Go! URL shortener might not be as complete as the other URL shortener services available in the internet, but it gets the work done.

If you are interested in using or contributing to this Go! URL shortener, you can fork the repository here https://github.com/dkhd/go-url-shortener, and send your PR.

If you want to add new features or make a new screen, please make it as minimalist as possible as we don't want to a build a URL shortener with too much complexity.

I hope you enjoy!

---

The featured image in this post is edited using my Spotify Photo Filter which you can use for free from my Mini Product.