Jika kamu sedang membuat website pribadi, portofolio, atau proyek open-source, GitHub Pages adalah salah satu cara termudah untuk menampilkan websitemu secara gratis. Namun, agar website-mu terlihat lebih profesional, kamu bisa menggunakan domain sendiri (seperti namamu.com) daripada menggunakan alamat bawaan GitHub seperti username.github.io.
Artikel ini akan membahas secara lengkap dan mudah dipahami cara menghubungkan domain sendiri ke GitHub Pages. Cocok banget untuk kamu yang masih pelajar SMA/SMK dan ingin belajar membuat website pribadi dengan tampilan profesional.
Apa itu GitHub Pages?
GitHub Pages adalah layanan gratis dari GitHub yang memungkinkan kamu untuk menghosting website statis langsung dari repository GitHub. Biasanya digunakan untuk:
- Website portofolio
- Dokumentasi proyek
- Blog statis (misalnya dengan Jekyll)
- Halaman landing
URL default GitHub Pages biasanya berupa https://username.github.io.
Jika kamu ingin menggunakan custom domain, seperti namamu.id atau projeksekolah.com, kamu bisa melakukannya dengan mengikuti langkah-langkah di bawah ini.
Syarat yang Diperlukan
Sebelum mulai, kamu perlu menyiapkan:
- Akun GitHub
- Repository GitHub yang sudah diaktifkan GitHub Pages-nya
- Domain yang sudah dibeli, misalnya dari penyedia seperti:
- Niagahoster
- Domainesia
- IDCloudHost
- GoDaddy
- Namecheap
Langkah-Langkah Menghubungkan Domain ke GitHub Pages
1. Aktifkan GitHub Pages di Repository
- Masuk ke akun GitHub kamu
- Pilih repository yang ingin kamu jadikan website
- Klik Settings > Pages
- Di bagian Build and deployment, pilih sumber halaman: biasanya
mainataumaster, lalu folder/rootatau/docs - Klik Save
- GitHub akan memberikan URL default seperti
https://username.github.io/repo-name/
2. Buat File CNAME
Agar GitHub tahu bahwa kamu ingin menggunakan domain sendiri, buat file baru di repository kamu:
- Klik Add file > Create new file
- Beri nama file:
CNAME(huruf kapital semua, tanpa ekstensi) - Di dalam file itu, isi dengan nama domain kamu, contoh:
www.namaku.com - Commit perubahan
3. Arahkan Domain ke GitHub melalui DNS
Langkah ini dilakukan di tempat kamu membeli domain. Masuk ke dashboard domain kamu dan cari menu DNS Management atau Kelola DNS. Tambahkan beberapa record berikut:
A Record (untuk domain tanpa www)
Tambahkan A record berikut untuk mengarahkan domain utama ke IP GitHub Pages:
| Type | Name | Value |
|---|---|---|
| A | @ | 185.199.108.153 |
| A | @ | 185.199.109.153 |
| A | @ | 185.199.110.153 |
| A | @ | 185.199.111.153 |
CNAME Record (untuk domain www)
Tambahkan CNAME record agar www.namaku.com mengarah ke GitHub:
| Type | Name | Value |
|---|---|---|
| CNAME | www | username.github.io |
Gantilah
usernamedengan nama akun GitHub kamu.
4. Cek Pengaturan di GitHub
Setelah kamu menambahkan DNS di pengelola domain, kembali ke halaman Settings > Pages di repository GitHub-mu. Di sana:
- Isi kolom “Custom domain” dengan domain kamu, contoh
www.namaku.com - Centang opsi Enforce HTTPS jika sudah tersedia (kadang butuh beberapa menit hingga aktif)
- Simpan pengaturan
5. Tunggu Propagasi DNS
DNS butuh waktu untuk diperbarui di seluruh dunia. Biasanya butuh antara 5 menit sampai 24 jam, tergantung penyedia domain.
Kamu bisa mengecek apakah domain kamu sudah terhubung ke GitHub Pages dengan mengunjungi domain tersebut di browser.
Tips Tambahan
- Gunakan www atau non-www?
Kalau kamu ingin domain utamanamaku.comlangsung ke GitHub Pages, pastikan kamu mengarahkan A Record dengan benar. Kalau hanya pakaiwww.namaku.com, pastikan redirect dari domain utama kewwwdisetel di DNS atau panel domain kamu. - SSL/HTTPS Gratis
GitHub Pages menyediakan HTTPS gratis lewat Let’s Encrypt. Pastikan kamu mencentang “Enforce HTTPS” untuk keamanan pengunjung situsmu. - Gunakan Subdomain
Kamu juga bisa mengarahkan subdomain sepertiblog.namaku.comke GitHub Pages menggunakan CNAME record.
Kesimpulan
Menghubungkan domain ke GitHub Pages adalah langkah penting agar website kamu terlihat lebih profesional dan mudah diakses. Meskipun kelihatannya rumit di awal, prosesnya sebenarnya cukup sederhana jika kamu mengikuti langkah demi langkah.
Bagi siswa SMA/SMK yang ingin membangun portofolio online atau belajar pengembangan web, ini adalah latihan yang sangat bagus. Kamu tidak hanya belajar cara membuat website, tapi juga memahami bagaimana dunia web bekerja di balik layar.
