Mudah Membuat Blog dari Terminal dengan Hugo Bagian 3: Custom Domain dengan HTTPS

Bagus Aji Santoso 26 Februari 2018

Mudah Membuat Blog dari Terminal dengan Hugo Bagian 3: Custom Domain dengan HTTPS

Di artikel bagian pertama, kita sudah berhasil men-generate blog baru dengan Hugo. Di artikel bagian kedua kita sudah mengunggah blog hugo ke server Netlify, namun masih menggunakan sub-domain dari mereka. Di artikel kali ini kita akan belajar bagaimana cara untuk mengarahkan domain yang kita beli sendiri untuk mengarahkan ke sub-domain Netlify.

Konfigurasi Custom Domain di Netlify

Karena penulis sudah punya domain sendiri, maka domain tersebut akan penulis arahkan ke sini (https://sad-murdock-dfcbde.netlify.com). Klik Set up a custom domain. Di halaman baru yang muncul, klik Add custom domain lalu isi dengan domain yang pembaca miliki.

Image

Atur Name Records Domain

Selanjutnya kita harus mengatur name records dari domain milik kita di dashboard perusahaan hosting tempat membelinya. Kita harus mengatur record type A dengan IP dari Netlify 104.198.14.52 dan CNAME untuk www dengan nama domain yang kita dapatkan sebelumnya (dalam kasus penulis domain tersebut adalah https://sad-murdock-dfcbde.netlify.com). Jika kesulitan menemukan menu untuk mengaturnya, buka saja tiket baru dan minta bantuan dari tempat membeli domain.

Image

Simpan dan tunggu beberapa saat (bisa beberapa jam) agar domain kita bisa terhubung dengan sistem Netlify.

Atur HTTPS

Setelah beberapa saat, domain kita akhirnya terhubung dengan sistem Netlify. Saat kita hubungkan, terlihat bahwa domain masih belum menggunakan HTTPS.

Image

Untuk browser seperti Chrome yang akan selalu mengakses melalui HTTPS, kekurangan ini bisa merepotkan karena pengunjung harus memberikan semacam exception setiap kali akan mengakses. Jadi, sekarang kita aktifkan dulu HTTPS di domain Netlify menggunakan Let's Encrypt. Di dashboard Netlify, klik tombol Domain Settings.

Image

Pilih HTTPS di menu yang ada di sebelah kiri, lalu klik tombol Verify DNS Configuration.

Image

Selanjutnya, klik tombol Let's Encrypt certificate.

Image

Terakhir saat muncul dialog berikut, klik tombol Provision certificate.

Image

Tunggu beberapa saat hingga proses pemasangan sertifikat berhasil.

Image

Tunggu lagi beberapa menit dan coba refresh browser yang sedang membuka domain kita. Perhatikan bahwa akses HTTPS sudah berhasil dengan tanda gembok hijau dan teks Secure yang menandakan pemasangan sertifikat Let's Encrypt berjalan dengan baik.

Image

Sekarang, setiap kali kita membuat post baru dan melakukan push ke GitHub, secara otomatis Netlify akan mendeteksinya lalu menjalankan perintah yang men-generate halaman statis dari file markdown yang kita tulis. Hasilnya bisa langsung kita lihat beberapa saat setelah proses generate di Netlify selesai.