Github Actions Sederhana Untuk Auto Testing & Deploy ke Server VPS

Repo Hasil Artikel Ini Bisa Dilihat Di :
https://github.com/viandwi24/example-ci-cd-auto-deploy-vps

Untuk To The Point Otomatis Deploy bisa langsung loncat ke paragraft dibawah :
- Continuous Development

Github Actions

Sederhananya Github Actions adalah alat otomasi yang hadir di Github, Alat ini sangat membantu kita untuk membuat berbagai keperluan otomasi seperti unit test, auto deploy seperti yang kita bahas pada artikel ini. Dan tidak hanya itu, dengan Github Actions kita juga bisa menentukan saat saat apa saja otomasi akan terpanggil.

Jika teman — teman masih belum paham dan belum pernah mencoba, mungkin teman — teman bisa cek di artikel saya sebelumnya :

https://viandwi24.medium.com/github-actions-membuat-workflows-sederhana-untuk-build-projek-4bf4a7e6f662

Membuat Projek Uji Coba

Untuk kali ini saya akan mencoba projek dengan Nuxtjs. Teman — teman bisa menggunakan bahasa lain tidak harus Nuxt. Karena yang terpenting disini bukan Projeknya, tapi github actionsnya.

Berikut adalah contoh projek yang akan saya jadikan uji coba :

Mempersiapkan Github

Selanjutnya kita akan bersiap — siap menggunakan github, pertama tentunya kita perlu membuat repository dulu. Github Actions ini tersedia gratis untuk public maupun private repo untungnya.

Selanjutnya, kita init projek kita dengan github lalu kita tambahkan remote repository kita yang sudah kita buat tadi di github.

# init projek kedalam git
git init
# tambahkan remote repo
git remote add <name> <repo_url>

Unit Test

Untuk ini opsional yah, tapi bagi yang sudah tahu, Unit Test adalah pengujian atau testing dengan otomasi. Dengan Unit Test kita dengan mudah melakukan pengujian terhadap aplikasi dengan mudah.

Bagi pemula mungkin ini terdengar ribet karena kita harus membuat file test per fitur atau bahkan per-case. Tetapi kalian harus paham unit test ini sangat membantu sekali.

Contohnya di Continuous Integration ini, jadi sebagai contoh saat kita melakukan pull request ke suatu branch, maka dengan CI kita bisa menjalankan testing di github actions secara otomatis.

Dengan begini, jika ada error maka pull request kita akan mendapat pemberitahuan bahwa ada kesalahan saat melakukan testing dengan begitu leader project bisa tau bahwa pull request kalian belum dapat di merge dengan main branch.

Di sini saya menggunakan Unit Test yang bernama Jest untuk projek Nuxt saya, kalian bisa menggunakan Unit Test di bahasa pemrograman kalian. Seperti misal Php ada phpunit, dan beberapa bahasa telah menerapkan default package untuk unit test mereka seperti golang, denojs, dll.

Membuat Workflows Untuk Continuous Integration

Buat kalian yang tidak paham apa itu CI atau Continuous Integration, saya jelaskan simpel saja. Ini semacam metode untuk melakukan integrasi dengan cepat. Sebagai contoh kalian kerja dengan tim, kalian mengerjakan suatu fitur. lalu kalian akan membaut branch baru. setelah jadi, kalian pasti akan melakukan pull request untuk dilakukan merge dengan branch utama kan. Nah disini CI bekerja, dia bisa kita gunakan contohnya untuk memastikan kode kita aman dan tetap sesuai ekspetasi dengan menggunakan Unit Test atau lain sebagainya.

Intinya dengan CI integrasi antar fitur satu dengan lainnya dapat mudah dan cepat dilakukan secara otomatis.

kali ini kita akan mencoba membuat job yang akan berjalan ketika pull request di lakukan di branch kita.

Seperti github actions pada umumnya, buat folder projek_kalian/.github/workflows/ lalu buat nama file terserah berakhiran .yml s ebagai contoh saya membuat nama ci.yml

Lalu, sebagai contoh berikut adalah workflow saya :

https://raw.githubusercontent.com/viandwi24/example-ci-cd-auto-deploy-vps/master/.github/workflows/ci.yml

Oke biar saya jelas kan satu satu dari kode diatas.

pertama adalah kita membuat nama untuk action kita kali ini, ditunjukan di baris pertama kode :

name: ci

selanjutnya kita definisikan kapan action kita akan di trigger atau dijalnkan, disini saya menginginkan dijalankan ketika ada push ataul pull request pada branch master saya

on:
  push:
    branches:
      - master
  pull_request:
    branches:
      - master

selanjutnya kita buat job, artinya action apa aja yang akan dikerjakan nantinya

jobs:
  ci:
    runs-on: ubuntu-latest

