giovedì, gennaio 29, 2015

Mongodb su mongolab

Vogliamo aggiornare la nostra splendida applicazione su https://whispering-peak-1284.herokuapp.com/, inserendo una persistenza vera dei dati.

Vi ricordo che i nostri libri sono memorizzati in un array in memoria all'avvio dell'applicazione, eventuali nuovi libri inseriti rimangono solo fino al prossimo riavvio.

La nostra applicazione su heroku deve poter comunicare con un server di base dati, vogliamo ovviamente scegliere mongodb; heroku fornisce come addson (modulo aggiuntivo) la possibilità di far interagire una applicazione ivi installata con una istanza di mongodb ospitata da un'altra società che offre servizi di memorizzazione dati su mongodb, questa società si chiama mongolab.

Purtroppo per poter utilizzare direttamente mongolab da heroku, bisognerebbe fornire la carta di credito anche si decidesse, come noi, di utilizzare una istanza limitata gratuita per scopi di testing e sviluppo.

Pazienza faremo a manina.

Createvi direttamente un account su mongolab, effetuate l'accesso e pigiate sul bottone create new, come mostrato in figura, per creare una nuova base dati.


Nella schermata successiva, selezionate le seguenti opzioni
  • Location: Amazon's EU (Ireland) Region (eu-west-1)
  • Plan: Single-node, Sandbox
  • Database name: bibliotecadb
Premete il bottone create new MongoDB deployment per creare una base dati mongodb dal nome bibliotecadb.


Nella schermata successiva, premete sul link bibliotecadb


Nella prossima schermata troveremo le informazioni di connessione che utilizzeremo sia da robomongo per gestire la nostra base dati sia dall'applicazione residente su heroku.

Nel mio caso l'indirizzo di connessione è ds037601.mongolab.com:37601/bibliotecadb nel vostro caso sarà ovviamente diverso: prendetene nota.

Ora non ci rimane che creare un'utenza di accesso alla base dati appena creata, ce lo dice anche mongolab con questo messaggio terrorizzante A database user is required to connect to this database.  Click here to create e new one : premete sul link click here e inserite le seguenti informazioni nella maschera successiva
  • Database username: biblioteca
  • Database password: biblioteca
  • Confirm password: biblioteca

Premete il bottone create e la nostra base dati è pronta a ricevere istruzione dall'esterno.

Ora eseguite robomongo e create una nuova connessione inserendo i dati di connettività, il nome della base dati e l'utenza definiti precedentemente.




Sostituite il campo address con l'indirizzo assegnato alla vostra base dati.
Il campo name è solo un nome logico che robomango utilizza per memorizzare i dati di una particolare connessione.

Selezionate poi il pannello Authentication e inserite i seguenti dati, coerentemente a quanto fatto in precedenza


Pigiate il bottone Test per verificare la correttezza dei dati di connettività, se non avete fatto errori dovreste ottenere la schermata seguente


Salvate i dati di connessione e siamo ora pronti a connetterci alla nostra base dati su mongolab


Una volta connessi, creiamo una nuova collezione libri: tasto destro su Collections



Tasto destro su Collections/libri ...


Selezioniamo Insert Document e inseriamo le proprietà del nuovo libro da salvare


Ripetiamo il passo precedente per inserire un altro paio di libri e per eseguire una db.libri.find(): tasto destro su Collections/libri e selezioniamo View Documents.

Dovreste ottenere una schermata con la lista dei libri che avete inserito.


Abbiamo dunque creato una base dati utlilizzando mongodb su mongolab, non resta che modificare la nostra applicazione per leggere e scrivere i dati da essa.

Alla prox.
Ivan

martedì, gennaio 27, 2015

MongoDB: operazioni CRUD e Robomongo

MongoDB memorizza i dati nella forma di documenti che non sono altro che coppie di chiavi/valore alla stregua del formato json.
 {  
   nome : 'ivan',                            chiave: valore  
   età: '43',                                chiave: valore  
   linguaggi: ['java', 'javascript']         chiave: valore  
 }  
Tutti i documenti sono memorizzati in collezioni. 

Una collezione è un gruppo di documenti correlati che hanno un insieme di indici condivisi.
Spesso una collezione di mongodb viene considerata alla stregua di una tabella di una base dati relazionale: mi sembra una forzatura visto che i documenti presenti in una collezione non devono avere la stessa struttura.

In mongodb, le interrogazioni (query) vengono effettuate su delle collezioni; possono specificare dei criteri per filtrare i risultati e possono includere una proiezione per ottenere solo determinate coppie chiavi/valore dei documenti ricercati; si possono opzionalmente impostare limiti e criteri di ordinamenti.
Ecco un esempio di query che cerca nella collezione dipendenti quelli che sono maggiorenni e i risultati sono ordinati per cognome in maniera crescente.
   Collezione     Criterio     Ordinamento  
 db.dipendenti.find({età: {$gt: 18}}).sort({cognome: 1})  
In questo esempio, cerchiamo i primi 5 utenti, in ordine alfabetico per nome, che abbiano meno di 50 anni: di questi utenti ci interessa solo il nome e l'indirizzo: la query ritorna comunque la proprietà _id per ogni documento.
 Collezione            Criterio            Proiezione      Ordinamento  Limite  
 db.utenti.find({età: {$lt: 50}}, {nome: 1, indirizzo :1}).sort({nome:1}).limit(5)  
Il metodo find torna sempre un cursore; se eseguito in una shell mongo e il risultato del metodo non viene assegnato ad una variabile, la shell itera i primi 20 risultati mostrandoli a video: un uso programmatico del cursore sarebbe il seguente, tenendo conto che nella shell mongo viene utilizzato un linguaggio di scripting quasi identico a javascript
 var cursore = db.libri.find()  
   
 while(cursore.hasNext()) {  
    printjson(cursore.next())  
 }  
 
 //oppure  
   
 cursore.forEach(printjson)  
Molto intuitivamente: finchè ci sono elementi nel cursore, viene stampanto il prossimo elemento puntato dal cursore stesso, la stampa avviene in formato json.

Per aggiornare un documento esistente, la sintassi è la seguente
 db.libri.update(  
    {  
       titolo: 'la guerra'         
    },  
    {  
       $set {  
          autore: 'Ancora non lo so'  
       }  
    }  
 )  
