Empty the Cache Giorgio Aquino

Con CMS headless si intende un Content Management System che non offre una parte "presentazionale". In pratica non offre la parte di frontend, il sito che vede l'utente finale. Niente HTML, CSS e javascript.

Spostare la propria infrastruttura verso un sistema CMS headless aiuta a tenere separate le varie parti e a poterle aggiornare in modo indipendente, eliminando le dipendenze che ci sono tra il frontend e il backoffice.

Ovviamente si aggiunge un po' di complessità. Ma oggi come oggi ci sono strumenti che ci aiutano.

Come servizi sono da provare di sicuro sanity.io, DatoCMS, Prismic.io e Contentful.

In genere tutti hanno un base gratuita, con cui ci si può fare un idea.

Poi si possono sempre usare Wordpress o Drupal come CMS headless utilizzando le loro API, o progetti dedicati come Strapi o OctoberCMS.

Oppure, uno strumento come Netlify CMS permette di usare GitHub come contenitore per i nostri contenuti. Versionati.

Su headlesscms.org si possono trovare un elenco di cosa c'è in giro.

Photo by Faris Mohammed on Unsplash

Formattare nel modo corretto il codice ci aiuta a mantenere ordinato il nostro codice sorgente e a trovarlo leggibile anche mesi dopo che lo riprendiamo in mano

Definire una linea guide comune semplifica la condivisione del codice tra più persone o piu team.

Come punti di riferimento per un progetto l'uso di editorconfig, prettier o standardjs riescono ad aiutare l'automazione della formattazzione del codice.

Poi tutti i vari editor o IDE del caso hanno plugin per farlo, in modo automatico o a comando.

Photo by Markus Spiske on Unsplash

Nello sviluppo di siti o applicazioni web, una parte sempre critica è di sicuro il CSS.

Il CSS-in-JS permette di scrivere lo stile direttamente in JS e aiuta ad avere uno scope isolato, evitare codice morto e strutturare lo stile in moduli.

Una buon punto di partenza per dare un occhio a cosa c'è di disponibile, di sicuro è il repo CSS-in-JS di Michele Bertoli

Io personalmente uso con piacere Styled Component e mi piacciono anche styled-jsx ed Emotion

Infine una naming convention come BEM e SMACSS aiutano molto a strutturare il proprio codice CSS.

Photo by Pankaj Patel on Unsplash

In questa prima puntata, faccio una panoramica su cosa sono i generatori di siti statici, come si usano e in breve quali vantaggi portano.

Uso da tempo Gatsby JS, dalla 1.0, ma ci sono tanti altri progetti interessanti, come 11ty.io, Hexo, Hugo, VuePress e Next.js

Se ne trovano per ogni gusto su https://www.staticgen.com/

Poi una volta creato un sito statico serve un hosting per pubblicarlo.
Netlify risulta essere uno dei migliori, come semplicità e qualità del servizio. Ma anche surge.sh non è male, e c'è sempre Now di Zeith se serve qualcosa in più

Ma perchè non usare un CMS headless per aggiornare i contenuti del nostro sito.
Qua un altro elenco https://headlesscms.org/

Photo by David Becker on Unsplash