DEV Community

Cover image for Building In Public: Carta Tech Stack
Franco Valdes
Franco Valdes

Posted on • Edited on

3 1

Building In Public: Carta Tech Stack

In 2022, it is almost too easy to get a proof of concept built and launched for almost free. There are so many free resources, open source libraries and free hosting solutions available. Carta Maps leverages a lot of these and I will go one by one explaining what I chose, why I chose it and what my experience was with it.

First and foremost, the language and framework – Typescript & React. Typescript is a must for a project of this size. It provides safety and peace of mind as I iterate quickly to solve bugs and add new features. React is a by-product of the next two things I will mention, Next and Remix. Both of these are higher abstractions on top of React and supply incredible tooling to build fast server side rendered applications. Picking one or the other was driven by my database and auth provider, Supabase. I could have tried to make it work with Remix, but there was already an authentication helper for Next from the Supabase community so I decided on Next. Still using Remix for this current website since I do love Remix so much.

Supabase, is a Firebase alternative built on top of Postgres which is extremely powerful. I like Firebase too, but I like the idea of a defined schema for a project like Carta. NoSQL approaches have their place but they also scare me a bit. In addition, Supabase’s RLS (row level security) is a next level supapower that you just can’t live without after you use it. It not only simplifies all my queries but also provides an implicit security with minimal work.

Next up, component library and CSS frameworks. For this, I am using a combination of Tailwind and Mantine. Tailwind is used mostly for layout and responsive design. The ability to quickly mock up layouts and ensure that everything is responsive without needing to go back around and optimize for multiple layouts is key for speed. Carta uses a lot of UI and I knew I had no chance of launching this so quickly without a little help, Mantine enters chat. Mantine is an amazing component library with tons of useful components that are battle tested and accessible. It also provides a lot of utilities and additional features that Carta benefits from.

Lastly, hosting and third parties. Everything is hosted on Vercel. I have been using Vercel since it came out and have always been impressed with its feature set and overall incredible developer experience. Both, marketing website and application are hosted there and I couldn’t be happier. For emails, Send Grid. For payments, Stripe. Analytics, Plausible. Bug reporting, Sentry.

The best part of all, it's all running for $0. I will eventually upgrade a few free accounts to paid but then even, the total cost will be under $100 a month. If Carta Maps grows, all of these services and platforms can grow with it seamlessly.

Check out cartamaps.com and let me know what you think!

Until next time!

– Franco Valdes

Sentry blog image

How to reduce TTFB

In the past few years in the web dev world, we’ve seen a significant push towards rendering our websites on the server. Doing so is better for SEO and performs better on low-powered devices, but one thing we had to sacrifice is TTFB.

In this article, we’ll see how we can identify what makes our TTFB high so we can fix it.

Read more

Top comments (0)

A Workflow Copilot. Tailored to You.

Pieces.app image

Our desktop app, with its intelligent copilot, streamlines coding by generating snippets, extracting code from screenshots, and accelerating problem-solving.

Read the docs