Con questa istruzione aggiorniamo la proprietà autore del documento la cui proprietà titolo vale 'la guerra'; il metodo update aggiorna solo un documento alla volta, se vogliamo aggiornare più documenti dobbiamo aggiungere l'opzione {multi : true} come terzo parametro.

Per eliminare un documento, la sintassi è la seguente
 Rimuove il libro dal titolo 'la guerra' dalla collezione libri:
   
 db.libri.remove({titolo: 'la guerra'})  
   
 Svuota la collezione libri: 
   
 db.libri.remove({})  
Se volete utilizzare un client mongo più amichevole rispetto alla linea di comando, vi consiglio di scaricare e installare l'applicazione gratuita robomongo .

All'avvio dell'applicazione, create una nuova connessione verso localhost come mostrato in figura


Connettetevi con il tasto connect e avrete la possibilità di eseguire le query in una shell che fornisce anche funzionalità di autocompletamento sintassi.

Il programma è molto intuitivo, non farete fatica ad utilizzarlo come si deve.



Bene, nel prossimo post, saremo pronti a mettere la nostra base dati online per essere accessibile dal mondo intero :)

Alla prox.
Ivan

lunedì, gennaio 26, 2015

MongoDB un motore di basi dati senza schema!

Prima domanda da porsi: cosa è mongodb?

Mongodb è un dbms (database management system) orientato ai documenti, dove per documenti si intendono informazioni strutturate in formato json.

Mongodb è una base dati nosql: non esiste il concetto di schema (regole sulla struttura dei dati) e dunque non esiste il concetto di tabella, si ha la massima libertà nel memorizzare i propri dati senza vincoli di struttura e, men che meno, di integrità referenziale

In mongodb non esistono le tabelle, ma esistono le collezioni: contenitori di documenti che non impongono vincoli sulla struttura dei dati in essi contenuti.

Installiamo ora mongodb sulla nostra macchina: procuriamoci il pacchetto d'installazione opportuno all'indirizzo https://www.mongodb.org/downloads ed eseguiamolo, scegliendo le impostazioni standard.

Mongodb, se non diversamente specificato durante il suo avvio, si aspetta di memorizzare i dati nella cartella /data/db; se siete utenti di windows create la cartella c:/data/db con una shell eseguita con i diritti di amministratore (tasto WIN + r  e poi  CTRL + SHIFT  + ENTER).

Il programma d'installazione dovrebbe aggiornare la variabile di ambiente PATH, aggiungendo un percorso del tipo C:\Program Files\MongoDB 2.6 Standard\bin; in modo da poter eseguire il server ed il client da qualsiasi percorso in cui vi troviate.

Siamo pronti ad avviare il server: aprite una finestra dos tasto WIN + r  e poi  CTRL + SHIFT  + ENTER) e digitate mongod: il server partirà, di default, sulla porta 27017 e rimarrà in attesa di richiesta di connessioni.


Se volessimo utilizzare un altro percorso dove memorizzare i dati e/o un'altra porta, dovremmo, ad esempio, digitare il comando mongod --dbpath "d:\test\mongo db data" --port 28000

Apriamo adesso un'altra shell dos (tasto WIN + r  e poi  CTRL + SHIFT  + ENTER) ed eseguiamo il programma client tramite il comando mongo: il client proverà a connettersi, di default, ad un server presente su localhost e su porta 27017.


In figura possiamo notare a sinistra, la shell che ci permetterà di eseguire comandi da mandare al server; a destra notiamo il server che ha accettato una connessione.

Per spegnere il server basterà digitate CTRL + c dalla rispettiva shell.

Di default, il client si connette ad una base di dati chiamata test, per cambiare base dati di riferimento di utlizza il comando use nomedb: se la base dati nomedb non esiste, verrà creata successivamente quando salveremo in essa un nuovo documento in una nuova collezione.

Creiamo ora una base dati per la memorizzazione dei libri della nostra biblioteca.
  1. Creiamo la base dati con use biblioteca
  2. Memorizziamo il primo libro, nella collezione libri, con l'istruzione
    db.libri.insert({titolo: 'La guerra', codiceisbn: 'AEDRFFF', autore: 'Boh!'})
  3. Memorizziamo un ulteriore libro con
    db.libri.insert({titolo: 'Pace', codiceisbn: 'ZEDRR', autore: 'Riboh!'})
Il server creerà la base dati biblioteca e la collezioni libri contenente i due documenti (libri), rappresentati in formato json.
  • Per vedere la lista delle basi di dati gestite dal nostro server, digitatiamo show dbs.
  • Per sapere qual è la base dati corrente, digitiamo db
  • Per cambiare base dati corrente, digitiamo use nomebasedati
  • Per vedere la lista delle collezione della base dati corrente, digitiamo show collections
  • Per visualizzare i documenti della collezione libri, digitiamo db.libri.find()
Tutti i documenti inseriti in mongodb, devono avere una proprietà _id univoca: se non la si specifica in fase di inserimento, mongodb genererà automoticamente tale proprietà garantendone l'univocità.

Per concludere vediamo un esempio di estrazione: vogliamo tutte le informazioni relative al libro che ha codiceisbn = 'ZEDRR':

  • db.libri.find({codiceisbn:'ZEDRR'})
Nel prossimo post, cercheremo di creare una base dati raggiungibile dalla nostra applicazione installata su heroku: spero sia ovvio che non potremo utlilizzare la nostra macchina per ospitare la base dati :).

Alla prox.
Ivan

giovedì, gennaio 22, 2015

Biblioteca per node.js: conferma registrazione via posta elettronica

Come anticipato nel post precedente, vogliamo aggiungere alla nostra applicazione la funzionalità di conferma registrazione.

Il caso d'uso della funcionalità da aggiungere è il seguente
  • L'utente inserisce i dati per la registrazione
  • Il sistema memorizzerà le informazioni dell'utente e invierà un messaggio di posta elettronica per confermare la registrazione appena effettuata
  • Solo dopo aver confermato la registrazione, l'utente potrà effettuare l'accesso.
Ecco come vengono modificati i vari moduli.

