https://a.storyblok.com/f/162428/1280x1262/96ce32308e/group-4-2.png

Tutto quello che devi sapere sull’architettura Jamstack

Paolo Fabbri

7 Dic 2022
it news

Sai cos’è un’API (Application Programming Interface) e a cosa serve? Per parlarti di Jamstack dobbiamo prima chiarire questo aspetto.

Per qualche minuto lascia da parte ogni impegno e immergiti nella lettura!

API: cosa sono e a cosa servono

Le API sono il modo in cui un’applicazione chiede e recupera da un’altra una serie di dati. Come avviene questo processo? Un’applicazione manda una richiesta API (HTTP Get, ovvero un semplice messaggio HTTP) e le API rispondono con un JSON contenente l’informazione che abbiamo chiesto e per cui abbiamo interrogato l’API in questione.

Nello schema si indicano tutti i tipi di messaggi HTTP che si possono inviare alle API, ognuno con la propria funzione, eventualmente specificando anche l’acronimo CRUD:

Vediamo insieme le diverse tipologie di messaggi HTTP e la loro funzione:

  • POST è indicato per creare qualcosa nell’applicazione

  • GET serve per leggere qualcosa nell’applicazione

  • PUT ha lo scopo di aggiungere qualcosa nell’applicazione, nel senso che sostituisce l’informazione stessa

  • PATCH ha la stessa funzione di PUT ma, nell’aggiungere qualcosa all’applicazione, modifica l’informazione esistente

  • DELETE cancella qualcosa nell’applicazione 

La risposta a questa domanda avviene tramite un JSON o un formato XML.

Per capire cosa sono, come funzionano e a cosa servono le API, spesso si utilizza l’esempio di un’App per il meteo: chiunque può realizzare un’App per il meteo, ma senza i dati sui valori di temperatura, piovosità e venti è completamente inutile.

Quindi, come recuperare tutti i dati esistenti sul meteo? È praticamente impossibile. Se non esistessero delle API realizzate da qualcuno e messe a disposizione di chiunque desideri interrogarle con la propria App, recuperare i dati del meteo in tempo reale non sarebbe fattibile.

Dopo che la nostra App va a prendere le informazioni del meteo (che le abbiamo richiesto) inviando una GET alle API messe a disposizione per essere interrogate, tornerà indietro l’informazione richiesta e la nostra App ce la mostrerà nello stile e nella grafica che abbiamo pensato per lei.

Ora che ti è più chiaro cos’è un’API, possiamo parlare di Jamstack.

Caratteristiche di un’architettura Jamstack

Per raccontarti tutto quello che devi sapere su Jamstack, partiamo dalle due parole che compongono questo curioso termine. “Jam” sta per JavaScript (un linguaggio di programmazione utilizzato specialmente nelle applicazioni Web), APIs e Markup (un codice HTML e CSS che impartisce istruzioni di formattazione ai browser).

Il termine “stack” si riferisce invece alla combinazione dei tre elementi appena citati, una combo che è in grado di garantire agli sviluppatori software la creazione di applicazioni oppure siti Web.

La caratteristica di questi ultimi o di un’applicazione Jamstack è l’essere costruita utilizzando solo questi tre elementi. Il sito Web o l’applicazione Web visualizzati dall’utente vengono realizzati mediante codice di markup HTML e CSS. In tutto questo, JavaScript è utilizzato per tutte le funzionalità dinamiche necessarie a chiamare le API, che vanno a fornire il backend dell’applicazione.

Perché il backend in Jamstack è snello e leggero?

Perché gli sviluppatori che usano Jamstack per le loro applicazioni non devono costruire una rete di backend sotto il frontend; al contrario, possono basarsi su API già esistenti per far funzionare i loro siti Web o le loro applicazioni. Quando uno sviluppatore desidera creare nuove funzionalità, implementare quelle esistenti oppure modificarle, non deve perdere ore per scrivere tutto il codice nel backend, ma limitarsi a creare una nuova API che vada a fornire il dato ed, eventualmente, implementarla in un secondo momento anche per applicazioni future.

