Documentazione

Esame di stato 2014 - 2015
Opere Sonore
Francesco Bruschetti
INDICE
Pagina 2: Abstract.
Pagine 2-3: Introduzione.
Pagine 4-5: Descrizione Software e tecnologie utilizzate.
Pagine 5: Tratti significativi di codice.
Pagina 6: Struttura del database e conclusioni personali.
Pagina 7: Bibliografia e sitografia.
FRANCESCO BRUSCHETTI
1
ABSTRACT
Il mio progetto consiste nella creazione di un sito web, per un’azienda trentina, attraverso il quale è
possibile creare e gestire dei QR-CODE, che verranno stampati su riviste, giornali, trasporti per
permettere ai clienti di accedere facilmente al sito dell’azienda .
Il QR-CODE è un codice a barre bidimensionale creato dinamicamente in base ad una stringa.
Nel mio caso la stringa è un URL , ovvero l’indirizzo di una pagina web.
Utilizzando un qualsiasi smartphone, attraverso apposite applicazioni scaricabili dai rispettivi store,
è possibile “fotografare” il QR-CODE, estrarne l’indirizzo associato e collegarsi al sito web dove
sono pubblicizzati gli eventi e le mostre dell’azienda.
INTRODUZIONE
Obbiettivi e scelte strumentali:
L’obbiettivo principale di questo progetto è la realizzazione di un software, sviluppato in autonomia,
al fine di affinare le tecniche di gestione dei tempi, delle scadenze, e soprattutto della risoluzione
dei problemi.
Per la creazione del sito ho utilizzato diversi software e tecnologie in quanto, ogni tecnologia ha
permesso la creazione mirata delle parti che hanno componsto il progetto.
Il software più significativo che ho utilizzato è stato UniServer, un’applicazione portatile, che
permette l’interpretazione del linguaggio PHP e dell’attivazione del demone utilizzato per attivare
un server locale di MySql, utilizzato per la creazione del database.
Discipline coinvolte:
E’ difficile distinguere i vari argomenti in quanto, oggi giorno, informatica, sistemi e reti, e
tecnologie, sono materie interconnesse. Si può però affermare che, gli argomenti relativi all’
informatica, sono stati utilizzati per la creazione del modello logico e fisico del database e per lo
sviluppo di pagine HTML con l’aggiunta di tratti di codice scritte in linguaggio PHP.
Sistemi e reti: riguardano la struttura di base delle pagine e il codice che permette l’utilizzo delle
funzioni, richiamate tramite degli eventi generati, per esempio, dal click di un bottone da parte
dell’utente e, per la creazione dello stile.
Tecnologie, per gestire le animazioni, e per le richieste AJAX fatte alle pagine PHP. Questa
tecnologia è particolarmente utile perché permette di richiamare delle funzioni di call-back che
attivano delle richieste asincrone ad altre pagine. Questo offre l’opportunità di ricevere dei dati
FRANCESCO BRUSCHETTI
2
aggiornati e di visualizzarli, all’interno delle pagine, senza dover aggiornarle completamente ogni
volta, ma rinfrescando solo la sezione desiderata, migliorando l’esperienza d’utilizzo.
Argomenti coinvolti:
Molte delle tecnologie e dei linguaggi utilizzati, per lo sviluppo del progetto, sono stati trattati
durante gli anni del triennio, ma per riuscire a raggiungere l’obbiettivo e completare il sito, è stato
necessario ampliarli studiando, in dettaglio, alcune delle loro caratteristiche. Gli argomenti coinvolti
possono essere raggruppati in base alle funzioni, che svolgono nel programma, a partire da HTML
e Javascript utilizzati per la creazione della struttura delle pagine e il codice, che gestisce gli eventi
generati dall’utente. CSS e Bootstrap per lo stile. Ajax per le chiamate alle pagine in PHP, che
interrogano il database e restituiscono i dati aggiornati, che vengono poi iniettati nel codice. jQuery
per le animazione presenti nelle pagine e per la generazione dei QR-CODE. Infine, Dojo Toolkit,
un framework javascript che permette di inserire dei grafici all’interno delle pagine HTML.
Difficoltà incontrate e modalità di superamento:
Gli argomenti approfonditi, hanno portato ad alcuni problemi che ho dovuto analizzare e risolvere.
I più significativi sono stati la creazione dei QR-CODE, in quanto, essendo un argomento, che non
avevo mai trattato, non sapevo come approcciarmi. Ho cercato, quindi, su internet, un codice che
permettesse la sua generazione.
Un altro problema è stato l’utilizzo di PHP per il collegamento delle pagine HTML al database,
poiché non era ancora stato trattato in classe. Per imparare il suo funzionamento, ho iniziato, a
leggere il libro di informatica e provando a sviluppare delle pagine partendo dagli esempi forniti dal
testo. Questo mi ha permesso, iniziando dalle basi, di apprendere i costrutti necessari per lo
sviluppo di pagine PHP.
Funzionalità:
Le funzionalità principale del software sono, la possibilità di creare dinamicamente dei QR-CODE,
in base a dei parametri, inseriti dall’amministratore, nelle apposite caselle di testo, e la gestione dei
dati inseriti.
Delle matrici, è possibile modificare o eliminare i dati in caso di errori o in caso il QR-CODE non
sia più utilizzato.
E’ disponibile una funzione che permette di scaricare, localmente, i singoli QR-CODE, al fine di
poterli inviare alle aziende, che li stamperanno sulle loro riviste, giornali o sui trasporti,
permettendo così agli utenti, di utilizzarli per accedere alla sezione del sito a loro dedicata.
FRANCESCO BRUSCHETTI
3
E’ inoltre disponibile, nella pagine principale dell’amministratore, un istogramma, che mostra il
numero di tutte le persone, che hanno utilizzato i singoli QR-CODE oppure che si sono collegati in
un determinato periodo dell’anno.
DESCRIZIONE SOFTWARE
Come software è stato utilizzato Notepad++, un editor di testo che permette la stesura del codice
relativo alle pagine web, Heidi, un client in grado di collegarsi ai database sviluppati in MySql, per
la creazione del modello fisico del database e Uniserver per l’attivazione del demone necessario
all’attivazione del server MySql utilizzato in locale e per l’interpretazione del codice PHP.
Le tecnologie utilizzati sono HTML per la creazione della struttura delle pagine, javascript per la
realizzazione delle pagine in modo dinamico e le funzione di gestione degli eventi, css, bootstrap e
jQuery per lo stile e le animazione, MySql per la costruzione del database per la memorizzazione
dei dati e PHP per interrogare la base di dati, dalle pagine web.
Sono inoltre state fatte delle richieste AJAX per collegare il codice HTML e PHP, con lo scopo di
aggiornare singole parti delle pagine rendendo più piacevole l’utilizzo del sito.
Come funzionano i QR-CODE
I codici QR-CODE possono contenere sia indirizzi internet, che testi, numeri di telefono, o dettagli
di un contatto telefonico.
Sono leggibili da qualsiasi smartphone munito di un apposito programma di lettura che può essere
scaricato dai rispettivi store.
Fasi dell’utilizzo di un QR-CODE
1. Aprire l’applicazione, sullo smartphone, che permetta la lettura dei QR-CODE
2. Inquadrare il QR-CODE affinché l’applicazione riesca a “catturarlo”
3. Decodifica della matrice
4. Visualizzazione del contenuto del QR-CODE che, in caso di un url, collega l’utente ad una
pagina web
Spiegazione del funzionamento di collegamento al sito
I clienti, tramite delle applicazioni dedicate per la decodifica dei QR-CODE, potranno catturare le
matrici che saranno stampati sui giornali, sulle riviste o sui trasporti pubblici. Una volta estratto l’url
associato alle matrici, i clienti accederanno ad una pagina di autenticazione che, automaticamente,
FRANCESCO BRUSCHETTI
4
leggerà i dati presenti nell’url, controllerà se nel database esiste un QR-CODE con quei parametri
e, se i dati sono corretti, salverà l’IP del cliente nel database e la data di lettura, utilizzata per
calcolare le statistiche in un determinato periodo.
Dopo l’inserimento dei dati, il cliente verrà istantaneamente reindirizzato alla pagina a lui dedicata
in cui potrà avere delle informazioni relative alle mostre.
In caso in cui i dati presenti nel QR-CODE non siano corretti, verrà mostrato un messaggio di
errore.
Cattura del
QR-CODE
Decodifica
del codice
Dati corretti
Collegamento,
tramite browser,
alla pagina di
autenticazione
Dati NON
corretti
Salvataggio
dell’IP del cliente
e della data di
accesso
Reindirizzamento
alla pagina
dedicata ai clienti
Visualizzazione
di un messaggio
di errore
TRATTI SIGNIFICATIVI DI CODICE
Un tratto significativo del codice, è quello relativo alla generazione del QR-CODE, in quanto, grazie
all’implementazione con la tecnologia jQuery, permette una semplice e veloce creazione della
matrice bidimensionale.
FRANCESCO BRUSCHETTI
5
#QR-CODE identifica il punto nella pagina in cui viene inserito il QR-CODE generato
$("#QR-CODE").QR-CODE({
text:
ottengo il testo contenente l’ url con il quale genero la matrice
$("#URL").text(),
imposto le dimensioni del QR-CODE
width: 180, larghezza della matrice impostata a 180 pixel
height: 180 altezza della matrice impostata a 180 pixel
});
Modello logico del database:
QR-CODE
UTENTE
Data Lettura
ID_Utente
IP
(1,N)
ID_QRCODE
(1,N)
legge_qrcode
Indirizzo
Password
Dettagli
Tipo
Amministratore
Username
Password
FRANCESCO BRUSCHETTI
6
CONCLUSIONE
Grazie a questo progetto ho avuto modo di imparare nuovi argomenti e gestire il tempo a mia
disposizione per rispettare le date di scadenza.
Nonostante abbia raggiunto gli obbiettivi che mi ero prefissato, riuscendo a sviluppare un software
funzionante, molte sono le cose che potrebbero essere modificate o aggiunte e, questo fatto è
dovuto al mondo dell’informatica, che è un vasto campo in continua evoluzione e questo offre la
possibilità di sviluppare applicazioni innovative.
BIBLIOGRAFIA E SITOGRAFIA
-
Progettare i database - SQL e PHP (Libro di testo, Edizione 2014-2015)
-
w3schools: (http://www.w3schools.com/ )
-
bootstrap documentation: (http://getbootstrap.com/components/ )
-
dojo toolkit documentation: (http://dojotoolkit.org/documentation/ )
-
stackoverflow: (http://stackoverflow.com/ )
FRANCESCO BRUSCHETTI
7