Hosting a Django/NextJS monorepo webapp on Coolify

Recently I’ve been building a new web app and trying Coolify for hosting on a cheap but powerful Hetzner VPS.

Architecture

This is my first real production app using a NextJS frontend with a Django Rest Framework API backend so I’m learning a ton.

There are tons of ways to go about it, all with different pros and cons, but I chose to go the monorepo route with a /backend folder for Django and a /frontend folder for NextJS. Using a Procfile with Honcho I can launch the dev server for both frontend and backend and hack away on localhost.

Deploying to Production

Now when it comes to production, I chose to install Coolify self-hosted version on a Hetzner CAX11 ARM server with 4GB of memory for a cool 3.79€ per month (need 50c for an IPV4).

One way to deploy a monorepo is to build your own docker-compose.yml but I wasn’t really confident with my skills there. I’d much rather let nixpacks do the hard work for me. Luckily, it’s possible to do it with minimal setup, albeit not always obvious in the documentation.

The trick is to create two resources, one for the backend and one for the frontend, both from the same Git repo. Use Nixpacks as a build pack and use the Base Directory option to tell it to base itself only on the content of one of the folder from your repo:

Then set the Watch Paths option with backend/** or frontend/** (no slash prefix, it’s important) so that each resource redeploys only when there are changes in its own source folder.

Other tips I wish I’d knew

I no particular order:

• Use whitenoise to handle static files in Django if you’re going to use the admin dashboard
• Setup django-cors-headers if you run your API on a sub-domain
• OpenAPIConfig.BASE = process.env.NEXT_PUBLIC_API_BASE_URL ?? ""; in your QueryClientProvider file to set your API URL to the said sub-domain

Also, I really wanted to keep SQLite as my database and keep my resources usage low, but Coolify has a one click solution to backup Postgres and I didn’t want to spend too much time finding out how to make my own backup system.

If your site has a favicon when you launch, you launched too late

— Marc Köhlbrugge (@marckohlbrugge) February 26, 2023

I’m already way past that level of detail and I haven’t shipped my site yet…