Ci sono molte cose che uno sviluppatore web deve imparare. L’intricato mondo dei framework javascript occupa già una bella fetta del tempo a disposizione, quindi se c’è un modo per evitare di sprecare tempo si è sempre felici di approfittarne!
Gestire i dati di un’applicazione può essere un compito molto arduo: bisogna impostare il database, creare le api e valutare come consumarle, scegliere l’infrastruttura migliore, …
Ovviamente non è possibile eliminare del tutto questo onere, però possiamo alleviarlo utilizzando un Headless CMS.
Cosa sono gli Headless CMS?
Il termine CMS sta per Content Management System (sistema di gestione dei contenuti). Wordpress, per esempio, è uno dei più famosi CMS a disposizione: ti permette di creare pagine, post, organizzare il tutto e mostrarlo facendo uso di vari temi. Altri esempi di CMS sono Shopify, Prestashop, ecc…
Un CMS Headless è un modo di organizzare i dati per il nostro sito o le nostre app, senza però avere un’interfaccia già pronta per mostrarli. Invece di creare un sito, un Headless CMS rende i contenuti disponibili attraverso delle API, così da potervi collegare un sito, un app o qualsiasi altra cosa. Questa caratteristica li rende particolarmente adatti ad essere utilizzati in collaborazione con framework javascript quali React e Vue, oltre che a generatori di siti statici, come Gatsby.
Perché mi dovrebbe interessare?
Utilizzare un sistema come questo significa che, se i bisogni lato backend della nostra app sono principalmente autenticazione/gestione di dati, potremmo risparmiarci il lavoro di scrivere a mano il nostro backend.
La gestione dell’autenticazione di utenti tramite questi servizi è molto semplice e ben documentata. I dati vengono distribuiti tramite API REST e GraphQL. In pratica, possiamo concentrarci unicamente sul frontend della nostra app e utilizzare questi CMS per gestire i contenuti tramite server.
Come li utilizzo?
Prima di tutto è necessario scegliere l’Headless CMS che vogliamo utilizzare. Ce ne sono parecchi online, sia gratuiti che a pagamento. Io personalmente ho utilizzato Strapi e Directus. Ho trovato entrambi molto efficienti e facili da usare. Sono software open source e possono essere installati sul proprio server senza grandi difficoltà.
A questo punto è fondamentale iniziare guardando la documentazione, che vi aiuterà a installare il software e vi spiegherà come usarlo. Potrebbero esserci delle sdk a disposizione, ma in genere è sufficiente effettuare una richiesta ad uno specifico endpoint (URL) per poter visualizzare i dati.
Potrebbe essere facile quanto scrivere questo codice:
async function getPosts() {
return await fetch("https://backend.mysite.it/api/posts");
}Come potete vedere, con pochissimo codice javascript è possibile ottenere i dati necessari. Ovviamente ci sono molte considerazioni che vorremo fare, ma le guide a disposizione ci saranno di grande aiuto.
Spero che questa introduzione agli Headless CMS vi sia stata utile, e che magari vi permetta di risparmiare un po’ di tempo in futuro! 👋🏼