GitLab Pipeline frontend-backend in AWS with Postgres and PM2

Image by Robson Machado from Pixabay

Doing the work of DevOps is very interesting. You are required to act as if you are the code that has been made and then it must be sent here and there, built, run, reverse proxy, until the code is live on the internet.

This is my experience creating a simple pipeline in GitLab and running it on AWS.

I got a case to create a frontend pipeline and a backend repository to deploy to AWS.

my client repository

On the AWS server, I’m using Ubuntu 22, t2. medium, CPU 2, 2GB of RAM with NGINX, Docker and Postgres, NodeJS v18, and PM2.

For Postgres in docker installation :

docker run -d \
--restart always \
--name postgres \
-p 5432:5432 \
-e POSTGRES_PASSWORD=password \
-e PGDATA=/var/lib/postgresql/data/pgdata \
postgres

Ok, for the Frontend, here I use Nextjs (React) as the framework, here I change the next.config.js configuration as follows :

/** @type {import('next').NextConfig} */
const nextConfig = {
  reactStrictMode: true,
  swcMinify: true,
  optimizeFonts: true,
  images: {
    remotePatterns: [
      {
        protocol: 'http',
        hostname: '#domain#',
        port: '4000',
        pathname: '/images/**',
      },
      {
        protocol: 'https',
        hostname: 'ui-avatars.com',
        port: '',
        pathname: '/api/**',
      },
    ],
    minimumCacheTTL: 1500000,
  },
};

module.exports = nextConfig;

Here, I added remote patterns to the whitelist.

Then, for .gitlab-ci.yml

deploy:
  timeout: 5m
  stage: deploy
  script:
  #ssh to server with user $USER
    - echo "The job's stage is $CI_JOB_ID"
    - chmod 600 ./$SSHFILE
    - ssh -i ./$SSHFILE -o StrictHostKeyChecking=no $USER@$HOST
    #remove all previous folder 
    - ssh -i ./$SSHFILE -o StrictHostKeyChecking=no $USER@$HOST "rm -rf $DESTINATION/*"
    #create new folder by job id
    - ssh -i ./$SSHFILE -o StrictHostKeyChecking=no $USER@$HOST "ls -la"
    - ssh -i ./$SSHFILE -o StrictHostKeyChecking=no $USER@$HOST "mkdir $DESTINATION/$CI_JOB_ID"
    #clone to server
    - ssh -i ./$SSHFILE -o StrictHostKeyChecking=no $USER@$HOST "cd $DESTINATION/$CI_JOB_ID && git clone $REPOSITORYURL"
    #install npm
    - ssh -i ./$SSHFILE -o StrictHostKeyChecking=no $USER@$HOST "cd $DESTINATION/$CI_JOB_ID/$GITFOLDER && npm install"
    #build
    - ssh -i ./$SSHFILE -o StrictHostKeyChecking=no $USER@$HOST "cd $DESTINATION/$CI_JOB_ID/$GITFOLDER && npm run build"
    #remove pm2 previous
    - ssh -i ./$SSHFILE -o StrictHostKeyChecking=no $USER@$HOST "cd $DESTINATION/$CI_JOB_ID/$GITFOLDER && pm2 delete next"
    #start pm2
    - ssh -i ./$SSHFILE -o StrictHostKeyChecking=no $USER@$HOST "cd $DESTINATION/$CI_JOB_ID/$GITFOLDER && pm2 start npm --name "next" -- start"
    #save pm2
    - ssh -i ./$SSHFILE -o StrictHostKeyChecking=no $USER@$HOST "cd $DESTINATION/$CI_JOB_ID/$GITFOLDER && pm2 save"
    #exit 
    - exit
  only:
    - main

This is more like doing a reinstall on the server via ssh, there are many other ways to do it, for example by building it on Gitlab Runner, then sending the build to the server, and several other ways.

Then after the build, it will run via pm2 and use port 3000. On NGINX, a reverse proxy is performed to use the main domain without a port.

location / {
        proxy_pass http://localhost:3000;
}

On the backend side, the same thing is also done, the only difference is that there are migrations like this .gitlab-ci.yml

deploy:
  stage: deploy
  script:
  #ssh to server with user ubuntu
    - echo "The job's stage is $CI_JOB_ID"
    - chmod 600 ./$SSHFILE
    - ssh -i ./$SSHFILE -o StrictHostKeyChecking=no $USER@$HOST
    #remove all previous folder 
    - ssh -i ./$SSHFILE -o StrictHostKeyChecking=no $USER@$HOST "rm -rf app/backend/*"
    #create new folder by job id
    - ssh -i ./$SSHFILE -o StrictHostKeyChecking=no $USER@$HOST "ls -la"
    - ssh -i ./$SSHFILE -o StrictHostKeyChecking=no $USER@$HOST "mkdir $DESTINATION/$CI_JOB_ID"
    #go to new folder
    - ssh -i ./$SSHFILE -o StrictHostKeyChecking=no $USER@$HOST "cd $DESTINATION/$CI_JOB_ID && git clone $REPOSITORYURL"
    #go to server folder
    #install node modules
    - ssh -i ./$SSHFILE -o StrictHostKeyChecking=no $USER@$HOST "cd $DESTINATION/$CI_JOB_ID/$GITFOLDER && npm install"
    #run migrations
    - ssh -i ./$SSHFILE -o StrictHostKeyChecking=no $USER@$HOST "cd $DESTINATION/$CI_JOB_ID/$GITFOLDER && npx sequelize-cli db:migrate"
    #remove pm2 previous
    - ssh -i ./$SSHFILE -o StrictHostKeyChecking=no $USER@$HOST "cd $DESTINATION/$CI_JOB_ID/$GITFOLDER && pm2 delete www"
    #start pm2
    - ssh -i ./$SSHFILE -o StrictHostKeyChecking=no $USER@$HOST "cd $DESTINATION/$CI_JOB_ID/$GITFOLDER && pm2 start ./bin/www"
    #save pm2
    - ssh -i ./$SSHFILE -o StrictHostKeyChecking=no $USER@$HOST "cd $DESTINATION/$CI_JOB_ID/$GITFOLDER && pm2 save"
    #exit 
    - exit
  only:
    - master

run on pm2 and done.

after 36 build for frontend and 20 build for the backend