Swipkit is a Webapp + Chrome Extension. Together, this project spans over 4 repositories. Since Swipekit is an indie business and I'm the sole developer, our tech is heavily focused on prioritising developer experience(DX).

In this post, I'll break down our tech stack and what decisions I made in choosing certain technologies.

Our Backend(API server)

Swipekit is primarily a backend tool. A lot of our processsing happens on our api server so I must ensure that it is running smoothly at all times.

Primary tech - nodejs
ORM - Prismajs
database - mysql

We host our infra on Digital Ocean. Their low tier Droplets have an excellent value for money.

For Mysql, we use their managed DB service.

Fun fact - Swipekit used to run on a single db instance powered by their mysql marketplace app. But I had a 5 minute downtime once and that freaked me out so I asap got our database on their managed instance.

Webapp(SPA Vuejs webapp)

Primary tech - vuejs 2
scss

The webapp was the smoothest part to build out, and I had a ton of fun desgining it.

We use npm workspaces to keep all the styles, vue components and other miscellaneous libraries synced between the webapp, nuxt app and even the chrome extension.

Landing pages, marketing pages and all other pages(Nuxtjs)

Primary tech - vue2 and nuxtjs in ssr configuration
scss

Nuxt was hard to get it right when using in its ssr configuration. I had to go through various different services between I finally settled on setting up nuxt on a DO droplet + Cleavr for the CI/CD.

We don't use any prebuilt css framework like Bootstrap, Tailwind, etc. Our design systems are built out on the webapp and we use npm workspaces to share the designs across the nuxt app and on the chrome extension.

Nuxt for the landing pages, marketing pages
Vue for the Chrome extension

Miscellaneous

Email Octopus - Email marketing. We use them since its free but their editor really sucks. Once we hit our MRR milestone, I'll be switching over to another email marketing service.
Sendgrid - They have a great free tier and hasn't let me down in reliability issues.
Cloudflare - CDN. Its a free CDN, can't get any better than this.

Honorable mentions

These tools/services really help us be more productive

Conclusion

I'm heavily focused on keeping things leaner and focusing on DX. This allows me to rapidly push changes.

Sometimes on the weekends, I'll be pushing features simultaneous to the webapp and the chrome extension multiple times. This is all because of the tech stack I chose.

Notes

Why not use Google Firebase or Supabase? - Tools like Firebase, Supabase, etc are great for quickly scaffolding your backend. However I'm pretty good with backend tech and I rather go with something I understand fully than learning new tech.
As must as I hate Nuxt, it won't have been possible to build the website without it. I'll make a seperate post diving deeper on setting up Nuxt ssr for production.
Chrome extensions can be a pain to develop for. Luckily I had domain knowledge building extensions for Chrome for some time. I also did a nice writeup on lowering your extension review time.
Whenever possible, go for fixed cost infra. This is why we choose Digital Ocean over AWS or something similar. railway.app early on was a strong contendor but their usage based pricing turned out to be too expensive for us.

Useful Articles

How to download ads from the Facebook ad Library?

How to create an effective UGC Creator portfolio?

How to download Tiktok videos?

How we built Swipekit - our tech stack

How to see competitors facebook ads

How to spy Linkedin ads?

Articles

Freebies

Links

Swipekit