Swipekit

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

Prismajs - This is a fantastic ORM and I highly recommend using this over existing nodejs orms. Make it a breeze working with sql databases and doing migrations.
Digital Ocean - Their simple pricing and excellent dashboard is a clear winner over using AWS. They have some reliability issues with their low tier droplets but they provide an excellent value for money
Cloudflare - We use their R2 storage which is insanely cheap as well. This is better than AWS because you don't need CloudFront + S3. With Cloudflare you basically get the CDN for free. And their free CDN is great too.
Cleavr - this is a very valuable CI/CD tool. Basically you connect Cleavr with Digital Ocean, AWS or any other cloud provider and they setup automatic deployments along with other value addons.
Directus - This is hands down, the best CMS I've used. Because of this, we can create posts - like the one you're reading - really quickly. We use the self hosted version and plan to do some amazing things with it in the future.
Render - This is currently the best Heroku alternative. If all you want is a simple stable api server with automatic deployments rolled in, I can't recommend this enough.

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.

I also use this same methodology on my other projects. This helps me stay lean and deliver features quickly.

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.