Dile adiós a las clases de cocina, y aprende a desarrollar proyectos modulares en Node.js y Express con la siguiente estructura de proyecto inspirada en la propuesta por TJ Holowaychuk, el creador de express, en el siguiente video:
Modular web applications with Node.js and Express from tjholowaychuk on Vimeo.
Con este capítulo pretendo llevar un paso más adelante el tema tocado en el capítulo anterior (como crear tus propios módulos), modularizando las partes de la aplicación para hacerla más fácil de mantener y escalar.
Creando el proyecto
Primero que nada creamos un proyecto de Express desde la consola:
$ express mudular-test
create : mudular-test
create : mudular-test/package.json
create : mudular-test/app.js
create : mudular-test/public
create : mudular-test/public/javascripts
create : mudular-test/routes
create : mudular-test/routes/index.js
create : mudular-test/routes/user.js
create : mudular-test/public/stylesheets
create : mudular-test/public/stylesheets/style.css
create : mudular-test/public/images
create : mudular-test/views
create : mudular-test/views/layout.jade
create : mudular-test/views/index.jade
install dependencies:
$ cd mudular-test & npm install
run the app:
$ node app
Para esta estructura no vamos a necesitar la carpeta “routes”, tampoco vamos a necesitar el archivo “index.jade” de la carpeta “views”, los eliminamos a ambos.
Creando los controladores
Cada carpeta interna de un proyecto de Node puede ser un módulo distinto como hablamos en el capítulo anterior.
Vamos a crear una carpeta llamada controllers y dentro creamos otra carpeta llamada home.
/controller/home
Y dentro de ‘home’ creamos un archivo llamado index.js. Esto es lo que llamamos un “Controlador”, aquí vamos a atender todas las rutas que consideremos que pertenecen al grupo home.
Ahora dentro del archivo controllers/home/index.js vamos a escribir el siguiente código:
var express = require('express'); // 1
var app = module.exports = express(); // 2
app.get('/', function(request, response) {
// 3
});
- importamos Express
- obtenemos una instancia del framework
- atendemos como sea necesario esta ruta y respondemos.
Creando vistas
TJ Holowaychuk propone crear las vistas en el mismo directorio del controlador, por ejemplo:
/controllers
/home
index.js
home.jade
Yo soy fanático del orden, y creo que esto podría volverse un poco complicado si tenemos varias vistas para este módulo, por eso yo propongo colocarlas en una carpeta aparte:
/controllers
/home
index.js
/views
home.jade
Entonces en el controlador home agregamos el siguiente código en el método de la ruta:
app.get('/', function(request, response) {
response.render('home', {
title: 'Hola, desde el controlador de home'
});
});
Ahora vamos a necesitar un asignar la siguiente propiedad para que el framework pueda encontrar las vistas:
app.set('views', __dirname + '/views');
Entonces nuestro controlador debe lucir de la siguiente manera:
var express = require('express');
var app = module.exports = express();
app.set('views', __dirname + '/views');
app.get('/', function(request, response) {
response.render('home', {
title: 'Hola, desde el controlador de home'
});
});
Ahora necesitamos crear la vista home.jade:
extends ../../../views/layout
block content
h1= title
p Welcome to #{title}
Guardamos en /controllers/home/views/.
Conectándolo todo
Nos vamos a app.js y borramos los app.get que coloca Express por defecto cuando generamos el proyecto e importamos los módulos que hayamos creado, en este caso es solo el módulo “home”.
Agregamos esto junto a la declaración de todos los módulos ya existentes:
var home = require('./controllers/home');
Y más abajo, luego de toda la configuración declaramos asignamos los módulos para su uso:
app.use(home);
Entonces ahora nuestro archivo app.js debe lucir similar al siguiente:
//app.js
var express = require('express');
var routes = require('./routes');
var user = require('./routes/user');
var http = require('http');
var path = require('path');
var app = express();
// modulos
var home = require('./controllers/home');
// all environments
app.set('port', process.env.PORT || 3000);
app.set('views', __dirname + '/views');
app.set('view engine', 'jade');
app.use(express.favicon());
app.use(express.logger('dev'));
app.use(express.bodyParser());
app.use(express.methodOverride());
app.use(app.router);
app.use(express.static(path.join(__dirname, 'public')));
// development only
if ('development' == app.get('env')) {
app.use(express.errorHandler());
}
// rutas
app.use(home);
http.createServer(app).listen(app.get('port'), function(){
console.log('Express server listening on port ' + app.get('port'));
});
Conclusión
En este capítulo Node.js y Express te enseñé como utilizar tus propios módulos para crear una estructura mucho más fácil de entender, mantener y extender.
Este es el último capitulo de esta serie, pero no el último sobre Node.js en este sitio, un hay más por venir en el futuro, este ha sido solo el comienzo.
Espero que esta serie de totorales sobre Node.js y Express haya sido de tu agrado y haya servido de ayuda para comprender esta excelente herramienta para el desarrollo web.
Si consideras que esta entrada es útil, por favor, ayuda a correr la voz y expandir el alcance de Codehero hasta aquellos que necesitan de nuestra ayuda compartiendo en las redes sociales.
Como siempre, las dudas o comentarios puedes dejarla en la sección correspondiente de más abajo.
Adiós.