Comment le site est fabriqué ?

Ici tout est simple, en essayant de pouvoir être compris et modifié/adapté par le plus grand nombre.

Un grand merci à @prx pour le travail initial avec son make website.

Le site se décompose en plusieurs parties:

Un fichier Makefile
Deux fichiers *.tpl
une base index.md
un dossier bin comportant les scripts utilisés pour la construction
un dossier www avec les fichiers sources (.md) et les fichiers générés (*.html)

Les fichiers *.tpl viennent entourer les fichiers sources pour qu’ils puissent être proprement rendus en html, en y ajoutant un entête avec un menu ainsi qu’un pied de page avec différents liens.

La conversion markdown > html est assuré par lowdown.

Le Makefile

Le Makefile permet avec la commande make d’interagir facilement avec le site. Il permet ainsi de nettoyer entièrement les fichiers générés (make clean), de générer le site (make) ou encore d’envoyer le tout sur le serveur (make upload).

.SUFFIXES: .md .html                                                                            

# configuration                                                                                 
SRCDIR = www                                                                                    
SSHCRED = justin@bloguslibrus.fr                                                                
REMOTEDIR = ~/blog                                                                              
# markdown converter                                                                            
MDTOHTML = lowdown \                                                                            
        --html-no-skiphtml \                                                                    
        --html-no-escapehtml \                                                                  
        --html-no-head-ids \                                                                    
        --parse-no-metadata                                                                     
# ---                                                                                           

SRC != find $(SRCDIR) -type f -name \*.md -exec ls -t "{}" +                                    
FEED != find $(SRCDIR)/lmda $(SRCDIR)/ppm $(SRCDIR)/tdv $(SRCDIR)/cdj -type f -n                ame \*.md -a ! -name \index.md -exec ls -t "{}" +                                               
OUT = ${SRC:.md=.html}

all: \                                                                                          
        $(OUT) \                                                                                
        genindex \
        htmlifylinks \
        $(SRCDIR)/atom.xml \
        $(SRCDIR)/sitemap.xml

clean:
        find . -name \*.html -delete

.md.html:
        @echo $<
        @cat head.tpl > $@
        @echo "<a href=\"../\"><--</a>" >> $@
        @$(MDTOHTML) $< >> $@
        @bin/backlinks.sh $< >> $@
        @cat foot.tpl  >> $@
        @bin/title.sh $@

genindex:
        @echo "Generate homepage"
        @cat head.tpl > www/index.html
        @cat index.md | $(MDTOHTML) >> www/index.html
        @bin/changes.sh >> www/index.html
        @cat foot.tpl >> www/index.html
        @bin/title.sh www/index.html

htmlifylinks:
        @echo "htmlifylinks"
        @bin/htmlifylinks.sh

$(SRCDIR)/atom.xml: $(OUT)
        @echo "$@"
        @bin/atom.sh $(FEED) > $@

$(SRCDIR)/sitemap.xml: $(OUT)
        @echo sitemap
        @bin/sitemap.sh $(OUT) > $(SRCDIR)/sitemap.xml
        @gzip --best -c $(SRCDIR)/sitemap.xml > $(SRCDIR)/sitemap.gz

serve:
        cd $(SRCDIR) && python3 -m http.server

upload:
        openrsync --rsync-path=openrsync -e "ssh" -apv ./ $(SSHCRED):$(REMOTEDIR)/

get:
        openrsync --rsync-path=openrsync -e "ssh" -apv $(SSHCRED):$(REMOTEDIR)/ ./

Les scripts

Dans le dossier bin on retrouve plusieurs scripts venant enrichir la simple conversion des fichiers sources en fichiers html. Tous les scripts sont écris pour fonctionner sous l’OS OpenBSD en utilisant que des commandes présentes dans le système de base. Ces dernières sont également disponibles sous Linux, seuls les arguments et la syntaxe peuvent varier.

backlinks.sh recherchent les références croisées pour les faire apparaître sur la page html.
Ainsi, si a est référencé dans b et e, ces deux derniers apparaitront en bas de page.

#!/bin/sh

