🧩🌐Diagramma dei Componenti e di Deployment
Diagrammi UML per descrivere gli aspetti Logici e Fisici di un Sistema SW; esempio con la navigazione Web comn Browser e Web Server.
Diagrammi UML per descrivere gli aspetti Logici e Fisici di un Sistema SW; esempio con la navigazione Web comn Browser e Web Server.
Quando navighiamo su Internet (ad esempio aprendo una pagina web), succedono due cose contemporaneamente:
A livello software (Logico): Un programma chiede informazioni e un altro programma risponde inviando file.
A livello hardware (Fisico): Il nostro computer o smartphone invia dati attraverso Internet a un computer vero e proprio (Server) situato da qualche parte nel mondo.
Per descrivere questo funzionamento, l'UML ci offre due tipi di diagrammi:
Diagramma dei Componenti (Vista Logica): Mostra i programmi coinvolti.
Diagramma di Deployment (Vista Fisica): Mostra i computer e i file reali.
Il Diagramma dei Componenti risponde alla domanda: "Quali software stanno lavorando e come comunicano?"
Nel nostro caso semplice abbiamo due soli software:
Il Browser Web (Client): Il programma che usiamo per navigare (es. Chrome, Firefox).
Il Web Server (Server): Il programma in ascolto sul computer remoto (es. Nginx, Apache) che ha il compito di restituire i file della pagina web.
Il Browser chiede al Web Server di inviargli le pagine tramite il protocollo HTTP usando il comando GET (es. "Dammi la pagina principale!").
navigazione sul Web descritta con il Diagramma UML dei Componenti
Il Diagramma di Deployment (o di Dispiegamento) risponde alla domanda: "Su quali computer fisici girano questi software e quali file reali si scambiano?"
Qui introduciamo tre concetti chiave:
Nodo (Hardware): Il computer fisico (il tuo PC o il Server remoto).
Ambiente di Esecuzione: Il programma attivo sul PC (il Browser o il Web Server).
Artefatto (File): I file veri e propri memorizzati sul disco (es. index.html, style.css).
Per capire come i file passano dal Server al Browser, usiamo un dominio di pubblico dominio creato appositamente per i test: example.com.
Apri il tuo browser e digita l'indirizzo: [http://example.com]
Premendo Invio, il tuo browser (Client) invia una richiesta HTTP GET al Web Server di example.com.
Il Web Server risponde inviando l'artefatto file index.html.
Ora fai Tasto Destro in un punto vuoto della pagina e seleziona "Visualizza sorgente pagina" (oppure premi CTRL + U su Windows / CMD + Option + U su Mac).
Accadrà questo (non così ben formattato, ma tutto unito senza andare a capo):
Il Browser prende quel codice sorgente grezzo (l'artefatto index.html) inviato via HTTP dal Server e lo "disegna" a schermo per l'utente.