Nel file delle rotte routes/utenti.js
 router.route('/conferma/:username')  
   .get(function(request,response){  
       serviziUtenze.confermaRegistrazione(request.params.username);  
       response.render('login', {registrazioneOk: 'Ora puoi effettuare il login'});  
    });  
aggiungiamo una rotta per gestire la conferma della registrazione: nei serviziUtente implementeremo un metodo ad hoc.

Nel file dei serviziUtenze modifichiamo i metodi di login, registrazione e aggiungiamo il nuovo metodo confermaRegistrazione
 var login = function(username,password) {  
           var utentiLoggati = utentiRegistrati.filter(function(utente) {  
                return utente.username === username &&   
                    utente.password === password &&  
                    utente.confermato === true;  
           });  
           return utentiLoggati[0];  
      };  
Il metodo login aggiunge il controllo sul nuovo campo booleano confermato, che viene inizializzato a false in fase di registrazione e posto a true con la funzionalità di conferma.
 var registra = function(utente) {  
      var href = 'http://whispering-peak-1284.herokuapp.com/utente/conferma/' + 
           utente.username;  
           utentiRegistrati.push(utente);  
           postino.sendMail({  
             from: 'passionejavascript@gmail.com',  
             to: utente.email,  
             subject: 'conferma registrazione',  
             html: 'Confermi la registrazione alla biblioteca con un click: ' +  
                   '<a href="' + href +   
                   '">Confermo!</a>'  
           }, function(err, info) {  
                  if (err)  
                    console.log(err);  
                  if (info)  
                    console.log(info);   
                });  
           console.log(utentiRegistrati);  
      };  
Nel metodo registra, viene inviato un messaggio di posta elettronica all'utente che si sta registrando, costruendo, nel corpp del messaggio in formato html, un opportuno indirizzo per attivare la funzionalità di conferma.
 var confermaRegistrazione = function(username) {  
      var utenteDaConfermare = utentiRegistrati.filter(function(utente) {  
           return utente.username === username;  
      });  
   
      if (utenteDaConfermare)  
           utenteDaConfermare[0].confermato = true;  
      };  
   
      return {  
           login : login,  
           registra : registra,  
           confermaRegistrazione: confermaRegistrazione  
      };
      ...
Nella conferma, cerchiamo l'utente nella collezione degli utenti registrati e modifichiamo a true la proprietà confermato.

Provate a testare la funzionalità all'indirizzo https://whispering-peak-1284.herokuapp.com/: registratevi con un indirizzo di posta valido, controllate la posta, attivate la conferma dal messaggio di posta e poi effettuate l'accesso.

Ho aggiornato su github il progetto installato su heroku, in modo che possiate avere tutto il codice a disposizione, in questo post è spiegato come utilizzare github.

Dopo aver fatto il pull del progetto, ricordatevi di eseguire npm install nella cartella di progetto per installare la dipendenza aggiuntiva nodemailer: se volete eseguire il programma in locale digitate node app.js e puntate il browser all'indirizzo http://localhost:5000.

Alla prox
Ivan

mercoledì, gennaio 21, 2015

Invio posta elettronica con node.js

In questo post vedremo come inviare un messaggio di posta elettronica con node.js.

L'idea è di aggiungere alla nostra applicazione, una funzionalità di conferma iscrizione: quando un utente nuovo si registra, il sistema invierà un messaggio di posta elettronica con un link per confermare la registrazione.

Prima di modificare l'applicazione web, diamo un'occhiata al codice per inviare un messaggio di posta elettronica.

Per poterlo fare, dobbiamo appoggiarci ad un fornitore di servizio di posta elettronica, non possiamo che appoggiarci a gmail: sarà dunque necessario aprire un account di posta elettronica con gmail per inviare la posta elettonica tramite le credenziali dell'utenza creata.

Se non avete un account di gmail, potete crearlo al volo qui, dovete poi solo ricordarvi l'indirizzo di posta scelto e la password.

Ci avvaleremo del modulo nodemailer , che ci semplificherà notevolmente il lavoro da svolgere.

Ho preparato un frammento di programma per  mostrarvi nodemailer all'opera
 var servizioPosta = require('nodemailer');  
   
 var postino = servizioPosta.createTransport({  
   service: 'gmail',  
   auth: {  
     user: 'VOSTRO_NOME_UTENTE@gmail.com',  
     pass: 'VOSTRA_PASSWORD'   
   }  
 });  
   
 postino.sendMail({  
   from: 'sender@address',  
   to: 'ivan.saracino@cspnet.it',  
   subject: 'hello',  
   text: 'hello world from node.js!'  
 }, function(err, info) {  
   if (err)  
     console.log(err);  
   if (info)  
     console.log(info);   
 });  
Importiamo il modulo nodemailer che espone il metodo createTransport a cui devono essere passati dei parametri di configurazione, tra cui il nome utente e la password del vostro account di posta.

A quel punto il postino può consegnare la mail con il metodo asincrono sendMail con gli ovvi parametri.

Il parametro from verrà impostato dal gmail all'indirizzo con cui usate il servizio di invio mail, non vi venga in mente di fare degli scherzi pensando di forzare un altro indirizzo diverso dal vero mittente ;)

Spulciate la documentazione ufficiale di nodemailer nel caso abbiate bisogno di funzionalità più avanzate come l'invio di allegati o corpo del messaggio in formato html.

Per poter usare il servizio di gmail da un programma, con il vostro account, dovete configurare gmail abilitando le opzioni meno sicure a questo indirizzo.

Bene, come abbiamo visto, il codice è abbastanza banale.

Come usarlo nella nostra applicazione rispettandone l'architettura?

Provate a rifletterci su .. fino al prossimo post :)

Alla prox.
Ivan






martedì, gennaio 20, 2015

Biblioteca: funzionalità di ricerca

Anche questa funzionalità s'implementa abbastanza in fretta all'interno dell'architettura proposta.

Si aggiunge una rotta opportuna nel file routes/libri.js
 router.route('/cerca')  
      .get(function(request, response) {  
           response.render('cercalibro');  
      })  
      .post(validatoreRicercaLibro, function(request, response) {  
           if (!request.form.isValid) {  
                messages = request.form.errors;  
                response.render('cercalibro', {messages: messages});  
           }  
           else {  
                var libri = serviziLibri.cercaLibri(request.body.chiave);  
                response.render('listalibri', {libri : libri});  
           }  
      });  
