Hosting blog Hugo di Netlify dengan custom domain

Terakhir di update 28-01-2024

Tutorial cara hosting blog Hugo di Netlify dengan custom domain yang dibeli sendiri dari provider lain

Blog yang dibuat dengan Hugo disiapkan dulu di local. Instalasi Hugo, download theme, setting theme dan yang lainnya. Setelah siap baru di hosting

Netlify membutuhkan sebuah file config dengan nama netlify.toml. Di setiap theme yang digunakan biasanya sudah ada konfigurasi untuk file tersebut. Jika tidak tersedia, maka harus buat sendiri dengan konfigurasi berdasarkan dokumentasi resminya.

# netlify.toml

[build]
    publish = "public"
    command = "hugo --gc --minify"

[build.environment]
    HUGO_VERSION = "0.121.1"

[context.production.environment]
    HUGO_ENV           = "production"
    HUGO_ENABLEGITINFO = "true"

[context.split1]
    command = "hugo --gc --minify --enableGitInfo"

[context.split1.environment]
    HUGO_ENV = "production"

[context.deploy-preview]
    command = "hugo --gc --minify --buildFuture -b $DEPLOY_PRIME_URL"

[context.branch-deploy]
    command = "hugo --gc --minify -b $DEPLOY_PRIME_URL"

[context.next.environment]
    HUGO_ENABLEGITINFO = "true"

[[redirects]]
    from   = "/npmjs/*"
    to     = "/npmjs/"
    status = 200

Konfigurasi netlify.toml tidak harus sama seperti ini, tiap theme biasanya berbeda parameter, kalau bingung tinggal pakai saja yang ini atau dari dokumentasi resmi
File netlify.toml disimpan di root project, sama dengan lokasi file hugo.toml

Buat repository baru di Github bisa private atau public
Push blog Hugo yang di local ke repo Github yang sudah dibuat
Di Netlify, buat site baru dengan pilihan Import an existing project. Authorize dengan akun Github, setelah tersambung tinggal pilih repository yang akan di host
Tambahkan domain di Netlify untuk site yang sudah dibuat, ikuti saja step yang disediakan
Untuk setiap site yang dibuat, Netlify memberikan sebuah nama dengan subdomain nama-random-12345.netlify.app
Login ke provider tempat domain dibeli, set bagian Nameservers ke pilihan Use default nameservers
Cari menu DNS Management, tambahkan dua data baru
- Host name: @
  Record type: A (Address)
  Address: 75.2.60.5 (IP address ini dari Netlify, bisa dicek disini)
- Host name: www
  Record type: CNAME (Alias)
  Address: nama-random-12345.netlify.app
Jangan lupa di save

Selesai. DNS propagation membutuhkan waktu kurang lebih 24 jam, jadi tunggu saja biasanya beberapa jam sudah jalan semuanya

Bisa dicek di https://dnschecker.org/, tinggal masukkan domain dan cek. Jika semuanya warna hijau berarti DNS propagation sudah jalan, jika masih ada yang merah berarti belum semua jalan

- Iklan -

Tags: Hugo