martedì, gennaio 13, 2015

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

Nessun commento:

Posta un commento