disini ci adalah nama dari job kita, disini saya sama menggunakan nama ci kembail, selanjutnya kita definiskan mau dijalankan menggunakan operasi sitem apa, disini saya menggunakan ubuntu-latest

selanjutnya, untuk job ci ini kita definisikan kembali steps nya, ini adalah langkah langkah untuk memenuhi job ci itu sendiri.

steps:
  - name: Checkout 🛎
    uses: actions/checkout@master
  - name: Setup node env 🏗
    uses: actions/setup-node@v2.1.5
    with:
      node-version: 16
      check-latest: true
  - name: Install dependencies 👨🏻‍💻
    run: yarn
  - name: Run linter 👀
    run: yarn lint
  - name: Run tests 🧪
    run: yarn test

bisa dilihat dari cuplikan kode diatas, ada 5 step yang saya buat, dimana distep pertama ini wajib ini artinya kita mau menggunakan branch mana.

di step kedua saya menginstall package nodejs untuk dijalankan di job kali ini, disini kalian bisa menentukan sendiri, misal kalian menggunakan projek pythn ada golang maka kalian harus menginstall package github actions yang disediakan untuk menjalakan projek kalian.
kalian bisa mencarinya di :

Github Actions Marketplace :
https://github.com/marketplace?type=actions

selanjutnya di step berikutnya saya menginstall dependencies untuk projek saya, disini nodejs menggunakan package manager yarn.

Lalu menjalankan lint untuk mendeteksi rules lint yang ada, lalu menjalankan testing.
seperti yang saya bilang, dibaris ini semua tergantung projek yang sedang kalian gunakan.

Jika sudah selesai kalian bisa simpan, dan sekarang kita akan mencoba beralih ke bagian

Continuous Development

Ini adalah kelanjutkan dari CI, setelah semua teringrasi dengan baik, tentunya tujuan akhir adalah melakukan deploy. dengan metode ini kita bisa membuat otomasi sebagai contoh ketika kode teman teman sudah aman dan melakukan merge ke branch utama, maka kita bisa mentrigger otomasi CD untuk melakukan deploy otomatis ke server. ini sebagai contoh saja. dengan begitu kita tidak perlu repot repot manual meng update kode kita di server, kita cukup melakukan push ke branch misalnya, lalu CD akan mendeploy seacara otomatis.

Disini kita buat file baru di folder workflows tadi projek_kalian/.github/workflows/ lalu buat nama file terserah berakhiran .yml sebagai contoh saya membuat nama cd.yml

selanjutnya berikut adalah isi dari cd.yml :

https://raw.githubusercontent.com/viandwi24/example-ci-cd-auto-deploy-vps/master/.github/workflows/cd.yml

oke jadi penjelasan dari kode diatas adalah, sama seperti tadi yaitu kita mendefinisikan dulu nama :

name: ci

lalu kapan action akan di trigger

on:
  push:
    branches:
      - master

lalu job nya :

jobs:
  ci:
    runs-on: ubuntu-latest

selanjutnya disini saya menggunakan package untuk melakukan remote ssh ke server, yaitu menggunakan package :

appleboy/ssh-action
https://github.com/appleboy/ssh-action

Sebenarnya ada banyak package untuk melakukan remote ssh, tapi disini saya akan mencontohkan dengan yang sederhana

Disini kalian bisa meremote server vps kalian user dan password akun server kalian, tapi tidak saya sarankan. Untuk masalah keamanan kita akan remote dengan SSH saja.

Jadi nanti kita membutuhkan Private dan Public key untuk remote server, ini agar lebih aman tentunya.

Pertama kalian buat dulu ssh key di server kalian, kalian juga bisa menggunakan key yang sudah ada. tapi disini saya akan membuat baru saja.

Berikut adalah kode untuk generate ssh key :

ssh-keygen -t rsa -b 4096 -C "your_email@example.com"

disitu kalian akan ditanya nama lokasi dan file penyimpanan, disini saya menggunakan /home/ubuntu/.ssh/id_rsa-example-github untuk nama file yang nantinya akan disimpan

lalu kalian akan ditanya passphrase semacam password, jika kalian ingin kosong kalian bisa langsung enter 2 kali saja.

Lalu yup, jika berhasil kalian akan mendapat pemberitahuan seperti berikut :

Selanjutnya, agar kita bisa menggunakan ssh ini nantinya sebagai alat untuk login dan remote, kalian harus mendaftarkan public key nya kedalam authorize_keys.

Sekarang buka file public key, lalu copy.

cat ~/.ssh/id_rsa-example-github

Lalu buka file ~/.ssh/authorized_keys lalu paste public key tadi ke baris baru didalam file tersebut. Lalu simpan.
disini saya menggunakan nano, setelah paste disini klik ctrl+x lalu yes untuk menyimpan.

nano ~/.ssh/authorized_keys

