Node.js y Express: Definiendo Rutas

Bienvenidos a la segunda lección de Node.js y Express. En el capitulo anterior hablamos de como instalar node, express, y generamos y corrimos nuestra primera aplicación. Hoy vamos a empezar a agregar nuestro propio código.

---

Una aplicación desde cero

Para este tutorial vamos a escribir una aplicación desde cero, ya que la que genera Express incluye cantidades de código que aún no podemos entender.

Vamos a crear un directorio llamado Ejemplo y vamos a crear un archivo nuevo llamado package.json. Lo puedes abrir en tu editor de texto favorito y agregamos:

{
  "name": "Ejemplo",
  "version": "0.0.1",
  "dependencies": {
    "express": "3.3.5"
  }
}

El propósito general de este archivo es documentar un paquete de node. En nuestro caso se entiende por paquete la aplicación que estamos creando.

Este archivo es sumamente importante si estamos creando un paquete que estará disponible en npm (node package manager). Aquí se puede declarar quien desarrolló el paquete, la versión, las dependencias que tiene, entre otras cosas.

Por ahora, nosotros declaramos que nuestro proyecto se llama “Ejemplo”, está en la versión 0.0.1 y su única dependencia es Express.

Ahora vamos a la consola y escribimos lo siguiente (debemos estar en el mismo directorio de la aplicación):

$ npm install

Este comando leerá las dependencias del archivo package.json y las instalará en una carpeta llamada node_modules dentro del directorio del proyecto.

Ahora que ya tenemos los paquetes que necesitamos, podemos empezar a escribir nuestra aplicación. Creamos un nuevo archivo llamado app.js en el directorio del proyecto, este archivo será el que inicie el servidor. Empezamos, escribiendo las dependencias que necesitamos:

var express = require('express');
var http = require('http');

1. Express es el framework
2. http es un modulo de node js

Ahora creamos nuestra aplicación:

var app = express();

Le indicamos a express en que puerto vamos a estar escuchando:

app.set('port', process.env.PORT || 3000);

process.env.PORT es una variable de entorno, si no esta configurada para guardar el puerto en que debe correr la aplicación, entonces toma el 3000.

Por último creamos e iniciamos el servidor:

http.createServer(app).listen(app.get('port'), function(){
  console.log('Express server listening on port ' + app.get('port'));
});

Ahora ya tenemos lo lo mínimo necesario para iniciar la aplicación.

---

Creando rutas

Las rutas nos permiten direccionar peticiones a los controladores correctos. Vamos a empezar agregando el código de un controlador para una ruta:

app.get('/', function(request, response) {

    response.send('¡Hola, Express!');

});

Si corremos nuestra app en la consola (parados en directorio de la aplicación) node app.js y vamos a "http://localhost:3000/" en nuestro explorador de preferencia, debemos ver el mensaje "¡Hola, Express!"

Recibiendo parámetros

Si queremos recibir algún parámetro en una ruta debemos especificar en el string el nombre del parámetro son ":" adelante:

app.get('/users/:userName', function(request, response) {

    var name = request.params.userName;

    response.send('¡Hola, ' + name + '!');

});

Ahora si corremos la app y vamos a "http://localhost:3000/users/oscar" veremos que se despliega el mensaje "¡Hola, oscar!".

Recibiendo POST

También podemos recibir requests de tipo POST de la siguiente manera:

app.post('/users', function(request, response) {

    var username = request.body.username;

    response.send('¡Hola, ' + username + '!');

});

Antes de correr este código debemos agregar bodyParser fuera del método, porque express no parsea el cuerpo del request por defecto:

app.use(express.bodyParser());

Ahora podemos hacerle un post desde cualquier app que nos permita hacerlo. Yo utilizo una extensión de Chrome llamada Postman, desde ahí le podemos envíar lo siguiente a "http://localhost:3000/users":

POST /users HTTP/1.1
Host: localhost:3000
Authorization: ApiKey appClient:xxxxxxxxxxxxxxxxxxxxxxxxxx
Cache-Control: no-cache

----WebKitFormBoundaryE19zNvXGzXaLvS5C
Content-Disposition: form-data; name="username"

oscar1234
----WebKitFormBoundaryE19zNvXGzXaLvS5C

Y deberá retornar:

¡Hola, oscar1234!

De esta misma manera también podemos recibir requests PUT y DELETE utilizando app.put() y app.delete() respectivamente.

Usando expresiones regulaes como ruta

También podemos usar expresiones regulares como rutas, por ejemplo, podríamos usar "/\/users\/(\d*)\/?(edit)?/" como una ruta, especificando así que debe haber un dígito en el medio y que la paralabra "edit" es opcional.

app.get(/\/personal\/(\d*)\/?(edit)?/, function (request, response) {

    var message = 'el perfil del empleado #' + request.params[0];

    if (request.params[1] === 'edit') {

        message = 'Editando ' + message;

    } else {

        message = 'Viendo ' + message;

    }

    response.send(message);

});

Si corremos la app y vamos a "http://localhost:3000/personal/15" veremos que se despliega el mensaje "Viendo el perfil del empleado #15", y si agregamos "/edit" al final veremos que el mensaje cambia a "Editando el perfil del empleado #15".

Luego de todos estos cambios tu archivo app.js debe lucir así:

var express = require('express');
var http = require('http');

var app = express();


// all environments
app.set('port', process.env.PORT || 3000);
app.use(express.bodyParser());


app.get('/', function(request, response) {

    response.send('¡Hola, Express!');

});


// app.get('/users/:userName', function(request, response) {

//  var name = request.params.userName;

//  response.send('¡Hola, ' + name + '!');

// });


app.post('/users', function(request, response) {

    var username = request.body.username;

    response.send('¡Hola, ' + username + '!');

});


app.get(/\/personal\/(\d*)\/?(edit)?/, function (request, response) {

    var message = 'el perfil del empleado #' + request.params[0];

    if (request.params[1] === 'edit') {

        message = 'Editando ' + message;

    } else {

        message = 'Viendo ' + message;

    }

    response.send(message);

});


http.createServer(app).listen(app.get('port'), function(){
  console.log('Express server listening on port ' + app.get('port'));
});

---

Conclusión

En este capitulo aprendimos como crear una aplicación de Node y Express desde cero, y creamos distintos tipos de rutas.

Espero que hayas entendido todo, sin embargo siempre puede surgir alguna duda, en ese caso házmela saber en los comentarios aquí abajo.

¡Hasta la próxima!