Cara Membuat Web Statis dengan Hugo

Saya punya blog:

CMS-nya menggunakan Blogger dan Wordpress...

...tapi tidak pernah terurus.

Mungkin saya malas, karena koneksi internet yang kurang cepat.

Maklum tinggal di desa, sinyalnya tidak stabil .

Kendala yang saya alami:

• Malas upload gambar satu per satu ketika membuat artikel.
• Tidak bisa ngedit artikel secara offline.
• Tidak memiliki kuasa penuh terhadap CMS-nya.
• Kurang aman.
• dan masih banyak lagi.

Karena itu, sekarang saya lebih suka ngeblog dari teks editor menggunakan SSG (Static Site Generator) daripada CMS seperti Wordpress.

SSG yang saya pilih adalah Hugo.

Kenapa Hugo?

Menurut klaim mereka (developer Hugo), Hugo lebih cepat daripada SSG yang lain seperti Jekyll, Middleman, Octopress, dll.

Selain cepat, Hugo juga mudah dipelajari.

Buktinya, saya belum pernah menggunakan SSG apa pun sebelumnya...

...Hugo adalah yang pertama.

Hugo memang dibuat dengan bahasa pemrograman Go.

Walaupun saya belum bisa Go, saya masih bisa menggunakan Hugo dengan mudah.

Pada panduan ini, saya akan mengajarimu cara ngeblog dengan Hugo dari awal hingga tahap deploy atau hosting.

Step 1 - Install Hugo

Untuk pengguna distro linux OS ubuntu, and bisa menginstall hugo dengan sangat mudah, cukup ketikkan berikut di command line.

sudo apt-get update
sudo apt-get install hugo

dan hugo akan terinstall otomatis di server kamu. Selanjutnya ketikkan perintah berikut untuk memastikan hugo benar-benar terinstall.

hugo version

command diatas untuk mengecek versi hugo yang terinstall, tampilan outputnya seperti ini.

Hugo Static Site Generator v0.59.1-D5DAB232 linux/amd64 BuildDate: 2019-10-31T15:21:02Z

Untuk platform lain, silakan cari tahu bagaimana cara menginstallnya di halaman dokumentasi resmi Hugo disini.

Step 2 - Generate Situs Baru via Hugo

Setelah Hugo terinstall, langkah selanjutnya adalah kamu membuat sebuah situs baru dengan perintah berikut.

hugo new site testhugo

dan menghasilkan output seperti berikut.

Congratulations! Your new Hugo site is created in /mnt/i/hugo/testhugo.

Just a few more steps and you're ready to go:

1. Download a theme into the same-named folder.
   Choose a theme from https://themes.gohugo.io/ or
   create your own with the "hugo new theme " command.
2. Perhaps you want to add some content. You can add single files
   with "hugo new /.".
3. Start the built-in live server via "hugo server".

Visit https://deuxly.pw/tags/hugo for quickstart guide and full documentation.

command diatas akan membuat sebuah situs hugo baru dengan folder bernama testhugo

dengan struktur folder seperti berikut ini.

archetypes
  default.md
config.toml
content
layouts
  partials
      footer_custom.html
      head_custom.html
resources
  _gen
      assets
      images
static
themes

Step 3 - Tambahkan Tema

Selanjutnya kita akan menambahkan tema. Tema adalah bagian penting di dalam Situs Hugo karena ini akan menunjukkan bagaimana konten anda ditampilkan.

Pertama kita masuk ke folder yang berisi situs hugo yang baru kita buat tadi.

cd testhugo

lalu kita akan menginstall themes bernama pickels atau nantinya kamu bisa memilih themes apa yang kamu mau di directory themes resmi dari Hugo

cd themes

git clone -b release https://github.com/mismith0227/hugo_theme_pickles

Selanjutnya edit file config.toml dengan editor kesayanganmu, tambahkan baris berikut di file config tersebut untuk mengaktifkan theme nya.

theme = "hugo_theme_pickles"
lalu ketik command berikut untuk kamu agar bisa melihat preview webnya.

hugo server

dan taraaaaaa... kamu bisa melihat situs yang baru kita buat dengan membuka url berikut http://localhost:3131 di browser kesayanganmu.

Itu tadi yang bisa kita pelajari untuk awal mengenal Hugo. kedepan kita akan bahas lebih banyak tentang templating, membuat custom theme, dan masih banyak lagi

sumber : Cara Membuat Blog dengan Hugo menggunakan Termux

https://deuxly.pw