Selanjutnya, kalian buka repo github kalian lalu pergi ke setting — secrets

klik new secret untuk membuat secret baru, jadi ini semacam enviroment variable, disini kita akan masukan informasi credential tadi. karena kalian tidak mau kan kalo credential kalian di expose langsung ke code di repo? pastinya orang lain akan tahu. oleh karena itu kita store ke Secrets Github saja, dan ini bisa dipanggil di Workflows kita nanti.

disini kalian liat private key dari file tadi yang sudah teman — teman generate, lalu copy.

cat ~/.ssh/id_rsa-example-github

dan pastekan di secret dan buat nama variable terserah sebagai contoh saya menamakan SSH_PRIVATE_KEY

Klik add secret, lalu saya akan menambahkan 2 secret lagi untuk username dan host server saya.
saya berinama SSH_USERNAME dan SSH_HOST

Secret untuk IP address Host server

Secret untuk username server kita

Oke, jadi nanti kita punya 3 secret variables

sekarang kita balik menuju kode workflow kita tadi.

- name: Deploy Using ssh
  uses: appleboy/ssh-action@master
  with:
    host: ${{ secrets.SSH_HOST }}
    username: ${{ secrets.SSH_USERNAME }}
    key: ${{ secrets.SSH_PRIVATE_KEY }}
    port: 22
    script: |
      cd ~/app/example-ci-cd-auto-deploy-vps
      git pull origin master
      git status
      yarn install
      yarn build
      pm2 reload PertakinaPublicClient
      pm2 restart PertakinaPublicClient

nah jadi distep ini kita menggunakan package tadi yaitu ssh-action, lalu kita definsikan host ,username,key dan port dari ssh kalian di server. disini kita bisa ambil secrets variables kita yang sudah kita buat tadi.

Selanjutnya di scripts kita definisikan scripts apa saja yang mau kita gunakan untuk mendeploy.

Disini saya menuju folder projeksaya di server dengan cd ~/app/...

lalu melakukan pull terhadap branch master yang terbaru untuk mengambil kodingan yang terbaru. selanjutnya saya install dependencies dengan yarn.
lalu membuildnya, dan setelah selesah saya reload daemon untuk app projek saya.

Disini saya menggunakan pm2, ini semacam aplikasi khusus untuk menjalankan server berbasis nodejs. kalian bisa ganti dengan sesuka hati misal menggunakan apache, atau nginx, atau menggunakan docker dan lain sebagainya.

kalian bisa custom sendiri script yang dijalankan nantinya.

setelah selesai klik simpan.

Oh iya, sebelum menjalankan workflows ini, pastikan di server teman — teman sudah pernah melakukan clone projek ini. sebagai contoh projek saya tadi ada di lokasi ~/app/example-ci-cd-auto-deploy-vps . maka saya harus mengclone dulu di server untuk pertama kali.

mkdir ~/app
cd ~/app
git clone <url_projek>

oke selanjutnya saatnya uji coba!!!

Uji Coba

Untuk melakukan uji coba, mari kita commit semua yang sudah kita buat.

# staged changes semua file yang sudah kita rubah
git add .
# commit
git commit -m 'pesan commit'

lalu kita push ke server

# push
git push -f origin master

Selanjutnya check ke github repo kalian, lalu akan muncul titik kuning di samping info commit, ini menunjukan bahwa ada action yang sedang berjalan. lalu coba klik details atau kalian bisa dengan cara menuju ke menu — tab actions

Nah disini script CI saya berhasil berjalan, tapi sayangnya ada error. tapi ini memang kesalahan saya hehe. jadi saya tidak menginstall linter di projek example ini, tapi saya malah menjalankan yarn lint jadi tentu saja error. tapi jangan kuatir, ini masalah sepele. yang terpenting workflow ci kita sudah berjalan.

Selanjutnya workflow CD saya berhasil, disini deploy nya pun berjalan success.

bisa dilihat sekarang nuxt saya bisa diakses dan sukses semuanya.

Sebernya masih ada yang kurang, yaitu uji coba pull request, tapi kalian bisa mencobanya sendiri saya rasa. Dan sama, ketika kalian melakukan pull request terhadap branch master, harusnya nanti akan mentrigger workflow CI saja, tidak dengan CD. karena CD tadi sudah kita atur untuk tertrigger hanya ketika branch master di push.

Repo Hasil Artikel Ini Bisa Dilihat Di :
https://github.com/viandwi24/example-ci-cd-auto-deploy-vps

Oke Sekian Artikel dari saya, apabila ada kesalahan mohon koreksinya. Semoga bermanfaat dan sampai jumpa di artikel selanjutnya!

Terimakasih, Semoga artikel ini bermanfaat untuk teman — teman, jangan lupa berikan claps dan komentar jika mengalami kesusahan.