Building software involves a lot of compromise. Everything has pros and cons. In this article I'd like to share what I used to build WeCode NI. It's a job board for developers in Northern Ireland. It's not a complicated app, but has plenty of moving parts including auth, payments and content. I hope this article will help you make decisions about your own projects.
Hosting
When picking a hosting provider, I have a few requirements. Basically I want it to be affordable and convenient. I do not want to be managing a server or worrying about uptime. For most of the work I do these days, a serverless solution works best.
That's why for hosting, I use Vercel. Vercel is a serverless hosting platform with a generous free tier. I can push my code to Github and a few minutes later, it's live. My pull requests get deployed to staging urls for me to test and I can have multiple environments each with different configurations. The whole platform is backed by a smart CDN which helps static sites perform even better and ensures that my sites are always snappy and reliable.
Framework
When building a job board, server rendered HTML is very important for SEO. It puts you in control of how search engines see your pages.
My framework of choice is Next.js. Next.js is a fullstack JavaScript framework from the same folks that make Vercel. It can be used to build dynamic sites, static sites, APIs and projects that mix them all together.
One of the reasons I use Next.js is for its static regeneration feature. I can create a static page at build time but ensure it is always up-to-date by rebuilding in the background. Next.js makes this really easy to do. Check out the homepage or any job page on weCode Remote or WeCode NI to see it in action.
I use the Next.js API routes to power a GraphQL endpoint. This endpoint is what powers the admin interface and is consumed by all the job pages too.
Data
All data is stored in a MYSQL database running on PlanetScale. I don't need or use their geographic replication feature as the vast majority of users to the site are based in Northern Ireland. I chose PlanetScale because they have a generous free plan and it is serverless. I don't have to worry about scaling or managing a database.
Authentication
When I originally built the site I used Firebase for my backend and Auth. It worked well but there were several drawbacks. Firstly, at the time, the Firebase SDK was huge. Almost half of the JavaScript shipped with each page was just firebase auth code and when you consider most users never need to log in, it was a real waste. Secondly, I've never been a huge fan of Google and their privacy policies. I didn't want to be relying on them for my authentication.
So, when I rebuilt the site I decided to use NextAuth. It's a library that makes it easy to add authentication to your Next.js app. It supports a wide range of providers including email, GitHub, Twitter etc. The data is store in my own database so if I ever want to move away from NextAuth, I can.
Payments
You'll not be surprised to hear that my payments are handled by Stripe. I use Stripe Checkout. This is a prebuilt UI for taking card payments. When a user is ready to pay, I redirect them to a checkout page on Stripe where the transaction is handled. This way, a user never enters payment details on my site. Ensuring a website meets the legal requirements to process payments is hard, so I've left that liability in Stripe's capable hands. When Stripe successfully charges the user, they send me a webhook and the user's draft job goes live.
Content
I use Prismic to manage the content on the site. It's a headless CMS which means I can use it to manage the content on my site without having to build a custom admin interface. If I were to build the site again, I'd probably user Markdown files for the content. It rarely changes and I don't need a full blown CMS for it.
API Layer
I use Apollo Server to power my GraphQL API. This is by far my biggest pain point when working on the site. It's tricky to test, I have to write my types twice (TypeScript and GraphQL) and I have to write a lot of boilerplate code to get it working. I've worked with tRPC recently and I think I'd use that if I were to build the site again.
I use PostMark to send emails. It's a transactional email service which means I can send emails to users when they sign up or login, when they pay and when their job goes live. It's a really simple service to use and it's very affordable. I also like that they are independently owned.
What I'd do differently
While I love all the tools I`ve used for building WeCode NI, there are some things that aren't perfect. As time has gone on I've replaced a lot of the parts I didn't like. I swapped Firebase for NextAuth and I'm planning to move away from Prismic. I'd also like to move away from Apollo Server and use tRPC instead.
That said, the site works and makes me money. As the saying goes "if it ain't broke, don't fix it". I'm happy with the site and I'm not going to spend time on it unless I have to. I'm sure I'll be back to update this article in the future though.