Il che significa che la richiesta GET a /libri/cerca fa visualizzare la pagina cercalibro,jade contentente il form di ricerca, mentre una richiesta POST allo stesso indirizzo scatena l'invocazione del servizio di ricerca e fa visualizzare la pagina listalibri,jade valorizzando opportunamente l'oggetto {libri: libri} utilizzato nel template jade.

La pagina cercalibro.jade contiene il form di ricerca
 extends ./layout.jade  
   
 block titolo  
  title Cerca Libro  
   
 block testata  
  h1.text-info Cerca Libro  
   
 block contenuti-principali  
  form(method='post', action='cerca')  
   div.form-group  
    label(for='chiave') Chiave ricerca  
    input(type='text', class='form-control' name='chiave', placeholder='chiave')  
   button(type='submit' class='btn btn-default') Cerca  
Il modulo servizi/serviziLibri esporrà il nuovo metodo per restituire i libri contenenti la chiave di ricerca nel proprio titolo
     ...  
   
 var cercaLibri = function(chiave) {  
    return libri.filter(function(libro) {  
       return (libro.titolo.toLowerCase().search(chiave.toLowerCase()) != -1);  
    });  
 };  
 return {  
    listaLibri : listaLibri,  
    elimina: elimina,  
    salvaLibro: salvaLibro,  
    cercaLibri: cercaLibri  
 };  
La funzionalità è implementata usando il metodo filter degli array e il metodi toLowerCase e search delle stringhe.

All'indirizzo https://whispering-peak-1284.herokuapp.com/ è presente l'applicativo aggiornato.

Con questo post, abbiamo completato l'implementazione di tutte le funzionalità: non resta che concentrarci sullo strato di persistenza su base dati.

Ho aggiornato su github il progetto installato su heroku, in modo che possiate avere tutto il codice a disposizione, in questo post è spiegato come utilizzare github.

Dopo aver fatto il pull del progetto, ricordatevi di eseguire npm install (se non lo avete mai fatto) nella cartella di progetto per installare le dipendenze aggiuntive: se volete eseguire il programma in locale digitate node app.js e puntate il browser all'indirizzo http://localhost:5000.

Alla prox
Ivan

lunedì, gennaio 19, 2015

Biblioteca per node.js: una soluzione per le funzionalità di amministrazione

Vediamo come sono state implementate le funzionalità di eliminazione ed inserimento di un nuovo libro.

Nella generazione della lista dei libri, solo per un utente amministratore, viene visualizzata una icona per l'eliminazione del libro: la vista listilibri.jade contiene il seguente codice
 block contenuti-principali  
      if (libri.length > 0)  
           table(class='table table-striped table-bordered')  
                thead  
                tr  
                     th Codice  
                     th Titolo  
                     th Autore  
                     if (session.utente.profilo === 'admin')  
                          th Elimina  
                each libro in libri  
                     tr  
                          td #{libro.codiceisbn}  
                          td #{libro.titolo}  
                          td #{libro.autore}  
                          if (session.utente.profilo === 'admin')  
                               td  
                                    a(href='/libri/elimina/#{libro.codiceisbn}')  
                                         img(src='/imgs/delete.png')  
      else  
           div.conmarginesuperiore  
                ul  
                     li.text-info Non ci sono libri in Biblioteca  
Notate l'espressione condizionale per l'aggiunta di una ulteriore intestazione e colonna all'interno della tabella.

Il link per l'eliminazione racchiude l'informazione del codice isbn del libro da eliminare, nel caso del signore degli anelli, ad esempio, verrà generato questo link /libri/elimina/DRF00223Z: l'ultima parte dell'indirizzo rappresenta un parametro di richiesta che potremo estrarre facilmente nel codice di gestione della richiesta.

Al file libri.js abbiamo aggiunto il codice seguente
 router.route('/elimina/:codiceisbn')  
      .get(function(request,response){  
           serviziLibri.elimina(request.params.codiceisbn);  
           response.redirect('/libri');  
      }); 
l'ultima parte dell'indirizzo della richiesta, viene automaticamente estratto e memorizzato come un parametro in request.params.codiceisbn, dopo aver effettuato l'eliminazione viene eseguita una nuova richiesta all'indirizzo /libri che riscatenerà la creazione della lista dei libri aggiornata.

Abbiamo aggiunto la funzionalità di eliminazione all'interno del file dei servizi per i libri
 ....  
 var elimina = function(codiceisbn) {  
           libri = libri.filter(function(libro) {  
                return libro.codiceisbn != codiceisbn;  
           });  
      };  
   
 ....  
 return {  
           listaLibri : listaLibri,  
           elimina: elimina,  
           salvaLibro: salvaLibro  
      };  
 ...  
La funzionalità di creazione nuovo libro è identica a quella di registrazione.
Partiamo del form definito in nuovolibro.jade
 block testata  
      h1.text-info Nuovo Libro  
   
 block contenuti-principali  
  form(method='post', action='nuovo')  
   div.form-group  
     label(for='codiceisbn') Codice Isbn  
     input(type='text', class='form-control' name='codiceisbn', placeholder='Isbn')  
   div.form-group  
     label(for='titolo') Titolo  
     input(type='text', class='form-control' name='titolo', placeholder='Titolo')  
   div.form-group  
     label(for='autore') Autore  
     input(type='text', class='form-control' name='autore', placeholder='Autore')  
   button(type='submit' class='btn btn-default') Salva!  
Al submit del form viene effettuata la richiesta di tipo POST all'indirizzo /libri/nuovo, richiesta gestita in questo modo
 ...  
 var validatoreNuovoLibro = form(  
           field('codiceisbn').trim().required('', 'Inserire il codice isbn!'),  
           field('titolo').trim().required('','Inserire Il titolo!'),  
           field('autore').trim().required('','Inserire autore!')  
      );   
 ...  
 router.route('/nuovo')  
      .get(function(request,response) {  
           response.render('nuovolibro');  
      })  
      .post(validatoreNuovoLibro,function(request,response) {  
           var messages;  
           var libro = {};  
           if (!request.form.isValid) {  
                messages = request.form.errors;  
           }  
           else {  
                libro.codiceisbn = request.body.codiceisbn;  
                libro.titolo = request.body.titolo;  
                libro.autore = request.body.autore;  
                serviziLibri.salvaLibro(libro);  
                messages = ['Libro memorizzato con successo'];  
           }  
           response.render('nuovolibro', {messages: messages});  
      });  
