Il link del progetto in working progress
http://umbriawayformazione.altervista.org/ci_project_glocal/

Riassunto delle puntate precedenti
All’ indirizzo https://umbriawayinfo.wordpress.com/2021/03/08/territorio-storia-cultura-conoscere-le-risorse-che-hai-sotto-casa-con-glocal-web-app-come-mettere-in-moto-un-progetto-con-codeigniter-quarta-puntata/ è stata completata una gallery statica che ha poco senso di esistere quindi occorre farla diventare qualcosa di dinamico

Costruire il DB: pianificazione delle table

Stiamo per entrare nel vivo di codeigniter con il MODEL che fino a questo momento era un attore fuori dall’ inquadratura. Vogliamo in primis semplificarci la vita con le molte pagine sperimentate nella gallery statica perché con una gallery dinamica è sufficiente una sola pagina per gestire decine e decine di foto, inoltre vogliamo potenziare i criteri di ricerca filtrando queste foto per ogni tipo di selezione. Abbiamo pensato di inserire CATEGORIE e TAGS e abbiamo pensato anche di evitare la ridondanza dei dati spaccando la tabella in due tabelle una delle quali conterrà un campo intero condiviso relativo alla categoria che in questo modo rimarrà un dato univoco all’ interno della tabella principale. Quindi serviranno delle INNER JOIN al momento di mettere in piedi le QUERY nel MODEL. Abbiamo anche pensato a un prefisso per le nostre tabelle che non può che essere legato alle iniziali di progetto seguito magari da un carattere speciale tipo l’underscore. Può sembrare strano ma lavorare staticamente su http://umbriawayformazione.altervista.org/ci_project_glocal/index.php/ColleGalleryStatic/collephotos ci ha dato la possibilità di inquadrare meglio tutte queste pseudo problematiche, ci ha consentito di vedere in anticipo come lavorerà di fatto tutto il meccanismo finale! A questo punto non ci resta che immaginare i campi che saranno ID, IMG, CAT, TAGS, NOME, DESCRIZIONE, CONTENT o NOTE non in questo ordine e ALTRI a supporto. Inoltre bisogna anche immaginare un meccanismo dove in futuro voglio vedere le foto a pieno schermo staccandole dalle dimensioni di 700×400 pixel. E come se non bastasse vogliamo anche ampliare a cento le foto per arricchire con nuove categorie poi le selezioni. Insomma a grandi linee quello che va messo in piedi è quello che si legge qui, anche perchè la questione della scheda tecnica della foto e dell’ ingrandimento della stessa potrebbe essere risolta in un secondo momento, la questione principale sembra essere quindi la griglia di contenimento come prossimo passo e questo vuol dire poi riempire con tutti i dati le tabelle con conseguente dispendio temporale. Il lavoro non manca quindi ed è facile ipotizzare che a fine giornata tutta la questione del DB che è il cuore pulsante dell’ applicazione relativamente per la sezione ColleGallery sarà definitivamente archiviata come cosa fatta!

Iniziamo dalla tabella CATEGORIA

Avendo un DB in rete è possibile andare a creare le nostre tabelle. Come ipotizzato a noi serve oltre alla tabella principale una tabella CATEGORIA che spezza i dati descrittivi per farli diventare numerici e unici, in modo da non ripetere i dati sulla table primaria. Sarà poi cura della QUERY INNER JOIN di andare a pescare i dati nel posto giusto! Iniziamo quindi a creare la nostra tabella collegallerycat che funzionerà da ponte. Più categorie mettiamo in piedi per scansionare la notra località e più opzioni ci ritroviamo dopo per gestire comodamente la nostra applicazione, abbiamo quindi inserito le seguenti categorie legandole a un numero intero che coincide con l’ID della tabella e che andrà inserito poi nella table primaria:

bianconero
vintage
landscape
castello
chiesa
chiesetta
pietredellamemoria
monumenti
lapidi
fontane
merlana
terremoto
collesud
collenord
collecentro
location

Certo fa particolare impressione bianconero all’ inizio viste le mie inclinazioni granata ma lasciamo perdere, qui ci serve solo per caratterizzare alcune foto dal fascino antico (volendo)

La tabella primaria

Poi creo la tabella primaria “collegallery” scegliendo tra ID (tipo di dati INT con chiave primaria autoincrementale), IMG (varchar 100), CAT (INT), TAGS (varchar 100), titolo (varchar 100), DESCRIZIONE (varchar 500), CONTENT o NOTE che sarà di tipo testo in quanto ci saranno molti contenuti da sciorinare, volendo poi in seguito metterò altri campi tipo IMGBIG se deciderò di ampliare la mia WEBAPP ma all’ inizio non devo centellinare tutti i dettagli posso anche abbozzare un contenitore generico e modificarlo in seguito

Un occhiata al foglio stile per le rifiniture

Le nostre immagini hanno bisogno di una cornice da stilizzare con i CSS, qui di seguito abbiamo dato un occhiata al moltissimo materiale presente in rete con varie opzioni per definire le linee di contorno:

/* border-style classi di esempio */
.1 {border-style:none;}
.2 {border-style:hidden;}
.3 {border-style:dotted;}
.4 {border-style:dashed;}
.5 {border-style:solid;}
.6 {border-style:double;}
.7 {border-style:groove;}
.8 {border-style:ridge;}
.9 {border-style:inset;}
.10 {border-style:outset;}

Conclusioni:

Il lavoro non è stato particolarmente esaltante o gratificante in quanto per poter funzionare le applicazioni hanno bisogno di contenuti e modellare il DB non avviene con un semplice schiocco delle dita. Mettere in moto un insieme di tabelle che si preoccupano di visualizzare i dati è uno sporco lavoro ma qualcuno deve pur farlo, non è certamente divertente ma è un attività che vive nel nucleo di una web app che non potrebbe stare in piedi senza dati a supporto da estrapolare. Ovviamente fatto il DB non abbiamo ottenuto nulla in termini di visualizzazione su http://umbriawayformazione.altervista.org/ci_project_glocal/index.php tutto è rimasto esattamente come nella quarta puntata https://umbriawayinfo.wordpress.com/2021/03/08/territorio-storia-cultura-conoscere-le-risorse-che-hai-sotto-casa-con-glocal-web-app-come-mettere-in-moto-un-progetto-con-codeigniter-quarta-puntata/

Rispondi

Inserisci i tuoi dati qui sotto o clicca su un'icona per effettuare l'accesso:

Logo di WordPress.com

Stai commentando usando il tuo account WordPress.com. Chiudi sessione /  Modifica )

Google photo

Stai commentando usando il tuo account Google. Chiudi sessione /  Modifica )

Foto Twitter

Stai commentando usando il tuo account Twitter. Chiudi sessione /  Modifica )

Foto di Facebook

Stai commentando usando il tuo account Facebook. Chiudi sessione /  Modifica )

Connessione a %s...