I recently shared an article about creating my website. Again, before publishing my blog page with Astro, I needed to deploy it to my existing server since I was using a VPS server. While you have the option to deploy to many platforms like Vercel, Netlify, etc., when it comes to the server-side of Node.js, the responsibility is directly on you, of course.


We will set up a Node.js on the server and create a reverse proxy through our existing PHP server to directly route to our Astro project. Additionally, we will prepare a Linux service, ensuring that it stays active in the background through server restarts or application errors.


Firstly, depending on the server you use for Node.js, you need to install at least version 18 or above.


Getting Started

To run our Astro Node.js application on the server, we will use express.js. First, let's create a file named run-server.mjs in the project's root directory and organize its content as follows:

import express from 'express';
import { handler as ssrHandler } from './dist/server/entry.mjs';

const app = express();

app.use(express.static('dist/client/'));

app.use((req, res, next) => {
  return ssrHandler(req, res, next);
});

app.listen(8100, () => {
  console.log('Server Listening on localhost port 8100')
});


What we are doing here is an example of an express.js server found in the Astro Docs. When I tried to use it directly on my server, I encountered an SSL handshake error because I use the HTTPS protocol. Therefore, here we need Express.js as an HTTPS server. For this, we organize our code as follows:


Example of an HTTPS Server with Express

import express from 'express';
import { handler as ssrHandler } from './dist/server/entry.mjs';
import fs from 'fs'
import https from 'https'

const app = express();

app.use(express.static('dist/client/'));

app.use((req, res, next) => {
  return ssrHandler(req, res, next);
});

const privateKey = fs.readFileSync('/usr/local/.../gokhankorul.dev.key', 'utf8'); // Path to the private key file
const certificate = fs.readFileSync('/usr/local/.../gokhankorul.dev.cert.combined', 'utf8'); // Path to the certificate file

const credentials = { key: privateKey, cert: certificate };

const server = https.createServer(credentials, app);

server.listen(8100, () => {
  console.log('Server listening on localhost port 8100')
});


Update the paths of your certificate files with those on your server. Now, when you run node run-server.mjs, your server should start.

~ $ node ./run-server.mjs


Building for Production

We are building our project locally with the astro build command.


~ $ astro build
...
24:29:35 [vite] ✓ built in 16.44s
24:29:38 finalizing server assets 
24:29:38 [build] Rearranging server assets...
24:29:38 [build] Server built in 23.80s
24:29:38 [build] Complete!


After the build process is complete, transfer your project to the server, including the /dist, /src, and all files in the root directory. You can create a folder under /home/{user} and place them there.


Once the project files are on the server, we need to install the modules again here.

~ $ npm install
# or
~ $ yarn install


Serving Process

We access our server as root.

~ $ sudo su

Now that our project is ready to run, we will prepare a service on our server. Let's create our service file as follows:

~ touch /etc/systemd/system/astro-ssr.service


Now let's open our service file.

~ nano /etc/systemd/system/astro-ssr.service


Let's customize the fields below according to our preferences. The most important part here is the WorkingDirectory section. Enter the full path of the root directory of the folder you opened for the application as follows:

[Unit]
Description=Gokhan Korul Personal Blog
After=network.target

[Service]
ExecStart=node ./run-server.mjs

WorkingDirectory=/home/gokhan/astro_web_app
Restart=on-failure
User=root
Group=root
Environment=NODE_PORT=8100

[Install]
WantedBy=multi-user.target


Press CTRL+X, then Y, and Enter to save and close the file. Now, we will add our created service to the server startup so that we don't have to manually start it each time. Use the following command to add the service to system startup:

~ systemctl enable astro-ssr


Now, we can start the astro-ssr service.


~ systemctl start astro-ssr

We have now started the service, and we can check its status.


[root@root ~]# systemctl status astro-ssr
● astro-ssr.service - Gokhan Korul Personal Blog
   Loaded: loaded (/etc/systemd/system/astro-ssr.service; enabled; vendor preset: disabled)
   Active: active (running) since Fri 2024-01-19 22:35:16 UTC; 1 day 18h ago
 Main PID: 364248 (node)
    Tasks: 11 (limit: 47740)
   Memory: 127.4M
   CGroup: /system.slice/astro-ssr.service
           └─364248 /usr/local/bin/node ./run-server.mjs


PHP Proxy Configuration

In the next step, if you are using a PHP server on your server, for example: Apache, Lighttpd, etc., you need to configure the server application to proxy our application, i.e., redirect it to https://127.0.0.1:8100 port.