I parametri sono memorizzati nel corpo della richiesta http in request.body e sono validati da validatoreNuovoLibro

Abbiamo aggiunto una nuova funzionalità al file serviziLibri.js
 ...  
 var salvaLibro = function(libro) {  
           libri.push(libro);  
      };  
   
      return {  
           listaLibri : listaLibri,  
           elimina: elimina,  
           salvaLibro: salvaLibro  
      };  
 ...  

Risultato finale: https://whispering-peak-1284.herokuapp.com/

Ho aggiornato su github il progetto installato su heroku, in modo che possiate avere tutto il codice a disposizione, in questo post è spiegato come utilizzare github.

Dopo aver fatto il pull del progetto, ricordatevi di eseguire npm install (se non lo avete mai fatto) nella cartella di progetto per installare le dipendenze aggiuntive: se volete eseguire il programma in locale digitate node app.js e puntate il browser all'indirizzo http://localhost:5000.

Alla prox
Ivan

venerdì, gennaio 16, 2015

Biblioteca per node.js: le funzionalità di amministrazione

In questo post implementeremo le funzionalità di eliminazione e inserimento di un libro nella nostra biblioteca.

Se andate al solito indirizzo https://whispering-peak-1284.herokuapp.com/ ed entrate con l'utente admin ivan con password saracino, troverete le funzionalità già implementate.

Quando visualizzerete la lista dei libri, noterete una immagine cliccabile di un cestino a fianco di ogni libro che implementa l'operazione di eliminazione del libro.

Provate a testare tali funzionalità e ad implementarle seguendo l'architettura proposta.

Nel prossimo post troverete la soluzione e l'intera implementazione :)

Buon Lavoro.
Alla prox.
Ivan



mercoledì, gennaio 14, 2015

Biblioteca: visualizziamo la lista dei libri

Ora che l'architettura della nostra applicazione è ben delineata, risulta molto semplice aggiungere le funzionalità rimanenti decise in fase di analisi

Con l'approccio modulare visto fino ad ora, basta aggiungere due ulteriori moduli per
  • la gestione delle rotte (richieste) relative alle gestione dei libri (lista, ricerca,rimozione ...) in routes/libri.js
  • implementazione logica di business relativa alla gestione dei libri in servizi/serviziLibri.js
Il nostro diagramma degli oggetti si modifica in questo modo


Il menu dinamico in funzione del profilo dell'utente che ha effettuato o meno l'accesso, lo modifichiamo in questo modo
 if (!session.utente)  
      ul(class='nav nav-pils')  
           li(role='presentation')  
                a(href='/utente/login') Login  
           li(role='presentation')  
                a(href='/utente/registrazione') Registrati!  
 else  
      ul(class='nav nav-pils')  
           li(role='presentation')  
                a(href='/utente/logout') Logout  
                li(role='presentation')  
                     a(href='/libri') Lista Libri  
                li(role='presentation')  
                     a(href='/libri/cerca') Cerca Libro  
           if (session.utente.profilo === 'admin')  
                li(role='presentation')  
                     a(href='/libri/nuovo') Nuovo Libro  
Nel caso di utente che accede con il profilo semplice, attiviamo nel menu le rotte (link di richiesta)
  • /libri per visualizzare la lista dei libri
  • /libri/cerca per visualizzare un form di ricerca libro
Nel caso di utente che accede con il profilo admin, viene attivata anche la rotta
  • /libri/nuovo per visualizzare un form di inserimento di un nuovo libro
Il modulo app viene modificanto con l'aggiunta di un nuovo router legato all'indirizzo /libri
 var libri = require('./routes/libri');  
 ...  
 app.use('/libri', libri);  
Il modulo libri fornisce, per ora, la gestione della rotta radice
 var express = require('express');  
 var router = express.Router();  
 var serviziLibri = require('../servizi/serviziLibri');  
   
 router.route('/')  
      .get(function(request,response) {  
           var libri = serviziLibri.listaLibri();  
           response.render('listalibri', {libri : libri});  
      });  
   
 module.exports = router;  
e quindi la lista dei libri sarà visualizzata a seguito della richiesta all'indirizzo /libri utilizzando la nuova vista presente in /views/listalibri.jade
 extends ./layout.jade  
   
 block titolo  
      title Lista Libri  
   
 block testata  
      h1.text-info Lista Libri!  
   
 block contenuti-principali  
      if (libri)  
           table(class='table table-striped table-bordered')  
                thead  
                tr  
                     th Codice  
                     th Titolo  
                     th Autore  
                each libro in libri  
                     tr  
                          td #{libro.codiceisbn}  
                          td #{libro.titolo}  
                          td #{libro.autore}  
Il modulo serviziLibri sarà così implementato, sempre utilizzando la tecnica delle funzioni definite ed eseguite immediatamente
 module.exports = (function(){  
      var libri = [  
           {  
                titolo : 'Il signore degli anelli',  
                codiceisbn: 'DRF00223Z',  
                autore: 'John Ronald Reuel Tolkjen'   
           },  
           {  
                titolo : 'Guerra e pace',  
                codiceisbn: 'FTGR44E3',  
                autore: 'Lev Tolstoj'   
           },  
           {  
                titolo : 'Javascript the good parts',  
                codiceisbn: 'ZZ3423DR665',  
                autore: 'Douglas Crockford'   
           }  
      ];  
   
      var listaLibri = function() {  
           return libri;  
      };  
   
      return {  
           listaLibri : listaLibri  
      };  
 })();  
Come si può osservare, continuiamo ancora ad utilizzare una base dati in memoria, tra qualche post sostituiremo il codice presente il questo modulo con quello relativo alla interazione con una base dati.

Nel prossimo post, vedremo come implementare la ricerca, ma ormai dovrebbe essere chiaro, spero, come sia strutturato il codice.

Su https://whispering-peak-1284.herokuapp.com/  potete testare le funzionalità appena implementate.

