Creación de una API REST con Express y TypeScript

Esta es la primera entrada de una serie en la que se explicarán los pasos para crear un API REST con Express y TypeScript. En esta primera entrada se explicará cómo configurar el proyecto Node y se creará el primer servicio.

Esta entrada forma parte de la serie “Creación de una API REST con Express y TypeScript” de la cual forman los siguientes entregas:

1. Creación de una API REST con Express y TypeScript
2. Organizar el código del proyecto
3. Configurar TypeORM para acceder a la base de datos
4. Creación de rutas para consultar y agregar los registros
5. Creación de rutas para modificar y borrar los registros
6. Agregando logs al API con Winston
7. Requerir autenticación mediante JWT
8. Registro de usuarios
9. Incluir un certificado en Express para servir el API mediante HTTPS
10. Ejecutar la aplicación en producción con PM2

Configuración inicial del proyecto

El primer paso para la creación de una API REST con Express y TypeScrip es la creación de la carpeta del proyecto. Para ello, asumiendo que Node se encuentra instalado en el ordenador, en una terminal se pueden ejecutar los siguientes comandos

mkdir expresslanets
cd expresslanets
npm init -y

Con lo que sé creará una carpeta para el proyecto llamada expresslanets y, mediante el comando npm init -y, dentro de esta el archivo de configuración package.json.

Instalación de TypeScript

Una vez hecho tendremos que instalar TypeScript dentro del proyecto, para lo que se escribirá en la terminal el comando

npm install --save-dev typescript

Una vez terminado el proceso de instalación, es necesario crear el archivo de configuración para el compilador de TypeScript, lo que se puede realizar mediante el siguiente comando

npx tsc -init

En el caso de que TypeScript se encuentre instalado como una dependencia global se puede omitir la instalación de paquete y el uso de npx en el comando. Incluir la dependencia en el proyecto nos garantiza que este funcionará en cualquier equipo con una instalación de Node compatible, evitando la necesidad de instalar paquetes globales en otros equipos. Evitando además posibles problemas de compatibilidad. El único inconveniente es que la carpeta del proyecto ocupará más espacio en disco.

Si todo ha funcionado correctamente ahora también se tendrá el archivo tsconfig.json donde se guarda la configuración para el compilador. En este archivo es necesario buscar las propiedades rootDir y outDir para eliminar el comentario e indicar respectivamente la carpeta en la que se almacenará el código TypeScript y la carpeta en la que el compilador pondrá los archivos JavaScript. Pudiendo usar src para el código y dist para los archivos resultantes. Así esta dos líneas quedarán de la siguiente forma

"rootDir": "./src",
"outDir": "./dist",

Instalación de Express

Tras la instalación de TypeScript es necesario instalar el módulo Express y las definiciones de tipos. Lo que se puede hacer mediante escribiendo en la terminal los siguientes comandos.

npm install express
npm install --save-dev @types/express @types/node

Es importante no olvidar instalar los tipos ya que en caso contrario TypeScript dará problemas de compilación.

Creación de un servicio básico

Ahora, una vez instalados los paquetes básicos y creados los archivos de configuración, se puede crear un servicio básico para comprobar el funcionamiento. Para ello en la carpeta src se crea un archivo llamado index.ts en el que se escribirá el siguiente código.

import express, { Application } from "express";

const PORT = 3000;

const app: Application = express();

app.get('/', async (_req, res) => {
    res.send({
        message: `Server is running on port ${PORT}`,
    });
});

app.listen(PORT, () => {
    console.log(`Server is running on port ${PORT}`);
});

Ahora volveremos a la terminal para escribir el comando

npx tsc

con el que creará en la carpeta dist un archivo llamado index.js con el código JavaScript. Pudiendo iniciar el servicio mediante el comando

node ./dist/index.js

Ahora, si todo ha ido bien, en la terminal aparecerá el siguiente mensaje Server is running on port 3000. Se puede comprobar que todo funciona correctamente abriendo un navegador y accediendo a URL http://localhost:3000 para ver un mensaje como el que se muestra a continuación.

Un primer paso con el que ya podemos ver el funcionamiento básico de Express.

Ejecutando el código TypeScrit directamente

A la hora de depurar el código puede ser incómodo tener que compilar cada vez que se realiza un cambio y volver a lanzar el servicio. Para agilizar este proceso se puede los paquetes ts-node y Nodemon. El primero permite ejecutar directamente código TypeScrit sin la necesidad de compilar este previamente a JavaScript. Por otro lado, Nodemon es un proceso que revisa cambios en la carpeta de código y cuándo se modifica un archivo vuelve a lanzar el servicio con los cambios. Para poder usarlos es necesario instalar las dependencias escribiendo en la terminal el comando

npm install --save-dev ts-node nodemon

Una vez finalizado el proceso de instalación debemos indicar a Nodemon donde buscar los cambios y el proceso que debe lanzar. Para ello agregaremos al package.json las siguientes opciones

"nodemonConfig": {
  "watch": [
    "src"
  ],
  "ext": "ts",
  "exec": "npx ts-node src/index.ts"
}

En donde se indica que ha de buscar los cambios en la carpeta src, solamente los archivos con extensión ts y cada vez que observe un cambio ejecute el comando npx ts-node src/index.ts. Lanzando de este modo el servicio sin necesidad de generar los archivos JavaScript previamente.

Ahora simplemente se debe escribir en la terminal el comando npx nodemon para iniciar el servicio.

Creación de scripts

Debido a que es necesario llamar algunos comandos de forma repetitiva, como la compilación y Nodemon, es aconsejable definir unos scripts en el archivo package.json. Así se puede crear uno llamado build para compilar y otro dev para iniciar Nodemon.

"build": "npx tsc",
"dev": "npx nodemon"

Ahora al escribir en la terminal npm run dev se lanzará el servicio y este se volverá a iniciar de forma automática cada vez que se haga un cambio en el código.

Conclusiones

En esta primera entrada se han visto los pasos para configurar un proyecto en el que se implementa una API REST con Express y TypeScript. En la siguiente publicación se verá cómo organizar el proyecto de una forma más eficiente para que este pueda crecer con facilidad.

El código creado en toda la serie de publicaciones se puede encontrar en la cuenta de GitHub de Analytics Lane.

Imagen de Tayeb MEZAHDIA en Pixabay