How to deploy an Astro SSR app to Coolify

WordPress has been with me for many years on my company’s website, DevExpert, and we’ve always had our ups and downs.

It’s true that for building a website quickly and easily, WordPress is an excellent option, but as a developer, it often gives me more work than it saves me.

Besides, it’s well-known that making a WordPress website fast is a constant effort, which I personally don’t have time for.

That’s why I had been considering rebuilding it for some time, and I finally decided to use Astro.

Additionally, I’ve also been self-hosting my own projects and tools for a while (this page is proof of that), and Coolify is a tool that has made it very easy for me from the beginning.

But, unlike this blog, which I’ve always wanted to be as simple as possible so it doesn’t take up maintenance time, the reality is that the DevExpert website has some extra complexities.

Among them, the need to implement some endpoints, and even some dynamically generated pages.

When your Astro website is static, deploying it on Coolify is literally a one-button click.

But if your website is SSR, then it gets a bit more complicated. And, moreover, I haven’t found any place that explains how to do it as of today.

So, I’m going to tell you a bit about why I decided to use these technologies first, and at the end, I’ll also tell you, in case you need to do it yourself, how I managed to deploy DevExpert on Coolify.

Why Astro?

I must admit I don’t have extensive web development skills.

When I discovered Astro some time ago, it seemed so easy to understand because, on one hand, it’s not too far from the classic HTML I already know, and on the other, it offers great flexibility.

Besides, it has solved issues that can be a bit of a headache when you start with a new technology, such as routing and navigation.

My first foray into Astro was with the La TofuConf website, and I loved the experience.

That’s why, when I was thinking about what to do with this website, the first option that came to mind was Astro.

Again, it was very simple.

But the DevExpert website was a much bigger challenge, as using a template isn’t enough for me. The DevExpert design was created by specialists, and I had to build everything from scratch.

Along the way, I’ve encountered other problems, for which I’ve discovered Astro has very good and equally simple solutions.

Some of them have been:

• The option to generate pages dynamically, using SSR (Server-Side Rendering) instead of SSG (Static Site Generation)
• The ability to implement endpoints, which gives you much greater versatility and allows you to generate your own API in an extremely simple way
• A middleware that allows you to decide what happens with each request that reaches the browser, enabling you to implement, for example, redirections. Something I needed because I changed my URL structure.

Why Coolify?

During last year’s TofuConf, Sergio Casero gave an impromptu talk on self-hosting. Something I had never considered, but it changed my way of thinking forever.

His talk was focused on services for individuals, such as a private cloud, Home Assistant, and the like.

But this opened up a world of possibilities for me, because I could extrapolate all this to my own company, managing my own data, and by the way, saving several thousands of euros a year.

Looking at more professional alternatives to Casa OS and similar, I came across Coolify, an alternative to Netlify, but with even more features.

I had already deployed the TofuConf website with Netlify, and the simplicity of deploying an Astro project just by doing a commit and a push is incredible.

So, looking for self-hosted options, I arrived at Coolify.

Since then, I haven’t looked back, and I have a lot of services deployed on Coolify, as besides this option, it also has the option to deploy Docker containers.

And also a store that makes everything very easy.

If you’re curious, I can tell you what I have:

• This very page
• Listmonk for my newsletter
• Evolution API to send WhatsApp messages
• Postiz for social media
• FreshRSS for my news reader
• Supabase as a Firebase replacement (+ Postgres databases)
• N8N to automate tasks
• Umami to anonymously measure my website traffic
• Very soon, DevExpert, which is my company’s website

And all this on a Hetzner server that costs me €6.50 per month. There’s an even cheaper option for just over €3.

Along the way, I’ve been able to unsubscribe from alternative services that cost me much more, many of whose features I wasn’t using.

The problem: deploying an SSR with Coolify

While deploying an SSG page made with Astro on Coolify is as simple as doing it with Netlify, things change for SSR.

In the end, you need to have a Node.js server running, and that requires special configuration.

For this, you need to use an adapter. There are official adapters for Netlify or Vercel, to give a couple of examples.

But for Coolify, you have to use the standard Node adapter, which doesn’t do everything for you.

So, I’m going to tell you the steps you need to take to configure it.

1. Install the adapter

First, you need to install the Node.js adapter. To do this, you can use the following command:

npx astro add node

This will modify your astro.config.mjs file to have the necessary configuration.

2. Configure the deployment in Coolify

First, you must disable “Is it a static site?”, since, obviously, an SSR is not static.

Second, you need to update the “Start Command” to:

node ./dist/server/entry.mjs

This is the entry point for the Node.js server that handles requests.

Sometimes (I don’t know why), this part disappears from the interface when you uncheck the static site option. But I’ll give you the alternative that worked for me.

In the package.json, add the start option in the scripts section:

  "scripts": {
    ...
    "start": "node ./dist/server/entry.mjs"
  }

With this, you wouldn’t need to modify the “Start Command” in Coolify.

Finally, you need to expose port 4321, which is the default port Astro uses, in the “Network -> Ports Exposes” section.

With this, you’ll have your SSR deployed on Coolify.

Conclusion

For me, Astro and Coolify have changed the way I approach the development of my web projects.

It’s true that in some situations, not being the most popular option compared to other cloud services like Netlify or Vercel, they will require a bit more work.

But in return, it gives me the flexibility to do whatever I need, without imposing any restrictions on me.