Come al solito, ho aggiornato su github il progetto installato su heroku, in modo che possiate avere sempre tutto il codice a disposizione, in questo post è spiegato come utilizzare github.

Dopo aver fatto il pull del progetto, ricordatevi di eseguire, se non lo avete mai fatto, npm install nella cartella di progetto;

Se volete eseguire il programma in locale digitate node app.js e puntate il browser all'indirizzo http://localhost:5000.

Alla prox
Ivan

martedì, gennaio 13, 2015

Biblioteca: validiamo i dati inseriti dall'utente

Una applicazione seria non puo' prescindere dalla rognosa validazione dei dati che arrivano al server.

Personalmente, oltre ad una validazione lato client che in effetti può evitare una richiesta inutile al server, preferisco sempre validare anche lato server per questioni di sicurezza.

Se vi ricordate il post sui middleware, la funzionalità di validazione dei dati di un form potremmo implementarla attraverso dei middleware attivati per le rotte (richieste) opportune.

A noi non piace reinventare la ruota, volete che non ci sia un modulo per node.js bello e pronto per la validazione dei dati di un form? Che magari ci permetta di validare in maniera semplice anche campi per indirizzi email o campi numerici?

Ovviamente tale modulo esiste, in realtà ne esiste più di uno, oggi vediamo express-form che ho scelto per la sua semplicità di utilizzo.

Installato nel progetto il modulo express-form, il codice per validare ad esempio il form di login è il seguente presente nel file delle rotte utenti.js, evidenzio solo la parte del codice coinvolta per il login
 var form = require('express-form');  
 var field = form.field;  
   
 var validatoreLogin = form(  
           field('username').trim().required('', 'Inserire il nome utente!'),  
           field('password').trim().required('','Inserire la password!')  
      );  
   
 router.route('/login')  
   .post(validatoreLogin, function(request,response){  
           var utente = undefined;  
           if (!request.form.isValid) {  
               response.render('login', {errors: request.form.errors});  
           }  
           else {  
                utente = serviziBiblioteca.login(  
                     request.body.username,  
                     request.body.password  
                );  
                if (utente) {  
                     request.session.utente = utente;       
                     response.render('home');  
                }  
                else {  
                     response.render(  
                          'login',   
                          { loginFallito : 'Utente non abilitato'}  
                     );  
                }       
           }  
    });  
Il modulo express-form ci fornisce una funzione form che ritorna un middlewar da associare alle richieste che vogliamo validare.

La funzione form, accetta come parametri delle funzioni field per validare i campi del form.

Se spulciate sulla documentazione ufficiale di express-form, troverete degli esempi di validazione per tutti i gusti: in questo caso abbiamo usato il validatore di tipo required che rende il form invalido se il campo in questione non è stato inserito dall'utente.

Una volta definito il middleware, costituito in questo caso dalla funzione validatoreLogin, basta passarlo come primo parametro alla funzione post associata alla richiesta di login.

Il middleware aggiunge all'oggetto request una proprietà form che possiamo testare con l'istruzione
if (!request.form.isValid) e renderizzare la pagina di login passando l'array delle stringhe d'errore presenti in request.form.errors.

Nelle pagine di presentazione, dove occorre visualizzare i messaggi di errore di validazione basterà inserire, dove vogliamo, un codice di questo tipo
 if (errors)  
           ul  
                each error in errors  
                     li.text-danger #{error}   
Vediamo ora come costruire il validatore del form di registrazione
 var validatoreRegistrazione = form(  
    field('username').trim().required('', 'Inserire il nome utente!'),  
    field('password').trim().required('','Inserire la password!'),  
    field('email').trim().required('','Inserire la mail').isEmail('mail invalida')  
  );  
e leghiamo il validatore, che è un middleware, alla richiesta post di registrazione
 router.route('/registrazione')  
   .post(validatoreRegistrazione, function(request,response) {  
           var utente = {};  
           if (!request.form.isValid) {  
                response.render('registrazione', {errors: request.form.errors})  
           } else {  
                utente.username = request.body.username;  
                utente.password = request.body.password;  
                utente.email = request.body.email;  
                utente.profilo = 'semplice';  
                serviziBiblioteca.registra(utente);  
                response.render('login', {  
                     registrazioneOk: 'Ora puoi effettuare il login!'});  
           }  
   });  
Per non avere ripetizioni di codice e grazie alla presenza della istruzione condizionale, conviene inserire il codice della visualizzazione messaggi all'interno del file layout.jade
 ...  
 div.col-md-10  
      block contenuti-principali  
      block validazione  
      if (errors)  
         ul  
          each error in errors  
               li.text-danger #{error}  
 ...  
Su https://whispering-peak-1284.herokuapp.com/ potete testare la validazione così implementata.

Come al solito, ho aggiornato su github il progetto installato su heroku, in modo che possiate avere sempre tutto il codice a disposizione, in questo post è spiegato come utilizzare github.

Dopo aver fatto il pull del progetto, ricordatevi di eseguire npm install  per installare la dipendenza aggiuntiva di express-form nella cartella di progetto: se volete eseguire il programma in locale digitate node app.js e puntate il browser all'indirizzo http://localhost:5000.

Alla prox
Ivan

Biblioteca: inseriamo le rotte

Cominciamo ad implementare le funzionalità di login e registrazione nella nostra splendida applicazione :)

Ricordiamo che tutto il codice applicativo risiede nel file app.js, che è così costituito
 var express = require('express');  
 var cookieParser = require('cookie-parser');  
 var expressSession = require('express-session');  
   
 var app = express();   
   
 app.set('port', (process.env.PORT || 5000));  
 app.set('views', __dirname + '/views');  
 app.set('view engine', 'jade');  
 app.use(cookieParser());  
   
 app.use(expressSession({  
      secret: 'stringaqualunque',  
      resave: false,  
      saveUninitialized: true    
 }));  
   
 app.use(function(req,res,next) {  
      res.locals.session = req.session;  
      next();     
 });   
   
 app.use(express.static(__dirname + '/public'));   
   
 app.get('/', function(req,res) {  
      res.render('index');  
 });   
   
 app.listen(app.get('port'), function() {  
      console.log("Node app is running at localhost:" + app.get('port'));  
 });      