La differenza tra l’approccio tradizionale in backend e un’architettura Jamstack

Per capire come funziona un’applicazione o un sito Web generato con un’architettura Jamstack pensa al settore finanziario e alle migliaia di continue fluttuazioni di quotazione che caratterizzano il mercato azionario europeo.

 

Tra un’applicazione fatta in modo tradizionale e una con un’architettura Jamstack c’è una grande differenza. Segui questo esempio: immagina che Antonello sviluppi un’applicazione Web in modo tradizionale (ovvero con una grossa struttura in backend) capace di gestire, controllare e fornire continui aggiornamenti sulle fluttuazioni della quotazione dei titoli azionari dei mercati europei. In questo caso, Antonello crea una struttura in backend che viene eseguita su un server. Così, quando l’utente apre l’applicazione per controllare le fluttuazioni, il server di Antonello genera pagine HTML che visualizzano i dati azionari e le invia all’utente. Purtroppo, però, l’applicazione di Antonello risulta molto lenta perché, prima che l’utente visualizzi queste pagine, deve necessariamente attendere l’esecuzione dell’applicazione backend, la generazione delle pagine HTML e che l’HTML raggiunga il suo dispositivo.

 Questo è l’approccio tradizionale e abbiamo realizzato anche questo schema riepilogativo:

Ora pensa alla stessa applicazione, ma costruita usando l’approccio Jamstack. In questo secondo caso Antonello non deve costruire l’applicazione partendo dal backend, ma creare una serie di pagine HTML, che sono leggere, semplici e veloci da realizzare. Successivamente le archivia in una rete CDN (Content Delivery o Distribution Network), ovvero una rete di computer distribuita geograficamente e ottimizzata per migliorare le prestazioni, che permetta di servire le risorse agli utenti del Web. Quando uno di questi ultimi apre l’applicazione, la rete CDN gli fornisce immediatamente le pagine HTML richieste.

Questo processo è più rapido rispetto al server tradizionale di Antonello, dato che la rete CDN è molto più vicina, per definizione. L’applicazione intanto effettua anche una chiamata API (mediante una GET) per chiedere e leggere le variazioni dei listini del mercato azionario europeo direttamente sulla pagina HTML.

Ecco che l’applicazione si carica e lavora molto più velocemente e Antonello, per l’aggiornamento continuo dei listini azionari, non ha bisogno di scrivere il codice che gestisca il lavoro del backend nel server.

Questo è l’approccio Jamstack, dove lo sviluppatore crea soltanto delle pagine HTML e lavora sulle API esistenti o, al massimo, le implementa.

Ecco uno schema anche di questo secondo metodo:

I tre vantaggi di un’architettura Jamstack

Ora che sai la differenza tra un’applicazione fatta in modo tradizionale e una con un’architettura Jamstack, riassumiamo i vantaggi che puoi ottenere con la seconda strategia:

  1. Performance – La quasi totalità del contenuto in un’applicazione Jamstack è creata da files HTML statici, serviti mediante un CDN, e questa è sicuramente la maniera più rapida di rendere disponibile all’utente un contenuto Web.

  2. Scalabilità – Quando hai un’applicazione “scalabile” hai un prodotto in grado di rispondere correttamente e perfettamente anche in caso di picchi di utilizzo, il tutto grazie al frontend veloce e al backend snello.

  3. Coinvolgimento – Un’applicazione Jamstack permette una più coinvolgente esperienza di sviluppo, poiché gli sviluppatori possono concentrarsi sulla creazione dell’interfaccia frontend, senza preoccuparsi troppo del backend o dei problemi di prestazione.

 


Potrebbe interessarti...
Da oggi GPT-3 per te non avrà più segreti
Il lavoro quotidiano del team DotEnv
Da dove nasce questo nome e perché lo abbiamo scelto per la nostra azienda