Cara Hosting Gratis Website HTML di GitLab Pages (Lengkap & Mudah)

Cara Hosting Gratis Website HTML di GitLab Pages (Lengkap & Mudah)

GitLab Pages adalah fitur resmi dari GitLab yang memungkinkan Anda melakukan hosting website statis secara gratis, termasuk website berbasis HTML, CSS, dan JavaScript, maupun static site generator seperti Jekyll, Hugo, Hexo, Middleman, dan Pelican.

Solusi ini sangat ideal untuk:

  • Portfolio developer

  • Landing page bisnis

  • Dokumentasi teknis

  • Company profile statis

  • Project DevOps & CI/CD showcase

Secara default, GitLab Pages menyediakan URL:

https://username.gitlab.io/projectname

Namun, URL ini dapat diganti dengan domain atau subdomain sendiri, lengkap dengan SSL/TLS gratis dari Let’s Encrypt.

1. Membuat Repository (Project) di GitLab

Langkah pertama adalah membuat repository baru di GitLab.

Catatan penting:

  • Repository tidak wajib public

  • Project private tetap dapat digunakan untuk GitLab Pages

Langkah:

  1. Login ke akun GitLab

  2. Klik New Project

  3. Tentukan:

    • Project name

    • Visibility (Private / Public)

  4. Klik Create project

2. Push File Website HTML ke Repository

Pada contoh ini, website HTML menggunakan template gratis dari Colorlib (Safario). Anda dapat menggunakan template HTML apa pun.

Konfigurasi Git di Lokal

cd ~/project-web git init git config user.name "Nama Akun GitLab" git config user.email "email@akungitlab.com" git remote add origin git@gitlab.com:username/projectname.git

3. Konfigurasi GitLab CI/CD untuk Pages

Agar GitLab Pages dapat melakukan deploy otomatis, buat file berikut:

File .gitlab-ci.yml

pages: stage: deploy script: - mkdir .public - cp -r * .public - mv .public public artifacts: paths: - public only: - master

Konfigurasi ini berfungsi untuk:

  • Menyalin seluruh file website

  • Menyimpan hasil build ke direktori public

  • Menjadikannya artifact untuk GitLab Pages

4. Push ke Repository GitLab

git add . git commit -m "Initial commit" git push -u origin master

Setelah push berhasil, pantau proses deploy melalui:

Project → CI/CD → Pipelines

Status passed menandakan proses deploy sukses.

5. Akses Website GitLab Pages

Website tidak langsung aktif secara instan. Berdasarkan pengujian, waktu propagasi awal bisa mencapai ±30 menit.

URL default dapat dicek melalui:

Project → Settings → Pages

Format URL:

https://username.gitlab.io/projectname

6. Menggunakan Custom Domain + SSL Gratis

GitLab Pages mendukung custom domain lengkap dengan SSL Let’s Encrypt tanpa biaya tambahan.

Menambahkan Domain

  1. Masuk ke Project → Settings → Pages

  2. Klik New Domain

  3. Masukkan:

    • Nama domain / subdomain

  4. Aktifkan Let’s Encrypt

  5. Klik Create New Domain

7. Konfigurasi DNS Domain

Tambahkan DNS record berikut di DNS provider Anda:

Opsi 1: CNAME (Direkomendasikan)

CNAME → username.gitlab.io

Opsi 2: A Record

A35.185.44.232

TXT Record (Wajib untuk Verifikasi)

Nilai TXT akan diberikan oleh GitLab untuk proses verifikasi domain.

8. Verifikasi Domain & Aktivasi SSL

Setelah DNS diset:

  1. Kembali ke halaman Pages

  2. Klik Verify

  3. Status akan berubah menjadi Verified

Catatan:
Aktivasi domain dan SSL bisa memakan waktu beberapa jam, tergantung DNS propagation.

9. GitLab Pages dengan Subdomain

Selain domain utama, GitLab Pages juga mendukung:

  • www.domain.com

  • blog.domain.com

  • docs.domain.com

Konfigurasinya identik dengan custom domain biasa.

Kesimpulan

GitLab Pages adalah solusi enterprise-grade, gratis, dan scalable untuk hosting website statis dengan fitur unggulan:

  • Gratis tanpa batas waktu

  • CI/CD terintegrasi

  • Custom domain & SSL otomatis

  • Cocok untuk DevOps, developer, dan bisnis digital

Dengan konfigurasi yang tepat, GitLab Pages dapat menjadi alternatif hosting profesional tanpa biaya operasional.