Introduzione a Jekyll, un generatore di siti statici con funzionalità di blog.

Sin dalla sua creazione questo sito web è stato prodotto utilizzando Jekyll, un generatore di siti web statici con funzionalità di blog.

Non spiegherò dettagliatamente come utilizzare Jekyll, è pieno di siti web e documentazione sul web.

Fondamentalmente il necessario è installare prima Ruby, quindi installare un paio di gemme necessarie per eseguire Jekyll.

gem update
# Updating installed gems
gem install jekyll therubyracer
# Fetching: liquid-2.6.1.gem (100%)
# Successfully installed liquid-2.6.1
# Fetching: fast-stemmer-1.0.2.gem (100%)
# Building native extensions.  This could take a while...
# Successfully installed fast-stemmer-1.0.2
# Fetching: kramdown-1.4.0.gem (100%)
# Successfully installed kramdown-1.4.0
# ...
# 34 gems installed

Il primo comando aggiornerà qualunque gemma Ruby esistente, il secondo installerà jekyll, assieme a tutte le sue dipendenze.

Un sito web rapido può essere creato semplicemente eseguendo:

jekyll new mywebsite
# New jekyll site installed in /home/muflone/mywebsite.
cd mywebsite
jekyll serve
# Configuration file: /home/muflone/mywebsite/_config.yml
#             Source: /home/muflone/mywebsite
#        Destination: /home/muflone/mywebsite/_site
#       Generating... 
#                     done.
# Configuration file: /home/muflone/mywebsite/_config.yml
#     Server address: http://0.0.0.0:4001/
#   Server running... press ctrl-c to stop.

Quindi navigando all’URL http://localhost:4000/ sarà mostrando il nuovo sito web creato da Jekyll.

Se il comando jekyll non può essere trovato potrebbe essere necessario aggiungere la cartella gems (~/.gems/ruby/VERSION/bin) al percorso.

Un metodo alternativo (che preferisco) è quello di creare un alias bash: alias jekyll ~/.gems/ruby/VERSIONE/bin/jekyll

La struttura delle cartella automaticamente create sarà la seguente:

mywebsite
├── about.md
├── _config.yml
├── css
│   └── main.css
├── feed.xml
├── .gitignore
├── _includes
│   ├── footer.html
│   ├── header.html
│   └── head.html
├── index.html
├── _layouts
│   ├── default.html
│   ├── page.html
│   └── post.html
├── _posts
│   └── 2014-06-29-welcome-to-jekyll.markdown
└── _site

Il file _config.yml è il file di configurazione principale del sito e conterrà sia le variabili di sistema che quelle definite dall’utente per utilizzare all’interno di qualsiasi altra pagina web.

La cartella _includes conterrà il codice che si desidera includere all’interno di un altro utilizzando il tag include. Questo è utile per evitare di riscrivere lo stesso codice più volte per pagine o sezioni. Nel sito predefinito saranno forniti tre pezzetti di pagina chiamati footer, header ed head.

La cartella _layouts conterrà le impaginazioni per le pagine, una sorta di schema vuoto per altre pagine. E’ possibile avere un’impaginazione per la pagina iniziale e una differente per le altre pagine o un’impaginazione differente per gli articoli del blog e così via. Le impaginazioni sono la chiave per disegnare il sito web ed ospiteranno alcuni tag segnaposto che saranno sostituiti dal contenuto principale per ottenere una pagina web.

La cartella _posts conterrà tutti gli articoli che successivamente produrranno le pagine web statiche.

La cartella _site conterrà il sito web prodotto dall’unione di tutte le parti ed è questo il contenuto da caricare sul server. Quando si navigherà il sito web locale all’indirizzo http://localhost:4000/ sarà mostrato il contenuto della cartella _site, non sarà mostrato nessun file di jekyll, né alcun file delle cartelle _layouts, _include o _posts ma il sito risultante dalla combinazione di questi contenuti.