This document covers the tools and services I'd generally default to when working on a personal project. Every project has it's own needs and circumstances, so sometimes I may opt for other tools, but in general my mind will go to these ones first. Check back from time to time as I'll update this post as my tech stack evolves!

API / database

While I'm comfortable rolling my own backend using Python/Ruby/Node, I always find this to be a big time investment, and it's also usually the place I run out of steam on projects. So recently I've been using Hasura for creating CRUD-like GraphQL APIs for my projects. This allows me to create an API in 10 minutes and getting to working on the front-end code that usually sustains my interest in a project. Hasura requires a database provider and for that I've used Heroku - it works well enough so far, but I haven't used either Hasura or Heroku with any backend intensive projects yet.

For a backend requiring more than just a CRUD API I'd try to see if I accomplish what I need using serverless functions before reaching for something like Express or Rails.

Language

Generally I'd aim to use Typescript for everything I do. There's a few other languages I'm either comfortable with (vanilla JavaScript, Ruby, Python) or somewhat familiar with (Elixir, Go, Java), but unless I'm intentionally setting out to improve my skills in a different language I'll opt for Typescript on both front and back end as that's what I can move fastest with.

Frontend

Similarly, here I'll opt for React as that's what I'm most effective with. If the project will benefit from techniques like static page generation or server-side rendering, than I would choose to work with Next JS, otherwise I'd just go with a vanilla React app (no bootstrapping) and potentially pull in react-router if needed. I'll almost certainly end up using Apollo too for GraphQL requests.

CSS

I've used CSS pre-processors like Sass is the past, but given the fast pace of evolution in vanilla CSS in the last few years I now prefer to just work with that, though possibly pulling in CSS Modules for larger projects. For the last year or so I've also been using Tailwind as I've found it allows me to iterate fast while maintaining a consistent design system.

UI / component library

I've not been a huge fan of React component libraries as I find I end up spending more time adapting them to my app then writing them in the first place would have taken. What I have been using recently though is Tailwind UI as it allows me to quickly prototype a design and then alter it along side the design system I'm working with.

Forms

I currently don't have a great solution for working with forms in React. I've recently been testing out react-hook-form, but I'm not fully on board yet.

Dev tools

ESLint and Prettier are must haves for code style. I have my own ESLint config that I pull into any project I work on.

For a build tool I've recently been trying out Vite and have had a positive experience, though this is a fast evolving space at the moment so there's a chance I might end up with an alternative. I've also been happy with Parcel for projects that are relatively simple in their build process.

Testing

For testing I like to go with a combo of Jest and Testing Library, and I can bang out unit and integration tests at a fast pace with these two tools. In the end-to-end testing space I've worked with Cypress but have had a mixed experience and I'd like to experiment some more with alternatives to find something that works better for me.

CI and automation

For CI and other automation (e.g. publishing node modules or documentation) I go with Github Actions. So far I've find them incredibly easy to work with and quite flexible too.

Deployments / Hosting

I've recently been using Vercel for deploying and hosting web projects and it's been a really good experience so far. I've traditionally been an S3 or "spin up my own server" guy, so this is a space I'm still learning about at the moment.