CI CD Pipeline Setup

CI/CD Pipeline Setup

Introduction

This page provides an overview and step-by-step guide for setting up a CI/CD pipeline for the Next.js application using GitHub Actions. The pipeline includes using a script for Dockerizing the application and hosting it on an Ubuntu server.

GitHub Actions Workflow

We created CI/CD pipelines for all environments (dev, staging, and production)

An example of our Staging CI/CD Pipeline:

name: Staging CI/CD Pipeline

on:
  push:
    branches:
      - staging
    paths-ignore:
      - .github/workflows/**

concurrency:
  group: ${{ github.ref }}
  cancel-in-progress: true

jobs:
  build:
    runs-on: ubuntu-latest

    steps:
      - name: Checkout code
        uses: actions/checkout@v3

      - name: Set up Node.js
        uses: actions/setup-node@v3
        with:
          node-version: '20'

      - name: Cache pnpm modules
        uses: actions/cache@v3
        with:
          path: ~/.pnpm-store
          key: ${{ runner.os }}-pnpm-${{ hashFiles('**/pnpm-lock.yaml') }}
          restore-keys: |
            ${{ runner.os }}-pnpm-

      - name: Install pnpm
        uses: pnpm/action-setup@v4
        with:
          version: 9

      - name: Install dependencies
        run: pnpm install

      - name: Lint code
        run: pnpm lint

      - name: Build project
        run: pnpm build

      - name: Run tests
        run: pnpm run test:ci

  deploy:
    runs-on: ubuntu-latest
    needs: build

    steps:
      - name: Deploy to staging environment
        uses: appleboy/[email protected]
        with:
          host: ${{ secrets.HOST }}
          username: ${{ secrets.USERNAME }}
          password: ${{ secrets.PASSWORD }}
          script: |
            ./deploy_staging.sh next

Secrets Configuration

In the GitHub repository, navigate to Settings > Secrets and add the following secrets:

• HOST: Your server's IP address or hostname.
• USERNAME: Your SSH username.
• PASSWORD: Your SSH password.

Running Tests

All existing unit and integration tests are executed against the build to maintain code quality.

Building the Application

The pnpm build command will build the Next.js application, preparing it for deployment.

Deployment Steps

The deployment process uses an SSH action to run a staging script (deploy_staging.sh) on the server. The script handles building the application using docker-compose and bringing them live.