Back-end e front-end

Prima di iniziare a spiegarti il framework Flask e come creare una Web App è necessario illustrarti dei concetti fondamentali per il tuo apprendimento e partiamo con il concetto di back-end e front-end.

Il back-end può sembrare un concetto non facile da capire, qualcosa di legato agli hacker, di oscuro, ma come puoi immaginare non è niente di tutto questo e diventa tutto più chiaro quando lo paragoni al front-end.

Per semplificare, il front-end è la parte di una pagina web con cui un visitatore può interagire e vedere.

Il front-end è composto da JavaScript, CSS, HTML e altre risorse statiche, come immagini o video. Gli asset statici sono file che non cambiano. Quando navighi verso una pagina web, questi asset vengono inviati al suo browser.

Visitare un semplice sito web è come ordinare una pizza: effettuiamo l'ordine per il nostro pasto e, una volta che ci viene consegnato, abbiamo la nostra pizza. In questa analogia, possiamo pensare al front-end come a tutto ciò che è stato consegnato con la consegna: la pizza, le posate, etc.

Probabilmente hai sentito parlare di sviluppo del front-end come sviluppo lato client. Potresti pensare il client è il visitatore umano o all'utente di un sito web, ma quando ci riferiamo al client nello sviluppo web, di solito ci riferiamo al richiedente non umano di contenuti. Nel caso in cui si visiti un sito web, il client è il browser.

Mentre il front-end è la parte del sito web che viene fatta vedere dal browser, il back-end è costituito da tutti i processi e i dati che fanno funzionare un sito web e che inviano le risorse ai client.

Server Web

Abbiamo parlato di come il front-end sia costituito dalle informazioni inviate ad un client in modo che un utente possa vedere e interagire con un sito web, ma da dove provengono le informazioni? La risposta è un server web.

Un server web è un processo in esecuzione su un computer che ascolta le richieste di informazioni in arrivo via internet e invia le risposte. Ogni volta che un utente naviga verso un sito web sul suo browser, il browser fa una richiesta al server web di quel sito. Ogni sito web ha almeno un server web.

Il formato specifico di una richiesta (e la risposta che ne risulta) è chiamato protocollo. Guardando nel tuo browser, l'indirizzo di questo sito web, puoi notare la dicitura HTTP, ecco il protocollo utilizzato per accedere ai siti web è HTTP.

HTTP è l'acronimo di Hypertext Transfer Protocol e viene utilizzato per strutturare le richieste e le risposte su Internet.

Il trasferimento delle risorse avviene tramite TCP (Transmission Control Protocol). Nella visualizzazione di questa pagina web, TCP gestisce i canali tra il browser e il server (in questo caso, tuttofaredigitale.it). Il TCP è utilizzato per gestire molti tipi di connessioni internet in cui un computer o un dispositivo vuole inviare qualcosa a un altro. L'HTTP è il linguaggio che i dispositivi su entrambi i lati della connessione devono seguire per comunicare.

Quando un visitatore naviga verso un sito web sul suo browser, in modo simile a come si fa un ordine per il take-away, fa una richiesta HTTP per le risorse che compongono quel sito.

Per i siti web più semplici, un cliente effettua una sola richiesta. Il server web riceve tale richiesta e invia al cliente una risposta contenente tutto il necessario per visualizzare il sito web. Questo si chiama sito web statico. Ciò non significa che il sito web non sia interattivo. Come per le singole risorse statiche, un sito web è statico perché una volta ricevuti i file, questi non cambiano. Un sito web statico potrebbe essere una buona scelta per un semplice sito web personale.

Un utente che naviga su Facebook, vuole accedere a nuovi contenuti così come sono stati creati, che un sito web statico non potrebbe fornire. Per raggiungere questo livello di complessità, è necessario un back-end altrettanto complesso.

Dove immagazzinare i dati?

Le moderne applicazioni web raccolgono molti dati. Affinché questi dati siano utili, devono essere organizzati e memorizzati da qualche parte.

I back-end delle applicazioni web includono un database, spesso più di uno. I database sono un insieme di informazioni.

Ci sono molti database diversi, ma possiamo dividerli in due tipi: database relazionali e database non relazionali (noti anche come database NoSQL).

Mentre i database relazionali memorizzano le informazioni in tabelle con colonne e righe, i database non relazionali possono utilizzare altri sistemi come coppie di valori chiave o un modello di memorizzazione dei documenti.

SQL, Structured Query Language, è un linguaggio di programmazione per accedere e modificare i dati memorizzati nei database relazionali. Il database relazionale più diffuso è MySQL, mentre il database NoSQL più conosciuto al momento è MongoDB.

Cos'è un'API?

I compiti maggiori del back-end sono la lettura, l'aggiornamento o la cancellazione delle informazioni memorizzate in un database.

Per avere modi coerenti di interagire con i dati, un back-end spesso include un'API.

API è l'acronimo di Application Program Interface e può significare molte cose, ma una web API è un insieme di modi o regole predefinite per interagire con i dati di un'applicazione web, spesso attraverso un ciclo di richiesta-risposta HTTP.

A differenza delle richieste HTTP che un client fa quando un utente naviga verso l'URL di un sito web, questo tipo di richiesta indica come vorrebbe interagire con i dati di un'applicazione web (creare, leggere, aggiornare dati o cancellarli).

Ripercorriamo l'esempio di un acquisto online, immaginiamo come potrebbe essere utilizzata l'API web dell'applicazione. Quando un utente preme il pulsante per inviare un ordine, farà scattare una richiesta per inviarlo ad una pagina di conferma dell'ordine, ma un'ulteriore richiesta verrà attivata dal front-end, non vista dall'utente, all'API web in modo che il database possa essere aggiornato con le informazioni dell'ordine.

Alcune web API sono aperte al pubblico. Instagram, ad esempio, dispone di un'API che altri sviluppatori possono utilizzare per accedere ad alcuni dei dati memorizzati da Instagram.

Autorizzazione e autenticazione

Altri due concetti che il tuo lavoro lato server potrebbe gestire sono l'autenticazione e l'autorizzazione.

L'autenticazione è il processo di convalida dell'identità di un utente. Una tecnica per l'autenticazione è quella di utilizzare i login con nomi utente e password. Queste credenziali devono essere memorizzate in modo sicuro nel back-end di un database e controllate ad ogni visita.

Le applicazioni web possono anche utilizzare risorse esterne per l'autenticazione. È probabile che tu abbia effettuato l'accesso a un sito web o a un'applicazione utilizzando le tue credenziali di Facebook o Google anche questo è un processo di autenticazione.

L'autorizzazione controlla quali utenti hanno accesso a quali risorse e azioni. Alcuni campi dell'applicazione, come la pagina per modificare il profilo personale di un social media, sono accessibili solo a quell'utente.