Contents

Custom APEX Domain untuk Github Pages

APEX Domain sering juga disebut bare domain atau Top Level Domain (TLD), merupakan domain utama tanpa imbuhan yang dapat kita pasang pada Github Pages supaya alamat situs web tidak lagi menggunakan subdomain bawaan Github. Kustomisasi domain pada Github Pages cukup mudah, dan mampu memberikan kesan profesional pada situs web.

Memilih Provider

Perhatian
Anggaplah kita sudah memiliki sebuah project yang di-host pada Github Pages, misalnya dalam artikel ini saya menggunakan remote repository dari blog init.web.id.

Github Pages sebetulnya sudah menyediakan alamat domain bagi situs web Github Pages dengan menggunakan domain <username>.github.io tanpa biaya. Namun kita juga dapat merubahnya sesuai keinginan kita, jika telah memiliki TLD sendiri. Saya memutuskan untuk menyewa domain init.web.id dan menggunakannya sebagai domain utama dari blog ini, untuk bahan belajar mencoba hal-hal baru.

/custom-apex-domain-untuk-github-pages/domain-dari-dewabiz.png
Domain dari DewaBiz.com

Terdapat banyak sekali provider layanan sewa domain, dari yang berbayar hingga yang gratis. Karena sebelumnya saya sudah terbiasa berlangganan sewa VPS (Virtual Private Server) MikroTik CHR pada DewaBiz.com, saya ingat bahwa provider tersebut juga menyediakan jasa penyewaan domain yang dilengkapi fitur DNS Management. Saya akhirnya menggunakan jasa DewaBiz.com lagi, kali ini adalah untuk menyewa domain.

Pemesanan Domain

Untuk melakukan pemesanan, kita cukup melakukan registrasi akun seperti pada umumnya. Kemudian mencari alamat domain yang ingin kita sewa, jika tersedia maka domain dapat kita pesan. Setelah melakukan pemesanan, maka lakukan pembayaran sesuai ketentuan yang berlaku pada masing-masing provider. Biasanya kita dapat melakukan transfer lewat ATM Bank, Internet Banking hingga lewat E-Wallet seperti LinkAja, GoPay, atau OVO. Jangan lupa untuk melakukan konfirmasi kepada customer service bahwa kalian telah melakukan pembayaran, dengan melampirkan bukti transaksi (biasanya berupa struk dari ATM atau screenshot jika dilakukan secara virtual) dan sebutkan juga nomor invoice dari pemesanan.

/custom-apex-domain-untuk-github-pages/invoice-pemesanan.png
Invoice Pemesanan


Konfigurasi GitHub Pages

Bagian pertama yang perlu dilakukan adalah melakukan beberapa konfigurasi dari sisi Github. Berikut ini adalah beberapa hal yang perlu kita lakukan pada repository Github.

Membuat CNAME Record

Untuk melakukan pointing domain, sebelumnya kita perlu membuat CNAME record di repository kita. Buat file baru dengan nama CNAME berisikan alamat custom domain yang telah kita sewa, yaitu init.web.id.

1
$ echo "init.web.id" > CNAME

Lakukan commit dan upload perbahan tersebut ke remote repository Github.

1
2
3
$ git add CNAME
$ git commit -m "Add CNAME record"
$ git push

Sehingga direktori repository lokal kita menjadi seperti berikut.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
blog
├── about
├── categories
├── CNAME <--------- Tambahkan file ini
├── css
├── favicon.ico
├── index.html
├── js
├── lib
├── page
├── posts
├── README.md
├── svg
└── tags

Repository Settings

Masuk ke halaman Settings dari repository Github kita untuk melakukan konfigurasi pada repository.

/custom-apex-domain-untuk-github-pages/github-settings.png
Github Settings

Lalu scroll ke bawah sampai bagian Github Pages, silahkan isi kolom tersebut dengan custom domain yang telah kita sewa.

/custom-apex-domain-untuk-github-pages/github-settings-domain.png
Github Settings Domain


DNS Management

Sekarang kita menuju pada situs provider tempat kita menyewa domain (atau disebut registrar). Misalnya di sini saya menggunakan jasa dari DewaBiz.com, maka saya perlu login ke dalam member area lalu masuk ke menu DNS Management. Tambahkan beberapa record seperti berikut.

/custom-apex-domain-untuk-github-pages/dns-management.png
DNS Management

Pengujian DNS Record

Untuk melakukan pengujian, kita dapat menggunakan tools bernama dig. Jalankan perintah berikut pada terminal.

1
$ dig init.web.id +noall +answer

Jika record DNS berhasil diterapkan, maka akan muncul output seperti berikut.

1
2
3
4
> init.web.id     3600    IN A     185.199.108.153
> init.web.id     3600    IN A     185.199.109.153
> init.web.id     3600    IN A     185.199.110.153
> init.web.id     3600    IN A     185.199.111.153
Perhatian
Setelah melakukan semua konfigurasi di atas, pada umumnya akan membutuhkan beberapa waktu sekitar 15 menit hingga record DNS berhasil diterapkan. Jika lebih dari 15 menit tetap tidak berhasil, maka lakukan clear cache pada web browser. Namun jika tetap tidak bisa, maka ada konfigurasi yang masih belum tepat.

HTTPS Enforcement

Github Pages menyediakan HTTPS gratis menggunakan Let’s Encrypt untuk meningkatkan keamanan situs web. Jika kita mengaktifkan fitur Enforce HTTPS, maka seluruh traffic akan di-rewrite menuju protokol HTTPS.

Mengaktifkan Enforce HTTPS

Masuk ke Github Settings lalu centang Enforce HTTPS

/custom-apex-domain-untuk-github-pages/enforce-https.png
Enforce HTTPS

Perhatian
Untuk mengaktifkan Enforce HTTPS biasanya kita perlu menunggu beberapa waktu, karena Github Pages sedang melakukan tahap verifikasi dan generate sertifikat SSL.

Pengujian Enforce HTTPS

Buka domain yang sudah kita pointing menggunakan web browser. Jika berhasil, maka akan muncul tampilan seperti berikut.

/custom-apex-domain-untuk-github-pages/cek-https.png
Cek HTTPS


Kesimpulan

Dengan menggunakan custom domain, maka situs web yang kita terbitkan akan terkesan lebih profesional (setidaknya ada effort lebih dalam membangunnya). Terdapat banyak provider layanan sewa domain yang ada di internet, tidak hanya DewaBiz.com, sesuaikan dengan kebutuhan kita. Selain menggunakan APEX domain / TLD, kita juga dapat menggunakan custom sub-domain seperti blog.<domain>.com dengan konfigurasi yang relatif sama saja seperti di atas.


Referensi