Belajar Deploy Aplikasi Web Menggunakan Layanan ECS (Elastic Compute Service) Alibaba
Tags: indonesia, cloud, alibaba, devops
Published: 2024-03-04 03:03:03

Saya pernah dengar istilah “Tutorial Hell”, yaitu kondisi dimana kita terus menerus mengikuti atau menonton video tutorial tanpa mengaplikasikannya ke dalam sebuah proyek nyata, hal ini jelas pantas disematkan kepada saya jika hanya menonton presentasi dari instruktur saya.

Oh iya, saya saat ini berkesempatan mengikuti pelatihan Alibaba Cloud dari Digitalent Scholarship Kominfo tahun 2024 batch 1, jadi di kesempatan ini saya ingin mengajak teman-teman untuk belajar bersama bagaimana sih cara setup hingga deploy aplikasi web menggunakan layanan ECS (Elastic Compute Service) dari Alibaba Cloud.

## Setup ECS

Hal pertama yang perlu dipersiapkan sudah pasti ECS atau (Elastic Compute Service), jadi ECS ini merupakan salah satu layanan IaaS (Infrastructure as a Service) yang disediakan oleh Alibaba Cloud, atau sebut saja ini layanan hostingnya. Buat akun dan login ke [alibabacloud.com](https://www.alibabacloud.com/) 

## Order ECS

Jangan khawatir, Alibaba sendiri menyediakan trial 3 bulan ECS, di bagian ini kita pilih saja spek yang paling kecil, karena ini sudah cukup untuk kita belajar.

![Order ECS](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jdn4356gegtwxl6hp89a.png)

## Pembayaran

Setelah itu kita akan dialihkan ke halaman pembayaran, untuk bagian ini tidak banyak yang perlu kita lakukan, cukup pilih sistem operasi yang akan digunakan dan mengkonfigurasi management akun, untuk management akun saya atur menggunakan password, password ini nanti digunakan untuk login ke SSH.

![Pembayaran ECS](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9e5wa74t3p1en8qff8li.png)

(opsional) kita juga bisa merubah lokasi server, bandwith atau opsi lainnya, setelah itu pastikan juga kita tidak dikenakan biaya, karena saat ini kita mencoba menggunakan Trial.

## Pembayaran berhasil

Catatan, jika teman-teman diminta mengisi opsi pembayaran, bisa menggunakan kartu MasterCard atau Debit atau PayPal, tidak akan ada penarikan, ini digunakan untuk validasi dan pastikan juga punya saldo setidaknya $1, saldo $1 akan dikembalikan setelah validasi pembayaran berhasil.

![Pembayaran Berhasil](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tdmd56h4h5kfsxerxdyf.png)

## Masuk ke Console ECS

Sekarang kita sudah bisa masuk ke console ECS nih

![Masuk ke console ECS](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3owlcuuykkkzfmpbortf.png)

Setelah itu klik Elastic Compute Service pada bagian Recently Used Product.

![Recently Used Product](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/t5e1p700r7mgbwj2l16z.png)

Kita akan dialihkan ke halaman utama console ECS.

![Halaman utama ECS](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/pkh1x6c2co0r8jpnwtvu.png)

## Login SSH

Di halaman ECS console, kita bisa melihat alamat IP publik ECS yang sudah kita buat, IP ini bisa kita gunakan untuk login ke ECS via SSH. Gunakan password yang dibuat pada saat order ECS di step sebelumnya.

![Putty ECS Alibaba](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/edqoekmteo6t88742lg7.png)

Selamat, sampai disini kita sudah berhasil menyiapkan lingkungan Elastic Compute Service. Biar makin mantap yuk kita lanjut deploy aplikasi web.

## Install Web Server

Karena instance yang kita buat benar-benar masih kosongan, kita coba install web server terlebih dahulu agar dapat menampilkan web statis nantinya. Kita akan install Nginx.

```bash
sudo apt update
sudo apt install nginx -y
sudo systemctl start nginx
```

## Cek Status Nginx

Cek juga status Nginx

```bash
sudo systemctl status nginx
```

![Nginx berhasil running](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1jci9fc1th4sxxxc3sbz.png)
Nginx sudah berjalan di instances.

## Akses Web via Browser

Sekarang kita coba akses web server via browser

![Nginx Error](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ug427aeogxhk5etees0c.png)

Anjay error, error ini terjadi karena kita belum mengizinkan traffic HTTP dari luar untuk mengakses web server kita.

Cara nya dengan mengizinkan port 80 agar public dapat mengakses web server yang sudah kita buat. Masuk ke tab Network & Security pada console Alibaba. Lalu tambahkan rule seperti contoh dibawah ini untuk HTTP.

![Setting firewall ECS Alibaba](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/m4q4e48hq5spbi8cfnbc.png)

Setelah selesai, coba akses lagi IP nya.

![Akses Nginx](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/cwgkohsz2vqz2cjgqh7z.png)

Tara, kita sudah berhasil setup Nginx di instance ECS Alibaba.

Selanjutnya kita ngapain? kita langsung deploy aplikasi.

## Deploy Aplikasi

Untuk deploy aplikasi, saya menggunakan template dari Next.js dan tidak lupa juga menambahkan action untuk proses CI/CD nya.

```yml
//.github/workflows/nextjs.yml
name: Deploy Next.js to Server

on:
  push:
    branches:
      - main

jobs:
  build-and-deploy:
    runs-on: ubuntu-latest

    steps:
      - name: Checkout repository
        uses: actions/checkout@v2

      - name: Install Node.js
        uses: actions/setup-node@v2
        with:
          node-version: "20"

      - name: Install dependencies
        run: npm install

      - name: Build Next.js
        run: npm run build

      - name: Deploy to server
        uses: appleboy/scp-action@master
        with:
          host: 47.243.49.50
          username: ${{ secrets.SERVER_USERNAME }}
          password: ${{ secrets.SERVER_PASSWORD }}
          port: 22
          source: "out/*"
          target: "/var/www/html"
```

## Menyimpan Repository Secrets

Selanjutnya kita perlu menyimpan repository secrets seperti username dan password untuk login ke instances ECS.

![Menyimpan repository secrets](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/x2evjwd9rympbwv1fdva.png)

Setelah itu push atau rerun action github yang sudah kita buat.

![Bikin github ci/cd](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/q7x45goa77rgxklz73tv.png)

Seperti gambar yang terlihat diatas, kita sudah berhasil membuat action Github yang secara otomatis akan membuild dan mendistribusikan project Next.js ke folder /var/www/html di instances ECS Alibaba.

Sekarang kita coba lagi akses IP instances ECS yang sudah dibuat [http://47.243.49.50/](http://47.243.49.50/)

![Koh Jack Ma](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/xdxijhdx5n7qodaczld3.png)

Tara makjreng, kita akan melihat Koh Jack Ma yang lagi memegang logo Alibaba Cloud kebanggaannya.

## Kesimpulan

Di artikel ini kita sudah membahas sedikit tentang salah satu produk unggulan Alibaba Cloud yaitu ECS (Elastic Compute Service), cara order, setup Nginx dan deploy aplikasi web. Kedepannya saya akan coba bahas produk Alibaba Cloud lainnya.

Oke deh teman-teman sekian dulu catatan singkat saya kali ini, jika ada kendala atau kesulitan silahkan ketik di kolom komentar ya, sampai ketemu di catatan Ferry tamvan lainnya. 

Referensi : 
[1]https://stackoverflow.com/questions/62183560/running-nginxon-alibaba-ecs-is-not-reachable-from-the-web
[2]https://www.cyberciti.biz/faq/howto-install-setup-nginx-on-debian-linux-9/