Am trecut pe Hugo. Finally

Am mai scris aici despre încercarea mea de a trece cu blogul pe Hugo și care sunt motivele pro și contra. Cu tot răul spre bine, fiind în izolare în perioada aceasta, m-am ambiționat să citesc mai atent documentația lor și cum pot să transform acele argumente contra în unele pro.

Dorința aceasta de a trece pe site static, în primul rând, vine din faptul că îmi doresc un blog cât mai simplu și rapid. WordPress e o platformă foarte bună și complexă. Nu contest asta. Pentru ceea ce am eu nevoie, text și o poză, e nevoie de prea multe resurse în spatele acestuia ca să ruleze.

Trecerea pe site static nu e tocmai ușoară. Chiar dacă am reușit să fac export din WordPress la toate articolele și pozele, nu s-au pupat foarte bine cu formatul pe care-l vrea Hugo pentru a genera paginile. A trebuit să editez fiecare pagină manual. Norocul meu e că am avut doar 96 de articole. Pentru un site mai complex, e grea trecerea din punctul acesta de vedere.

Galerie

Eu am folosit aceste script-uri. Posibil să existe metode mult mai elegante, dar am optat pentru această variantă deoarece îmi dă posibilitatea să adaug manual pozele. Aveam deja la fiecare articol în parte denumirea și calea pozelor folosite. A trebuit doar să le modific în noul format.

{{< gallery >}}
{{< figure src="/upload/poza1.jpg" alt="poză cu mașină" >}}
{{< figure src="/upload/poza2.jpg" alt="accident auto" >}}
{{< /gallery >}}
{{< load-photoswipe >}}

Mai multe detalii despre toate posibilitățiile de implementare și folosire a acestor scripturi, găsiți în documentația lor.

Search

Am optat pentru varianta propusă aici. Nu sunt foarte mulțumit de ea deoarece nu-i nici precisă, nici elegantă, dar pentru moment e funcțională. Mai există variantă cu Google Search ca și căutare pe blog, dar nu o să o fac din două motive:

1. Pentru varianta care pot să fac direct embed în pagina, o să bage reclame. Nu vreau asta.
2. Varianta în care să restricționez pagina de Google Search să caute doar pe acest blog, dar vă trimite de fiecare dată în tab nou și nu-i elegant chiar deloc.

Comentarii

Pentru moment o să le las dezactivate. Mă gândesc să implementez un sistem propus în documentația lor, dar mai am nevoie de timp pentru implementare. O să revin cu update la acest capitol.

Workflow

Eu folosesc Sublime Text, atât pentru programare CNC, cât și pentru a scrie pe blog. Pentru majoritatea shortcode-urilor folosite (precum cel de la galerie) mi-am făcut Snippet. Asta înseamnă că doar încep să scriu hgal și apoi apăs tasta Tab. Sublime Text îmi va auto-completa tot acel cod.

După ce-am scris articolul și-am generat site-ul prin comanda hugo --minify, mi-am făcut un simplu script care face update pe github la acesta și apoi îi face update și la folderul de pe server. În maxim 3-5 secunde, depinde de numărul fișierelor modificate, articolul e online și are și backup pe GitHub.

Cu ajutorul GitHub Actions, nu mai e nevoie să generez site-ul local, doar îl încarc (git push) pe GitHub. Scriptul de mai jos generează în mod automat tot site-ul și-i face update și pe server.

name: Build and deploy hugo on VPS

on:
  push:
    branches:
      - main
  schedule:
    - cron: "20 3 * * *"

jobs:
  deploy:
    runs-on: ubuntu-latest
    steps:
    - name: Checkout
      uses: actions/checkout@v2
      with:
        submodules: true
        fetch-depth: 0

    - name: Hugo setup
      uses: peaceiris/actions-hugo@v2
      with:
        hugo-version: '0.87.0'
        extended: true

    - name: Hugo Build
      run: hugo --gc --minify

    - name: GitHub Pages action
      uses: peaceiris/actions-gh-pages@v3
      with:
        github_token: ${{ secrets.DEPLOY_SECRET }}
        publish_dir: ./public

    - name: SSH Remote Commands
      uses: appleboy/ssh-action@v0.1.4
      with:
        host: ${{ secrets.HOST }}
        username: ${{ secrets.USERNAME }}
        key: ${{ secrets.KEY }}
        port: ${{ secrets.PORT }}
        passphrase: ${{ secrets.PASSPHRASE }}
        script: cd ${{ secrets.PROJECT_PATH }} && git fetch origin && git reset --hard origin/gh-pages

P.S. Pentru cei care nu sunt obișinuiți să lucreze cu acest tip de workflow, poate părea ceva foarte dificil. Odată ce totul e setat și automatizat, e cu mult mai simplu decât a publica din WordPress.

Concluzii

Poate să fie destul de dificil pentru unii în a configura tot acest sistem. Nu e la fel de accesibil precum WordPress pentru cei care nu cunosc puțină programare. Ca și workflow, după ce totul e pus la punct, e mult mai la îndemână. Nu contează dacă am net, nu contează unde mă aflu, pur și simplu deschid un editor de texte și scriu articolul.

Încărcarea paginilor e foarte rapidă. Nu e nevoie de PHP sau bază de date. Fiecare pagină e în format html și poate să fie hostată chiar și in Dropbox sau alt serviciu de cloud.