target=$(echo ${1} | cut -c 5-)
echo "<h2>Liens entrants</h2>"
echo "<ul>"
for i in $(grep -l "$target" www/*.md | cut -c 5-)
do
    title=$(head -1 www/$i | cut -c 3-)
    echo "<li><a href=\"$i\">$title</a></li>"
done
echo "</ul>"

changes.sh génère une liste des pages modifiées pour la page d’accueil du site.

#!/bin/sh

(
echo "<ul>"
for l in $(find www -type f -name \*.md -a ! -name home.md -a ! -name \index.md -a ! -name io.md  -exec ls -t "{}" + | head -10)
do
        TITLE="$(grep -m1 "# " "${l}" | cut -c 3-)"
        if [ -n "${TITLE}" ]; then
                printf '<li><a href="%s">%s</a></li>\n' "$(printf "%s" ${l} | cut -d'/' -f2-)" "${TITLE}"
        fi
done
echo "</ul>"
)

htmlifylinks.sh se charge de convertir les liens entre les fichiers sources en transformant l’extension md en html

#!/bin/sh

find www -type f -name \*.html -print0 | xargs -0 sed -i 's/.md\"/.html\"/g'

title.sh inclue le titre du fichier source dans la balise <title> du fichier html.

#!/bin/sh
# add title after <title> line according to h1 found
DEFAULT=" "
TITLE="$(grep -m1 "<h1>" "${1}"| \
sed -n -e 's/.*<h1>\(.*\)<\/h1>.*/\1/p') — "

test -z "${TITLE}" && TITLE="${DEFAULT}"
sed -i "/<title>/a\\
${TITLE}" "${1}"

sitemap.sh génère un fichier sitemap.html du site.

#!/bin/sh

printf '%s\n' \
'<?xml version="1.0" encoding="UTF-8"?>
<urlset
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://www.sitemaps.org/schemas/sitemap/0.9
http://www.sitemaps.org/schemas/sitemap/0.9/sitemap.xsd"
xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">'

for l in $@
do
        printf '<url><loc>%s</loc><lastmod>%s</lastmod></url>\n' \
        "https://${l}"\
        "$(date -r $(stat -f %m ${l%.*}.md) +%Y-%m-%d)"
done

printf '%s' '</urlset>'

atom.sh génère un fichier de flux rss/atom en utilisant seulement les fichiers dans les dossiers spécifiés. Ainsi le lecteur reçoit seulement les textes. Les modifications apportées dans le jardin numérique n’y figurent pas, il entrainerait de trop nombreuses actualisations du flux et le lecteur pourrait s’y perdre.

#!/bin/sh
max=20
domain="bloguslibrus.fr"
i=0

feed_updated=$(date +%Y-%m-%dT%TZ)

cat <<EOF
<?xml version="1.0" encoding="utf-8"?>
<feed xmlns="http://www.w3.org/2005/Atom">
<id>https://${domain}/all.html</id>
<title>Blogus Librus</title>
<icon>https://${domain}/favicon.png</icon>
<link rel="alternate" type="text/html" href="https://${domain}" />
<link rel="self" type="application/atom+xml" href="https://${domain}/atom.xml" />
<author><name>jbz, jnb</name></author>
<updated>${feed_updated}</updated>
EOF

for line in $@; do
        test $i -ge $max && break
        i=$(($i+1))
        f="$(basename ${line})"
        created="${f%.*}"

        published="$(date -ur $(stat -f %m ${line}) +%Y-%m-%dT%T%z)"
        updated="$(date -ur $(stat -f %c ${line}) +%Y-%m-%dT%T%z)"
        title="$(grep -m1 "#" "${line}"| sed -E 's/^# ?//')"
        link="$(printf "%s" ${line} | cut -d'/' -f2- | sed 's/\.md$/.html/')"

        cat <<EOF
<entry>
<id>https://${domain}/${link}</id>
<title>${title}</title>
<updated>${updated}</updated>
<published>${published}</published>
<link rel="alternate" href="/${link}"/>
<content type="html">
   <![CDATA[ $(cat ${line} |  lowdown --html-no-skiphtml --html-no-escapehtml --html-no-head-ids --parse-no-metadata)]]>
</content>
</entry>
EOF
done

echo "</feed>"

Liens entrants: 2023_journal | 2023_log | home |