Per ogni funzionalità che vogliamo implementare dovremo definire un url con la corrispondente funzione di callback per la gestione della richiesta: il file app.js è destinato a crescere in dimensione, se non strutturiamo adeguatamente il codice.

Quello che vogliamo fare è definire un primo modulo per definire e gestire le richieste di login e registrazione, funzionalità riservate agli utenti del nostro sito, per cui creiamo un file utenti.js in una nuova cartella routes che andrà creata allo stesso livello della cartella public
 var express = require('express');  
 var router = express.Router();  
   
 router.route('/login')  
      .get(function(request,response) {  
           response.render('login');  
      });  
   
 router.route('/registrazione')  
      .get(function(request,response) {  
           response.render('registrazione');  
      });  
   
 module.exports = router;  
In questo file abbiamo esportato un modulo (riguardate questo post per rinfrescarvi la memoria) che ha lo scopo di definire un router (potete tradurlo con vigile urbano :)) per instradare le richieste a get /login e get /registrazione, che renderizzano le rispettive viste login.jade e registrazione.jade.

Nel file app.js basterà aggiungere un codice di questo tipo
 var utenti = require('./routes/utenti');  
 app.use('/utente', utenti);  
per attivare richieste del tipo /utente/login e /utente/registrazione

Il file del menù andrà così modificato per rispechiare le rotte definite precedentemente
 if (!session.utente)  
      ul(class='nav nav-pils')  
           li(role="presentation")  
                a(href="/utente/login") Login  
           li(role="presentation")  
                a(href="/utente/registrazione") Registrati!  
Con questo approccio creeremo un altro modulo per definire, ad esempio, le funzionalità per la gestione dei libri: in tal modo i nostri file saranno piccoli e facilmente manutenibili, invece di avere un unico file che sarebbe destinato a crescere al crescere della complessità della nostra applicazione.

Controllate all'indirizzo https://whispering-peak-1284.herokuapp.com/  come si comporta ora la nostra applicazione.

Per completezza vi mostro il codice delle viste login.jade e registrazione.jade che dovranno essere create nella cartella /views
 extends ./layout.jade  
   
 block titolo  
      title Login  
   
 block testata  
      h1.text-info Login  

 extends ./layout.jade  
   
 block titolo  
      title Registrazione  
   
 block testata  
      h1.text-info Registrazione  
Nei prossimi post vederemo come completare queste viste per prevedere i form di login e registrazione con le relative implementazioni.

Come al solito, ho aggiornato su github il progetto installato su heroku, in modo che possiate avere sempre tutto il codice a disposizione, in questo post è spiegato come utilizzare github.

Dopo aver fatto il pull del progetto, ricordatevi di eseguire npm install (se non lo avete mai fatto) nella cartella di progetto per installare le dipendenze aggiuntive: se volete eseguire il programma in locale digitate node app.js e puntate il browser all'indirizzo http://localhost:5000.

Alla prox
Ivan

lunedì, gennaio 12, 2015

Biblioteca: altro modulo per gestire la logica di business

Oggi implementeremo le funzionalità core di login e registrazione.

Non introdurremo ancora l'interazione con un server di dati per non appesantire l'esposizione, utilizzeremo una struttura dati in memoria per memorizzare le utenze, ma struttureremo il codice in maniera tale da non dover modificare la parte di gestione delle varie richieste presenti nel modulo delle rotte degli utenti: come? Ma utilizzando un altro bel raviolone :).

Prima di mettere il naso nel codice, navigate l'applicazione aggiornata su heroku per capire dove vogliamo andare a parare: https://whispering-peak-1284.herokuapp.com.

Provate a fare il login con username ivan e password saracino, che ha un profilo admin, notate come il menu presenti funzionalità (da implementare) di amministrazione.

Fate il logout per pulire la sessione e entrate nella pagina di registrazione, inserendo una vostra utenza; verrete rediretti alla pagina di login con un opportuno messaggio per effettuare l'autenticazione con le credenziali appena create: rifate il login e notate come cambia il menu e i messaggi di benvenuto presenti nell'header.

Ad ogni riavvio della applicazione, ovviamente tutte le utenze create non ci saranno più, rimarrà valido solo l'utente admin ivan saracino.

Per capire come abbiamo strutturato il codice, date un'occhiata al seguente diagramma di oggetti


Vi ricordo che moduli nel contesto javascript non sono altro che oggetti che espongono particolari proprietà che possono essere anche funzioni.

Il diagramma in alto non dice altro che il modulo app utilizza il modulo delle rotte utenti che a sua volta utilizza il modulo serviziUtenze: grazie a questa separazione di responsabilità tra moduli diversi sarà facile tenere sotto controllo la complessità del nostro progetto.

Il modulo app ha la responsabilità di configurare l'intera applicazione, tramite, ad esempio, l'utilizzo di moduli particolari di express per la gestione delle sessioni o il parsing del corpo delle richieste http: per poter effettuare il post dei form, dovremo includere nel codice del modulo app le seguenti istruzioni
 var bodyParser = require('body-parser');  
 ...  
 app.use(bodyParser.urlencoded({ extended: true }));   
In questo modo sarà possibile estrarre facilmente i parametri mandati in post al server al submit del form.

Il modulo utenti ha la responsabilità di definire le funzioni da eseguire per gestire le varie funzionalità legate agli utenti quali il login e la registrazione.
 var express = require('express');  
 var router = express.Router();  
 var serviziBiblioteca = require('../servizi/serviziUtenze');  
   
 router.route('/login')  
      .get(function(request,response) {  
           response.render('login');  
      })  
      .post(function(request,response){  
           var utente = serviziBiblioteca.login(  
                request.body.username,  
                request.body.password  
           );  
           if (utente) {  
                request.session.utente = utente;       
                response.render('home');  
           }  
           else {  
                response.render(  
                     'login',   
                     { loginFallito : 'Utente non abilitato'}  
                );  
           }  
             
      });  
   
 router.route('/registrazione')  
      .get(function(request,response) {  
           response.render('registrazione');  
      })  
      .post(function(request,response) {  
           var utente = {};  
           utente.username = request.body.username;  
           utente.password = request.body.password;  
           utente.email = request.body.email;  
           utente.profilo = 'semplice';  
           serviziBiblioteca.registra(utente);  
           response.render('login', {  
                registrazioneOk: 'Ora puoi effettuare il login!'});  
      });  
   
 router.route('/logout')  
      .get(function(request,response) {  
           request.session.destroy(function() {  
                response.redirect('/');  
           });  
      });  
   
 module.exports = router;  
