Deployment Statik Website

Sebelum melakukan deployment, ada beberapa hal yang harus anda siapkan, yaitu:

  • Akun Awanio
  • ssh public key yang sudah didaftarkan di halaman dahsboard Awanio
  • git url endpoint yang akan digunakan untuk push code. Formatnya adalah git@awan.io:TEAM/APP_NAME.git
  • file awan.yml yang diletakan pada top folder aplikasi statik website anda.

Buat sebuah folder tempat untuk menyimpan semua file aplikasi, misalnya kita beri nama my-web. Di dalam folder ini buat sebuah folder dengan nama public dan sebuah file dengan nama awan.yml.

Folder public akan kita gunakan untuk menyimpan semua file statik dan juga asset yang akan langsung diakses oleh browser. Penamaan folder public ini bisa kita sesuaikan dengan nama lain. Yang perlu menjadi perhatian, apapun nama yang digunakan untuk folder ini, pastikan nama tersebut juga terdefenisikan di dalam file awan.yml.

Di dalam folder public, buat sebuah file dengan nama index.html. Anda juga bisa menambahkan file css, js, image ico, font dll sesuai dengan kebutuhan. Isikan file index.html ini dengan isi:

<!doctype html>
<html lang="en">
  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>Hello, world!</title>
  </head>
  <body>
    <h1>Hello, world!</h1>
  </body>
</html>

Selanjutnya, pada file awan.yml isikan beberapa konfigurasi yang dibutuhkan. Berikut adalah contoh file awan.yml untuk statik website:

version: '1.0'
web:
  type: static
  doc_root: ./public

Setelah aplikasi siap, tambahkan git remote Awanio ke dalam project:

git remote add awan git@awan.io:TEAM/APP_NAME.git

Untuk selanjutnya silahkan commit dan push ke git server ke Awanio

git push awan master

Setelah deployment selesai silahkan cek aplikasi anda pada https://app-name.diawan.id

File htaccess

Awanio menggunakan Apache Httpd sebagai runtime. Dengan demikian, anda bisa menambahkan file .htaccess pada folder doc_root aplikasi. Anda bisa memanfaatkan fitur ini untuk aplikasi SPA yang menggunakan pushstate pada browser.

Berikut contoh file .htaccess dalam melakukan handler rewrite request:

<IfModule mod_rewrite.c>
    <IfModule mod_negotiation.c>
        Options -MultiViews
    </IfModule>

    RewriteEngine On

    # Redirect Trailing Slashes If Not A Folder...
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteRule ^(.*)/$ /$1 [L,R=301]

    # Handle Front Controller...
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteRule ^ index.html [L]

</IfModule>