Cara Membuat Blog Dengan Hugo

• pengantar
• Prasyarat
• Langkah 1: Instal program Hugo
• Langkah 2: Bangun situs Anda
• Langkah 3: Instal tema dari repositori Hugo
• Langkah 4: Buat beberapa perubahan konfigurasi dasar
• Langkah 5: Buat konten Anda
• Langkah 6: Sesuaikan konten Anda dengan server Hugo
• Langkah 7: Publikasikan situs Anda

pengantar

Hugo adalah generator situs statis dengan kecepatan render yang cepat dan kemudahan penggunaan. Berkat semua fitur yang berorientasi pada konten, Anda selalu dapat fokus pada pembuatan konten daripada membangun lingkungan:

• Dengan Hugo, Anda dapat membangun situs statis yang berjalan di mana saja dalam beberapa menit tanpa harus bergantung pada dependensi atau database yang membosankan.
• Anda dapat menyusun konten dalam Markdown, gaya penulisan paling nyaman, dan secara instan melihat perubahan yang Anda buat di web.
• Selain itu, Anda dapat memanfaatkan repositori tema yang kaya dan komunitas yang berkembang pesat di Hugo.

Dalam tutorial ini, saya akan menunjukkan kepada Anda bagaimana menginstal dan menggunakan Hugo untuk membangun situs blog statis pada instance server Vultr LEMP berbasis CentOS.

Prasyarat

Masuk ke instance Anda sebagai pengguna non-root dengan izin sudo. Lihat cara membuat pengguna seperti itu di artikel ini .

Langkah 1: Instal program Hugo

Hugo dapat diinstal di hampir semua platform utama. Untuk CentOS, Anda hanya perlu mengunduh file program terbaru dalam .tar.gzarsip dan unzip ke lokasi yang nyaman. Pada saat penulisan, versi terbaru adalah 0,15.

sudo yum update -y
sudo yum install git -y
cd ~
wget https://github.com/spf13/hugo/releases/download/v0.15/hugo_0.15_linux_amd64.tar.gz
tar -zxvf hugo_0.15_linux_amd64.tar.gz
sudo mv hugo_0.15_linux_amd64/hugo_0.15_linux_amd64 /usr/local/bin/hugo

Uji instalasi Anda dengan perintah berikut:

 hugo version

Langkah 2: Bangun situs Anda

Dengan Hugo, Anda dapat membangun situs Anda dari dalam folder apa pun di server Anda. Di sini, saya membangun situs di direktori di mysite/bawah direktori home saya.

cd ~
hugo new site ~/mysite

Jalankan perintah berikut untuk melihat arsitektur situs:

cd mysite
ls -lF

Seperti yang Anda lihat, arsitektur situs saat ini menyerupai:

arketipe /

config.toml

kandungan/

data/

tata letak /

statis/

Dengan dua direktori yang akan dibuat, themes/dan public/, seluruh arsitektur situs Hugo kompak namun komprehensif.

Sebagai pemula, ketahuilah bahwa konten Anda harus disimpan dalam direktori content/.

Langkah 3: Instal tema dari repositori Hugo

Untuk menginstal semua tema dari repositori Hugo, jalankan perintah berikut. Ini akan membuat direktori bernama themes/di direktori situs Anda dan mengunduh semua tema dari repo tema Hugo.

cd ~/mysite/
git clone --depth 1 --recursive https://github.com/spf13/hugoThemes.git themes

Jika Anda hanya ingin menginstal satu tema, kunjungi repo tema Hugo untuk menentukan tema favorit Anda. Salin URL-nya dan rekatkan ke git cloneperintah di bawah ini.

cd ~/mysite/
mkdir themes
cd themes
git clone https://github.com/jaden/twentyfourteen

Langkah 4: Buat beberapa perubahan konfigurasi dasar

