products/hyde/index.rhtml


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102

<h1>Hyde</h1>

<div class="float-end card h-100" style="margin: 10pt">
    <div class="card-body">
        <h5 class="card-title">Risorse</h5>
        <p class="card-text">
            <a href="https://git.alessandroiezzi.it/hyde.git">Scarica sorgenti</a>
        </p>
    </div>
</div>

<h2>Indice</h2>
<ol>
    <li><a href="#un_piccolo_esempio">Un piccolo esempio</a></li>
</ol>


<p class="hyphens">&Egrave; un piccolo strumento per generare siti web statici, prende ispirazione da
    <a href="https://jekyllrb.com/">Jekyll</a>, soprattutto il nome (Dr. Jekyll e Mr. Hyde). Jekyll l'ho usato per un
    po' di tempo su <a href="https://github.com">GitHub</a>, poi lo provai anche sul mio computer ma lo trovai
    (tutt'ora) un po' macchinoso. I file <i>md</i> se volevo usarli con qualche altro strumento avrei dovuto ripulirli
    dalle intestazioni che Jekyll richiede per definire le properiet&agrave; delle singole pagine. La mia idea &egrave;
    quella di avere un file per il contenuto della singola pagina web totalmente pulita, i metadati devono essere
    salvati su file esterni, proprio per questo motivo ho creato Hyde.</p>


<p>La sua forza sta nella semplicit&agrave; di utilizzo. Non &egrave; stata
  reinventata la ruota; Hyde &egrave; stato scritto in Ruby e fa uso di
  template ERB. Il principio di funzionamento &egrave; quello di avere una
  pagina master che definisce il layout del contenuto del sito web e dei
  file (per il momento ci si limita ai file HTML) che vengono inglobati. In
  questo modo &egrave; possibile separare la grafica dal contenuto.</p>

<h2 id="un_piccolo_esempio">Un piccolo esempio</h2>
<p>Di seguito viene mostrato un esempio di un sito con sole due pagine. Per
  prima cosa si definisce un file <code>master.rhtml</code> che serve da
  template.</p>

<small class="text-muted">master.rhtml</small>
<pre><code>
&lt;html>
  &lt;head>
    &lt;title>&lt;%= @title %>&lt;/title>
  &lt;/head>
  &lt;body>
    &lt;div style="border: 1px solid orange">
      &lt;%= render @pageFileName %>
    &lt;/div>
  &lt;/body>
&lt;/html>
</code></pre>

<p>Le variabili usate sono le seguenti:</p>
<ul>
  <li><code>@title</code> &egrave; il titolo della pagina, viene definito nel file config;</li>
  <li><code>@pageFileName</code> &egrave; il nome del file da renderizzare, in questo esempio vengono renderizzati
      i file <code>pagina1.rhtml</code> e <code>pagina2.rhtml</code>.</li>
</ul>

<small class="text-muted">pagina1.rhtml</small>
<pre><code>
&lt;h1>Pagina uno&lt;/h1>
&lt;p>Contenuto della pagina 1.&lt;/p>
&lt;a href="pagina2.html">Pagina 2 &&zwj;gt;&lt;/a>
</code></pre>

<small class="text-muted">pagina2.rhtml</small>
<pre><code>
&lt;h1>Pagina due&lt;/h1>
&lt;p>Contenuto della pagina 2.&lt;/p>
&lt;a href="pagina1.html">&&zwj;lt; Pagina 1&lt;/a>
</code></pre>

<small class="text-muted">pagina1.rhtml.config</small>
<pre><code>
title: Pagina 1
</code></pre>

<small class="text-muted">pagina2.rhtml.config</small>
<pre><code>
title: Pagina 2
</code></pre>

<p>Dopo aver creato i file, si avr&agrave; la seguente situazione:</p>
<pre><code>
$ ls -1
master.rhtml
pagina1.rhtml
pagina1.rhtml.config
pagina2.rhtml
pagina2.rhtml.config
</code></pre>

<p>A questo punto, si eseguono i seguenti comandi:</p>
<pre><code>
hyde -f pagina1.rhtml > pagina1.html
hyde -f pagina2.rhtml > pagina2.html
</code></pre>

<p>Aprire i due file HTML (pagina1.html e pagina2.html) sul browser.</p>