Panduan Implementasi Code Style Pipeline di GitLab CI/CD dengan Docker

Pipeline ini digunakan untuk mengotomatisasi formatting code style untuk PHP dan JavaScript/TypeScript menggunakan Docker image ramaid/image:php8.3-fullstack-cli-v2.0.3. Pipeline akan berjalan setiap kali ada merge request dan secara otomatis memformat kode, commit perubahan, dan push ke branch yang sama.

🖥️ Screencast

🔧 Konfigurasi

GitLab CI/CD Configuration

code-style:
  tags:
    - php
  image: ramaid/image:php8.3-fullstack-cli-v2.0.3
  stage: fix-code-style
  variables:
    GIT_STRATEGY: clone

🔑 Prerequisites

  • GitLab Runner dengan tag php
  • Access token dengan permission write ke repository (CI_TOKEN)
  • Laravel Pint untuk PHP formatting
  • Prettier/ESLint untuk JavaScript formatting

💻 Cara Kerja

1. Installation Dependencies

script:
  - composer install --no-interaction --no-progress --quiet
  - bun install --frozen-lockfile --silent
  • Menginstall PHP dependencies via Composer
  • Menginstall JavaScript dependencies via Bun
  • Flag --quiet dan --silent meminimalkan output log

2. Git Configuration

script:
  - git config --global user.email "[email protected]"
  - git config --global user.name "Judge GitLab"
  - git remote set-url origin "http://oauth2:${CI_TOKEN}@192.168.68.116:8041/${CI_PROJECT_PATH}.git"
  - git fetch origin
  • Setup git user untuk commit
  • Konfigurasi remote repository dengan authentication
  • Fetch latest changes dari repository

3. Code Formatting

script:
  - ./vendor/bin/pint
  - bun run silent-format
  • pint: Format PHP code menggunakan Laravel Pint
  • silent-format: Format JavaScript/TypeScript code

4. Commit dan Push

script:
  - git add .
  - git diff --staged --quiet || git commit -m "Apply code style fixes"
  - git push origin HEAD:$CI_COMMIT_REF_NAME
  • Add semua perubahan
  • Commit jika ada perubahan
  • Push ke branch yang sama

🎯 Rules

rules:
  - if: $CI_COMMIT_BRANCH == $CI_DEFAULT_BRANCH
    when: never
  - if: $CI_PIPELINE_SOURCE == "merge_request_event"
  • Tidak berjalan di default branch (biasanya main atau master)
  • Hanya berjalan saat ada merge request

💾 Cache Configuration

cache:
  key: ${CI_COMMIT_REF_SLUG}
  fallback_keys:
    - code-style
  paths:
    - vendor/
    - node_modules/
    - .git/
  • Cache vendor directory untuk mempercepat instalasi
  • Menggunakan dynamic key berdasarkan branch
  • Fallback ke cache code-style jika tidak ada

📦 Artifacts

artifacts:
  expire_in: 1 week
  paths:
    - vendor/
    - node_modules/
    - .git/
  • Menyimpan vendor, node_modules dan .git sebagai artifacts
  • Expires dalam 1 minggu
  • Berguna untuk subsequent jobs yang memerlukan dependencies

🔄 Workflow

  1. Developer push code ke branch
  2. Developer membuat merge request
  3. Pipeline fix-code-style otomatis berjalan
  4. Code diformat sesuai standar
  5. Perubahan di-commit dan di-push ke branch yang sama
  6. Merge request terupdate dengan formatted code

⚙️ Kustomisasi

PHP Formatting (Laravel Pint)

Buat file pint.json di root project:

{
  "preset": "laravel",
  "rules": {
    // Custom rules
  }
}

JavaScript Formatting

Update package.json:

{
  "scripts": {
    "silent-format": "prettier --write . --log-level silent"
  }
}

🚫 Troubleshooting

Pipeline Gagal

  1. Cek permission token (CI_TOKEN)
  2. Pastikan runner berjalan dengan user root
  3. Verifikasi koneksi ke GitLab server

Format Tidak Berubah

  1. Cek konfigurasi Pint dan Prettier
  2. Pastikan file tidak di-ignore
  3. Verifikasi path di .gitignore

📝 Best Practices

  1. Selalu gunakan versi spesifik untuk Docker image
  2. Simpan sensitive tokens di GitLab CI/CD variables
  3. Manfaatkan cache untuk optimasi pipeline
  4. Dokumentasikan custom rules
  5. Regular update dependencies

🔗 Referensi