File yang disebutkan config.tomldalam direktori situs Anda berisi konfigurasi global untuk situs Hugo Anda. Edit file dengan editor teks untuk membuat beberapa perubahan konfigurasi dasar seperti yang tercantum di bawah ini. Ingatlah untuk mengganti nilai sesuai dengan kondisi spesifik Anda.

baseurl = "http://[YourSiteIP]/"
languageCode = "en-us"
title = "Your Site Name"
theme = "twentyfourteen"

Langkah 5: Buat konten Anda

Di direktori situs Anda, masukkan perintah berikut untuk membuat halaman konten di direktori ~/mysite/content/post/.

cd ~/mysite/
hugo new post/about.md

Buka file dalam editor teks, format file harus menyerupai yang berikut ini.

+++
date = "2015-12-25T03:21:23Z"
draft = true
title = "about"

+++

Antara dua baris +++kebohongan informasi meta tentang halaman konten Anda. Di sini, Anda dapat menghapus baris draft = truedan memodifikasi baris judul sesuai keinginan.

Di bawah +++baris kedua , tambahkan konten yang ingin Anda tampilkan di halaman web. Ingatlah untuk menulis konten Anda dalam bahasa Penurunan harga.

## This is an H2 headline

Text goes here.

Setelah menyelesaikan pengeditan ini, biarkan editor teks terbuka untuk digunakan nanti.

Langkah 6: Sesuaikan konten Anda dengan server Hugo

Anda dapat menggunakan server web built-in Hugo untuk menyebarkan situs Anda, yang secara instan dapat menampilkan perubahan Anda pada halaman web segera setelah Anda memodifikasi konten Anda dalam editor teks.

Buka terminal lain, konfigurasikan iptablesaturan untuk memungkinkan akses Anda ke situs Anda pada port default server Hugo 1313:

sudo iptables -I INPUT -p tcp --dport 1313 -j ACCEPT

Luncurkan server Hugo:

hugo server --bind="[YourServerIP]"

Kunjungi situs Anda dari browser:

http://[YourServerIP]:1313

Sekarang, Anda dapat mencoba mengedit konten file halaman di terminal sebelumnya atau menambah / menghapus file halaman. Anda akan menemukan bahwa setiap modifikasi dalam content/direktori akan tercermin secara bersamaan di layar browser Anda. Ini adalah fitur hebat untuk blogger yang sibuk karena Anda selalu dapat segera melihat modifikasi Anda untuk pengalaman menulis yang lebih baik.

Setelah Anda selesai mengedit, tekan Ctrl+Cuntuk menghentikan server Hugo.

Langkah 7: Publikasikan situs Anda

Sekarang saatnya mempublikasikan situs Anda di web. Jalankan perintah berikut dan Hugo akan menghasilkan semua konten statis yang cocok untuk penerbitan dalam public/direktori.

cd ~/mysite
hugo

Catatan : Hugo tidak akan menghapus file lama yang dihasilkan sebelumnya ketika Anda menjalankan perintah di atas. Untuk menghindari hasil yang tidak terduga, Anda selalu dapat menghapus public/direktori sebelum Anda menjalankan hugoperintah atau menentukan tujuan keluaran baru seperti yang ditunjukkan pada perintah berikut.

hugo --destination=public2

Karena server web Nginx sudah berjalan di server, yang perlu Anda lakukan hanyalah menyalin konten ~/mysite/public/direktori atau direktori tujuan kustom lainnya ke direktori web Anda /usr/share/nginx/html/.

Hapus file asli:

cd /usr/share/nginx/html/
sudo rm -rf background.jpg index.php logo.png

Salin file situs statis Anda ke direktori web:

cd ~/mysite/public
sudo cp -R ~/mysite/public/. /usr/share/nginx/html/

Itu dia. Sekarang Anda dapat mengunjungi situs super cepat statis Anda dari browser Anda: http://[YourServerIP].

Untuk melihat detail lebih lanjut, gunakan perintah hugo helpatau kunjungi situs web resmi Hugo .