Notate dal codice come sia possibile gestire una richiesta sia in get che in post.

Prendiamo ad esempio la richiesta /utente/login e osserviamo come nel caso di una richiesta get venga semplicemente renderizzata la pagina login.jade, mentre nel caso di una richiesta di tipo post venga utilizzato il modulo serviziUtenze per effettuare la vera e propria autenticazione.

Per estrarre i parametri dalla richiesta post, basta usare un codice del tipo request.body.nomeparametro.

Nel modulo serviziUtenze risiede la logica di business vera e propria, in questo caso abbiamo creato un modulo che espone due metodi login e registra che utilizzano un array di oggetti in memoria come base dati delle utenze inizializzato con l'utente admin ivan saracino.
 module.exports = (function(){  
      var utentiRegistrati = [  
           {  
                username : 'ivan',  
                password: 'saracino',  
                email: 'ivan.saracino@gmail.com',  
                profilo: 'admin'   
           }  
      ];  
      var login = function(username,password) {  
           var utentiLoggati = utentiRegistrati.filter(function(utente) {  
                return utente.username === username &&   
                    utente.password === password;  
           });  
           return utentiLoggati[0];  
      };  
      var registra = function(utente) {  
           utentiRegistrati.push(utente);  
           console.log(utentiRegistrati);  
      };  
      return {  
           login : login,  
           registra : registra  
      };  
 })();  
Per organizzare meglio i file, abbiamo previsto la presenza di una cartella servizi in cui memorizzare i file dei moduli della logica di business: non è difficile prevedere la presenza di un ulteriore modulo per la gestione dei libri quando andremo ad implementare tali funzionalità.

Per la generazione del menu dinamico, osserviamo il file menu.jade incluso nel layout
 if (!session.utente)  
      ul(class='nav nav-pils')  
           li(role='presentation')  
                a(href='/utente/login') Login  
           li(role='presentation')  
                a(href='/utente/registrazione') Registrati!  
 else  
      ul(class='nav nav-pils')  
           li(role='presentation')  
                a(href='/utente/logout') Logout  
           if (session.utente.profilo === 'semplice')  
                li(role='presentation')  
                     a(href='#') link semplice 1  
                li(role='presentation')  
                     a(href='#') link semplice 2  
           else  
                li(role='presentation')  
                     a(href='#') link admin 1  
                li(role="presentation")  
                     a(href='#') link admin 2  
Se esiste un utente in sessione, ne verrà controllato il profilo per generare opportunamente i link corretti.

Non abbiamo implementato una validazione dei parametri passati al server, nel prossimo post vedremo come affrontare questo argomento tramite l'utilizzo di un middleware opportuno.

Come al solito, ho aggiornato su github il progetto installato su heroku, in modo che possiate avere sempre tutto il codice a disposizione, in questo post è spiegato come utilizzare github.

Dopo aver fatto il pull del progetto, ricordatevi di eseguire npm install nella cartella di progetto per installare la dipendenza aggiuntiva per il modulo body-parser : se volete eseguire il programma in locale digitate node app.js e puntate il browser all'indirizzo http://localhost:5000.

Alla prox
Ivan

giovedì, gennaio 08, 2015

Diamoci un obiettivo per il nuovo anno: una biblioteca con node.js

Ed eccomi qua, dopo un pò di chili presi durante le vacanze, a riprender l'interrotto cammino.

Ho intenzione di modificare l'applicazione presente su heroku sviluppata fino ad ora, in modo da introdurre via via funzionalità classiche come autenticazione, profilazione e accesso a basi dati.

Svilupperemo una applicazione web per la gestione di una biblioteca online, le cui funzionalità sono descritte dal seguente diagramma dei casi d'uso



Un utente che raggiunge il nostro sito, può effettuare le seguenti operazioni
  • Login: inserire il nome utente e la password per accedere al sito
  • Registrazione: creare una nuova utenza inserendo le seguenti informazioni : 
    • nome utente
    • password
    • indirizzo email
Dopo aver effettuato il login, un utente ospite può assumere il ruolo di utente semplice o di un utente amministratore

Un utente semplice puo' effettuare le seguenti operazioni

  • Lista libri: visualizzare la lista dei libri presenti in biblioteca
  • Ricerca libro: ricercare un libro inserendo una parola chiave di ricerca che potrà essere presente nel titolo del libro

Un utente amministratore può fare tutto ciò che può fare un utente semplice e in più potrà effettuare le seguenti operazioni

  • Elimina libro: eliminare un libro dalla base dati
  • Nuovo libro: inserire un nuovo libro nella base dati, un libro ha le seguenti informazioni
    • codice isbn
    • titolo
    • autore

E' esempio molto semplice ma ci darà modo di affrontare e implementare delle classiche funzionalità presenti in una qualsiasi applicazione web.

Implementeremo l'applicazione in maniera incrementale in modo da affrontare le difficoltà un passo alla volta.

Come prima iterazione, impostiamo il layout del sito  (mantenendo quello attuale ma eliminando unicamente la colonna di destra) e sviluppiamo la pagina iniziale index.jade.

Se in sessione non c'è un utente che ha effettuato il login, il menu dell'applicazione sarà costituito dai due link per effettuare il login o la registrazione.

Ecco come si presenterà l'applicazione alla prima iterazione: https://whispering-peak-1284.herokuapp.com/

Nei prossimi post affronteremo l'implementazione delle due funzionalità.

Ho aggiornato su github il progetto installato su heroku, in modo che possiate avere tutto il codice a disposizione, in questo post è spiegato come utilizzare github.

Dopo aver fatto il pull del progetto, ricordatevi di eseguire npm install (se non lo avete mai fatto) nella cartella di progetto per installare le dipendenze aggiuntive: se volete eseguire il programma in locale digitate node app.js e puntate il browser all'indirizzo http://localhost:5000.

Alla prox
Ivan