Artikel ini bertujuan menjelaskan konsep Hugo, Static Site Generator (SSG), Content Management System (CMS), dan keunggulan SSG dibandingkan dengan CMS. Untuk memudahkan pemahaman, kita akan memulai dengan mendefinisikan masing-masing konsep sebelum membahas detailnya.

Pengertian Hugo dan Static Site Generator

Static Site Generator (SSG) framework untuk membuat situs web secara “dinamis”. Istilah “dinamis” di sini mengacu pada kemampuan untuk memisahkan struktur halaman web, seperti Header, Main, Article, Section, Footer, dan bagian lainnya menjadi sub-seksi mandiri yang dapat digunakan berulang kali, mirip dengan pembuatan layout untuk situs web dinamis.

Perbedaan utama antara situs web statis dan dinamis terletak pada cara situs tersebut merespons permintaan “data”. Situs web dinamis dapat menyediakan informasi ke server, seperti informasi kredensial (email, password), atau kartu kredit, sedangkan situs web statis hanya menampilkan halaman yang sudah ada di server tanpa kemampuan mengirimkan data ke server.

Situs web statis memiliki berbagai jenis, seperti halaman blog (contohnya Learn With Ghaniy) atau halaman profil, baik untuk perusahaan maupun individu. Hugo adalah salah satu alat dalam kelompok Static Site Generator, bersama dengan alat lain seperti Jekyll, Gatsby, Hexo, VuePress, dan sebagainya. Perbandingan lebih detail antara situs web statis dan dinamis akan dijelaskan dalam artikel berikutnya.

Keunggulan SSG Dibanding CMS

Content Management System (CMS) merupakan alat yang umum digunakan untuk membuat situs web dinamis tanpa perlu membuat situs tersebut dari awal. Pengguna dapat mengonfigurasi CMS tanpa memerlukan pengetahuan pemrograman. CMS sering digunakan untuk membuat blog, profil perusahaan, situs belanja online, dan lain sebagainya.

Apa kelebihan Hugo (dan SSG pada umumnya) dibandingkan dengan CMS seperti Wordpress?

  1. SSG memberikan keleluasaan lebih dalam kreativitas tampilan, terutama jika pengguna sudah memiliki dasar pemrograman web.
  2. SSG membutuhkan sumber daya yang lebih sedikit dibandingkan dengan CMS, karena CMS memerlukan server khusus untuk menjalankan bahasa sisi server dan database-nya.
  3. SSG dianggap lebih aman dibandingkan dengan CMS karena web statis tidak memproses permintaan dari klien.
  4. Banyak penyedia hosting gratis yang mendukung SSG, seperti Netlify, Github Pages, Cloudflare Pages, Vercel, dan lain-lain.
  5. Integrasi dengan penyedia hosting tersebut lebih mudah dibandingkan dengan CMS; cukup menghubungkan akun Git dengan layanan hosting dan membuat Pipeline untuk proses build dan deploy.

Meski demikian, SSG juga memiliki kekurangan, seperti kemampuannya yang terbatas hanya untuk menampilkan konten statis, memerlukan pengaturan awal sebelum digunakan, dan membutuhkan pemahaman dasar tentang Git, perintah di Terminal Linux/Command Line Windows, serta pemrograman web.

Dengan pemahaman dasar perbedaan antara SSG dan CMS, pembaca diharapkan dapat mempertimbangkan penggunaannya sesuai dengan kebutuhan masing-masing. Selanjutnya, kita akan melanjutkan ke tahap persiapan instalasi Hugo.

Persiapan Instalasi

Sebelum memulai instalasi, pastikan Git sudah terinstal di komputer pengguna dengan mengetik perintah git --version. Jika muncul pesan kesalahan seperti git: command not found, kemungkinan besar Git belum terinstal.

Pembaca dapat melanjutkan ke langkah Instalasi Snap jika Git sudah terinstal dan berfungsi dengan baik.

Instalasi Git

Berikut langkah-langkahnya:

  1. Pastikan untuk melakukan pembaruan repository Ubuntu dengan perintah sudo apt update -y && sudo apt dist-upgrade -y.
  2. Tunggu hingga proses pembaruan selesai.
  3. Jika sudah, masukkan perintah sudo apt install git.
  4. Pastikan instalasi Git berhasil dengan mengecek versi menggunakan perintah git --version.
  5. Pastikan juga sudah memiliki akun Git (pilih salah satu: Github, Gitlab, Atlassian Bitbucket) atau penyedia Git lainnya.
  6. Masukkan Username Git pada konfigurasi global Git di komputer dengan perintah git config --global user.name "usernameKalian".
  7. Masukkan Email Git pada konfigurasi global Git di komputer dengan perintah git config --global user.email "[email protected]".
  8. Mulailah berlatih menggunakan Git dengan membaca tutorial dan dokumentasi.

Instalasi Snap

Terdapat banyak cara untuk menginstal Hugo, salah satunya menggunakan Snap Package. Bagi pengguna Linux, terutama Ubuntu, disarankan untuk menggunakan Snap Package daripada menggunakan apt package, tarball, atau build from source. Alasan utamanya adalah Snap menyediakan pembaruan terbaru dengan bug minimal, serta otomatis mengupdate ke versi terbaru jika ada pembaruan.

Pastikan Snap sudah terinstal di komputer dengan mengetik perintah snap --version di terminal. Jika versi terkini muncul, pengguna dapat melanjutkan ke tahap Instalasi Hugo. Jika pesan kesalahan muncul, seperti snap: command not found, kemungkinan Snap belum terinstal di komputer.

Berikut langkah-langkahnya:

  1. Pastikan untuk melakukan pembaruan repository Ubuntu dengan perintah sudo apt update -y && sudo apt dist-upgrade -y.
  2. Tunggu hingga proses pembaruan selesai.
  3. Jika sudah, masukkan perintah sudo apt install snapd.
  4. Untuk menguji keberhasilan instalasi Snap, masukkan perintah sudo snap install hello-world.
  5. Lalu ketik hello-world.
  6. Jika perintah Snap belum muncul, coba restart komputer.

Instalasi Hugo

Jika pre-installation requirements diatas sudah terpenuhi, saatnya menginstal Hugo.

Berikut langkah-langkahnya:

  1. Ketik perintah snap install hugo.
  2. Setelah selesai, pastikan Hugo terinstal dengan menjalankan perintah hugo version.
  3. Jika terjadi galat, coba tutup terminal saat ini, buka terminal baru, lalu ketik perintah di atas.
  4. Jika masih belum berhasil, coba restart komputer. Ulangi langkah instalasi jika galat masih berlanjut.

SELESAI.

Jangan lupa untuk membaca dokumentasi resmi Hugo 😉

Untuk membuat proyek Hugo baru, instal tema, dan melakukan konfigurasi dasar Hugo, pembahasan akan dilanjutkan pada artikel berikutnya. 🔥

Semoga bermanfaat…