Kako napraviti blog s Hugom

Uvod

Hugo je generator statičkih stranica s munjevitom brzinom renderiranja i izvrsnom jednostavnošću korištenja. Zahvaljujući svim značajkama usmjerenim na sadržaj, uvijek se možete usredotočiti na stvaranje sadržaja umjesto na izgradnju okoliša:

• Uz Hugo, možete izgraditi statičnu stranicu koja se pokreće bilo gdje u nekoliko minuta bez zamornih ovisnosti ili baza podataka.
• Možete sastaviti svoj sadržaj u Markdownu, najprikladnijem stilu pisanja, i odmah vidjeti promjene koje ste napravili na webu.
• Nadalje, možete maksimalno iskoristiti Hugovo bogato spremište tema i brzorastuću zajednicu.

U ovom vodiču pokazat ću vam kako instalirati i koristiti Hugo za izgradnju statične blog stranice na instanci Vultr LEMP poslužitelja baziranom na CentOS-u.

Preduvjeti

Prijavite se na svoju instancu kao nekorijenski korisnik s sudo dopuštenjima. Kako stvoriti takvog korisnika pogledajte u ovom članku .

Korak 1: Instalirajte program Hugo

Hugo se može instalirati na gotovo sve mainstream platforme. Za CentOS, trebate samo preuzeti najnoviju programsku datoteku u .tar.gzarhivu i raspakirati je na prikladno mjesto. U trenutku pisanja, najnovija verzija je 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

Testirajte svoju instalaciju sljedećom naredbom:

 hugo version

Korak 2: Izgradite svoju web stranicu

Uz Hugo, možete izgraditi svoju web stranicu iz bilo koje mape na vašem poslužitelju. Evo, napravio sam web-mjesto u imeniku mysite/ispod svog matičnog imenika.

cd ~
hugo new site ~/mysite

Pokrenite sljedeće naredbe da vidite arhitekturu web-mjesta:

cd mysite
ls -lF

Kao što vidite, trenutna arhitektura stranice sliči:

archetypes/

config.toml

content/

data/

layouts/

static/

Uz još dva direktorija koja će se stvoriti, themes/i public/, cijela arhitektura Hugo stranice je kompaktna, ali sveobuhvatna.

Za početak, znajte da bi vaš sadržaj trebao biti pohranjen u direktorij content/.

Korak 3: Instalirajte teme iz Hugo repozitorija

Da biste instalirali sve teme iz Hugo repozitorija, pokrenite sljedeće naredbe. To će stvoriti direktorij s imenom themes/u imeniku vaše stranice i preuzeti sve teme iz Hugo repo tema.

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

Ako samo želite instalirati jednu temu, posjetite Hugo repo teme kako biste odredili svoju omiljenu temu. Kopirajte njegov URL i zalijepite ga u git clonenaredbu u nastavku.

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

Korak 4: Napravite neke osnovne promjene konfiguracije

Datoteka nazvana config.tomlu imeniku vaše web-lokacije sadrži globalnu konfiguraciju vaše Hugo stranice. Uredite datoteku u uređivaču teksta kako biste napravili neke osnovne promjene konfiguracije kao što je navedeno u nastavku. Ne zaboravite zamijeniti vrijednosti prema vašim specifičnim uvjetima.

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

Korak 5: Sastavite svoj sadržaj

U imeniku web-mjesta unesite sljedeću naredbu za stvaranje stranice sa sadržajem u direktoriju ~/mysite/content/post/.

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

Otvorite datoteku u uređivaču teksta, format datoteke trebao bi nalikovati sljedećem.

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

+++

Između dva retka +++nalaze se meta informacije o vašoj stranici sa sadržajem. Ovdje možete ukloniti redak draft = truei izmijeniti redak naslova kako želite.

Ispod drugog +++retka dodajte sadržaj koji želite prikazati na web stranici. Ne zaboravite napisati svoj sadržaj na jeziku Markdown.

## This is an H2 headline

Text goes here.

Nakon završetka ovog uređivanja, ostavite uređivač teksta otvorenim za kasniju upotrebu.

Korak 6: Prilagodite svoj sadržaj pomoću Hugo poslužitelja

Možete koristiti Hugov ugrađeni web-poslužitelj za implementaciju vaše stranice, koja može trenutačno prikazati vaše promjene na web stranici čim izmijenite svoj sadržaj u uređivaču teksta.

Otvorite drugi terminal, konfigurirajte iptablespravila kako biste omogućili pristup vašoj web-lokaciji na zadanom portu 1313 Hugo poslužitelja:

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

Pokrenite Hugo poslužitelj:

hugo server --bind="[YourServerIP]"

Posjetite svoju web stranicu iz preglednika:

http://[YourServerIP]:1313

Sada možete pokušati urediti sadržaj datoteke stranice u prethodnom terminalu ili dodati/ukloniti datoteku stranice. Vidjet ćete da će se sve izmjene u content/imeniku istovremeno odraziti na zaslonu vašeg preglednika. Ovo je izvrsna značajka za zaposlene blogere jer uvijek možete odmah vidjeti svoje izmjene za bolje iskustvo skladanja.

Nakon što završite s uređivanjem, pritisnite Ctrl+Cza zaustavljanje Hugo poslužitelja.

Korak 7: Objavite svoju web stranicu

Sada je vrijeme da svoju stranicu objavite na webu. Pokrenite sljedeće naredbe i Hugo će generirati sav statički sadržaj prikladan za objavljivanje unutar public/direktorija.

cd ~/mysite
hugo

Napomena : Hugo neće izbrisati stare datoteke koje su prethodno generirane kada pokrenete gornje naredbe. Kako biste izbjegli neočekivane rezultate, uvijek možete izbrisati public/direktorij prije nego što pokrenete hugonaredbu ili navedite novo odredište izlaza kao što je prikazano u sljedećoj naredbi.

hugo --destination=public2

Budući da je Nginx web poslužitelj već pokrenut na poslužitelju, sve što trebate učiniti je kopirati sadržaj ~/mysite/public/direktorija ili drugih prilagođenih odredišnih direktorija u vaš web direktorij /usr/share/nginx/html/.

Izbrišite izvorne datoteke:

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

Kopirajte svoje statičke datoteke web-mjesta u web-direktorij:

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

To je to. Sada možete posjetiti svoju super brzu statičnu stranicu iz svog preglednika: http://[YourServerIP].

Da biste vidjeli više pojedinosti, upotrijebite naredbu hugo helpili posjetite Hugo službenu web stranicu .