Frontend e backend: No Code edition

Frontend e backend sono due termini molto comuni a chi lavora nel mondo digitale. Si tratta infatti delle due “parti” di un sito web che ci permettono di navigare all’interno di tutti i siti presenti su internet. Per chi non lavora nel mondo dello sviluppo, però, potrebbe essere difficile capire a cosa ci riferiamo con questi due termini.

Server e client

Prima di iniziare a parlare di frontend e backend è importante capire come funziona internet e che cosa sono il server e il client. Quindi partiamo dal “dietro le quinte” del web con un esempio: immagina due persone. La prima, Alice, ha bisogno di un’informazione specifica che solo la seconda persona, Bob, conosce. Tuttavia, Alice e Bob abitano molto lontano e quindi Alice, per chiedere a Bob l’informazione di cui ha bisogno, deve chiamarlo per telefono. Quando Bob risponde, Alice gli chiede l’informazione di cui ha bisogno. Bob gliela fornisce e Alice, che ora è contenta, lo saluta e termina la chiamata.

Questo può sembrare un esempio semplicistico ma Internet funziona in modo molto simile. In questo caso, se Alice e Bob fossero due computer, Alice sarebbe il client mentre Bob sarebbe il server.

Quando vogliamo visitare un sito web, quindi, dobbiamo contattare il server che lo ospita nella sua memoria (e che può trovarsi ovunque nel mondo). E per farlo digitiamo un URL all’interno della barra di ricerca e premiamo invio. In questo modo, il server riceve la nostra richiesta e ci risponde. A quel punto il sito si carica e noi lo possiamo visitare.

Cos’è il frontend?

Ora che abbiamo descritto brevemente come funziona internet e cosa succede quando effettuiamo una ricerca, possiamo passare a descrivere cosa sono il frontend e il backend.

La parte visibile del sito, ovvero le pagine in cui possiamo navigare, si chiama frontend. In generale, nello sviluppo software, il frontend (o “lato client”) è tutto ciò che un utente può vedere e con cui può interagire. Parliamo quindi dell’interfaccia grafica e di tutti gli elementi che la compongono come bottoni, icone, testi e immagini.

Cos’è il backend?

Il backend (o “lato server”), invece, è tutto ciò che sta dietro un sito web e non è visibile agli utenti finali. Questo sistema è formato da diversi elementi:

1. Il server;
2. Il database;
3. La logica;
4. I workflow;
5. Le API;
6. Le integrazioni.

1. Il server

Il primo elemento fondamentale del backend di un sito web è il server che lo ospita nella sua memoria. Il server deve essere sempre raggiungibile dal client attraverso un indirizzo URL come, ad esempio, www.ncode.it e puoi immaginarlo come un computer sempre acceso da qualche parte nel mondo.

Se non esistessero server capaci di ospitare i siti web e di rispondere ai tantissimi utenti che li vogliono visitare, nessun sito sarebbe accessibile su internet.

2. Il database

Il database è lo spazio dove vengono memorizzati tutti i dati che servono a un sito web dinamico.

Per fare un esempio, ogni post che pubblichiamo su Instagram, ogni like e ogni storia, per quanto possa sembrarci un’attività molto sociale, sono tutti modi particolarmente piacevoli di interagire con dei dati che si trovano all’interno di un database.

3. La logica

Quando parliamo di logica, in ambito digitale, solitamente ci riferiamo a tutti quei processi interni di un’applicazione web che sono necessari per farla funzionare correttamente.

Prendiamo come esempio di nuovo Instagram. Per accedere a questo social network è necessario registrarsi e fare il login. E una volta eseguito l’accesso, è possibile pubblicare foto, seguire gli altri iscritti, fare delle ricerche e tanto altro. Tutte queste sono funzioni che sono possibili solo grazie a processi sviluppati nel backend!

4. I workflow

In generale, quando parliamo di workflow intendiamo un flusso di lavoro automatizzato. Questo flusso di lavoro può essere interno a un’applicazione oppure coinvolgerne più di una grazie all’utilizzo delle API (Application Programming Interface).

Un workflow è formato da un evento scatenante che quando si verifica (o, come si usa dire, viene triggerato), avvia una o più azioni. Questi possono essere creati facilmente utilizzando degli strumenti appositi, come ad esempio gli strumenti No Code Zapier con i cosiddetti “zaps”  e Make (Integromat) con i suoi “scenari”.

5. Le API

Le API (Application Programming Interface) sono un modo per consentire lo scambio di informazioni tra due applicazioni diverse o tra il frontend e il backend di una stessa applicazione.

Per semplicità, prendiamo come riferimento solamente lo scambio di informazioni tra due applicazioni. Attraverso le API di un’applicazione si può dare la possibilità ad un’altra app di accedere ai suoi dati e, in alcuni casi, anche di eseguire delle operazioni di aggiunta, aggiornamento o cancellazione dei dati.

Per esempio, Not Just Analytics è una piattaforma che utilizza le API di Instagram per accedere ai dati dei profili (previo consenso da parte del proprietario) e mostrare informazioni utili all’utente.

6. Le integrazioni

Un’applicazione che fornisce un’integrazione permette ai suoi utenti di interagire con un servizio esterno senza dover usare codice o strumenti di automazione come Zapier. Questo perché il collegamento è gestito all’interno dell’applicazione stessa che fornisce l’integrazione.

Conclusione