Regresar

Express - Bases

Node.js® es un entorno de ejecución para JavaScript construido con el motor de JavaScript V8 de Chrome. Mientras que Express permite crear una infraestructura web rápida, minimalista y flexible el backend para Node.js

Esqueleto de un proyecto web

Utilizaremos el generador de aplicaciones de express. Desde la línea de comandos:

• Instale el express-generator, con: npm i -g express-generator
  • Para obtener ayuda acerca del comando, utilice: express --help

• Cree un sitio de prueba llamado admin, con: express --view=ejs admin

  

• El generador producirá la siguiente estructura de archivos:

  
    .
    ├── app.js           # Configuración para la aplicación que se ejecutará en el servidor
    ├── package.json     # Módulos de la aplicación
    ├── package-lock.json
    ├── bin
    │   └── www          # Punto de arranque de la aplicación - Lee el archivo app.js
    ├── public           # Directorio de archivos estáticos
    │   ├── images
    │   ├── javascripts
    │   └── stylesheets
    │       └── style.css
    ├── routes           # Rutas de la aplicación en módulos separados
    │   ├── index.js
    │   └── users.js
    └── views            # Vistas de la aplicación por renderizar
        ├── error.ejs
        └── index.ejs
  

• Compruebe el funcionamiento del servidor, con:

  
      cd admin   
      npm install   
  

• Instale nodemon, con:

  npm i nodemon
  

• Modifique el archivo package.json con el script:

  ...
  "scripts": {
    ...
    "autostart": "nodemon ./bin/www"
  },
  ...
  

• Levante el servidor, con:

  npm run autostart
  

• Acceda al URL http://localhost:3000/

  

• El archivo app.js contiene la configuración para la aplicación web, con las siguientes partes
  • Módulos para la aplicación web

  
    var createError = require('http-errors');    # Manejo de errores por defecto
    var express = require('express');            # Arquitectura de la aplicación en backend
    var path = require('path');                  # Manejo de rutas
    var cookieParser = require('cookie-parser'); # Manejo de cookies
    var logger = require('morgan');              # Registro (log) de acciones del servidor
  

  • Referencia a los archivos con las rutas internas

  
    var indexRouter = require('./routes/index'); # Carga del manejador de subrutas para la ruta raíz
    var usersRouter = require('./routes/users'); # Carga del manejador de subrutas para la ruta users 
  

  • Instanciación de la aplicación

  
    var app = express();
  

  • Vistas (EJS que serán renderizadas en HTML)

  
    // view engine setup
    app.set('views', path.join(__dirname, 'views')); # Ruta a los archivos físicos que contienen las vistas 
    app.set('view engine', 'ejs');                     # Motor de renderización - EJS
  

  • Configuración de la aplicación

  
    app.use(logger('dev'));                             # Instanciación del registrador (logger) de acciones para el MODO DE DESARROLLO
    app.use(express.json());                            # Este método se usa para analizar las solicitudes entrantes con cargas JSON y se basa en el analizador de cuerpo de mensajes HTTP.
    app.use(express.urlencoded({ extended: false }));   # Analiza las requests entrantes con cargas codificadas y se basa en body-parser. 
    app.use(cookieParser());                            # Manejo de cookies entre el cliente y el servidor 
    app.use(express.static(path.join(__dirname, 'public')));     # Registro de la ruta para archivos estáticos (imágenes, hojas de estilo, etc)
  

  • Relación entre las rutas externas y las rutas internas

  
    app.use('/', indexRouter);              # Pareo entre la ruta raíz y el manejador de subrutas
    app.use('/users', usersRouter);         # Pareo entre la ruta users y el manejador de subrutas
  

  • Middleware para errores

  
    // catch 404 and forward to error handler
    app.use(function(req, res, next) {
      next(createError(404));               # En caso de cualquier error, lanzar un error404 
    });
    
    // error handler
    app.use(function(err, req, res, next) {
      // set locals, only providing error in development
      res.locals.message = err.message;
      res.locals.error = req.app.get('env') === 'development' ? err : {}; # Los errores se mostrarán en el MODO DE DESARROLLO 
  
      // render the error page
      res.status(err.status || 500);
      res.render('error');
    });
  

Referencias

---

• Introducción a Express/Node - Aprende sobre desarrollo web MDN. (2022). Retrieved 21 July 2022, from https://developer.mozilla.org/es/docs/Learn/Server-side/Express_Nodejs/Introduction
• Express - Infraestructura de aplicaciones web Node.js. (2022). Retrieved 21 July 2022, from https://expressjs.com/es/
• Express application generator. (2022). Retrieved 21 July 2022, from https://expressjs.com/en/starter/generator.html
• Express Tutorial Part 2: Creating a skeleton website - Learn web development MDN. (2022). Retrieved 21 July 2022, from https://developer.mozilla.org/en-US/docs/Learn/Server-side/Express_Nodejs/skeleton_website
• Express.js – express.json() function. (2022). Retrieved 22 July 2022, from https://www.tutorialspoint.com/express-js-express-json-function#:~:text=json()%20is%20a%20built,header%20matches%20the%20type%20option.