Laboratorio 6: Utilizando Express

Objetivos

Durante esta práctica, los alumnos serán capaces de:

Desarrollar una aplicación web sencilla utilizando el framework Express para Node.js.

Esta actividad promueve las siguientes habilidades, valores y actitudes: análisis y síntesis, capacidad de resolver problemas, creatividad, y uso eficiente de la informática y las telecomunicaciones.

Descripción de la actividad

NOTA IMPORTANTE: Las actividades de la práctica se pueden elaborar de manera individual o en parejas. El reporte de la práctica de laboratorio debe ser desarrollado de manera individual.

Instala los módulos express y express-generator de Node. Desde la terminal teclea:
```
cd
```
```
sudo npm install -g express
```
```
sudo npm install -g express-generator
```
Crea una nueva aplicación web de Express llamada lab6. Teclea en la terminal:
```
express -e lab6
```
```
cd lab6
```
```
sudo npm install
```
Corre el servidor de la aplicación web y verifica que se pueda utilizar correctamente. En la terminal teclea:
```
npm start
```
Visita la siguiente liga en tu navegador:

http://localhost:3000/

La salida en el navegador debe ser algo así:

Express

Welcome to Express

Abre en un editor el archivo lab6/routes/index.js y agrega al final de éste el siguiente código:

router.get('/hola/:nombre?', function (req, res) {
    var nombre = req.params.nombre || 'Mundo';
    res.render('hola.ejs', { 'nombre': nombre });
});

Crea los siguientes dos archivos, colocándolos en el directorio indicado dentro del comentario correspondiente:

<!DOCTYPE html>
<!-- Archivo: lab6/views/hola.ejs -->

<html lang="es">
    <head>
        <meta charset="utf-8" />
        <title>Hola</title>
        <link rel="stylesheet" href="/stylesheets/estilos.css"/>
    </head>

    <body>
        <h1>Hola</h1>
        <p>
            ¡Hola <%= nombre %>!
        </p>
        <hr/>
        <footer>
            Desarrollo de aplicaciones web
        </footer>
    </body>
</html>

/* Archivo: lab6/public/stylesheets/estilos.css */

body {
    background: #FFFFFF;
    color: #000080;
    font-family: sans-serif;
    font-size: medium;
    margin: 20px;
}

hr {
    border: 0;
    color: #B0C4DE;
    background-color: #B0C4DE;
    height: 1px;
}

table {
    border-collapse: collapse;
    border: 1px solid #000000;
    padding: 0px;
    margin-bottom: 10px;
    color: #000000;
    background: #E6E6FA;
}

td {
    border: 1px solid #000000;
    padding: 10px;
    text-align: center;
}

th {
    border: 1px solid #000000;
    padding: 10px;
    color: #008080;
    background: #B0E0E6;
}

li {
    color: #AAAAAA;
}

span {
    color: #094141;
}

footer {
    font-size: 70%;
    color: #B0C4DE;
    text-align: center;
}

Desde la terminal detén el servidor de la aplicación web y córrelo nuevamente:
```
npm start
```
Visita las siguientes ligas en tu navegador para verificar que funcione correctamente:
- http://localhost:3000/hola
- http://localhost:3000/hola/Todos
Extiende esta misma aplicación web de Express para poder generar los n primeros elementos de la secuencia look-and-say de John Conway. Cuando el usuario provea un URL como este (en este caso n=15):

http://localhost:3000/conway/15

la página web devuelta debe contener la siguiente información:
Verifica que la página resultante sea HTML5 válido utilizando el Servicio de Validación de W3C.

¿Qué se debe entregar?

Para entregar tu trabajo individual, sigue las siguientes instrucciones:

Escribe el reporte de la práctica tal como se detalla en el documento Reportes de laboratorio. El nombre del archivo fuente de AsciiDoc debe ser reporte_lab6_A0MMMMMMM.txt, en donde A0MMMMMMM corresponde a tu matrícula. A partir del código fuente de AsciiDoc debes generar el archivo HTML correspondiente. Dicho archivo se debe llamar reporte_lab6_A0MMMMMMM.html. Coloca ambos archivos dentro del directorio lab6.
Crea un archivo tarball con todo el contenido del directorio lab6. Nombra a este archivo lab6.tgz. Este archivo se puede crear desde la línea de comando tecleando lo siguiente (asegúrate que te encuentres en el mismo nivel que el directorio lab6):
```
tar czf lab6.tgz lab6
```

✔ Instrucciones para subir archivo

Para entregar el archivo lab6.tgz, ingresa los siguientes datos:

Solicitar NIP

Fecha límite: Miércoles, Octubre 8.

Evaluación

Esta actividad será evaluada usando los siguientes criterios:

50%	Implementación de los requerimientos.
50%	Reporte de la práctica de laboratorio.
DA	El programa y/o reporte es un plagio.