TypeScript se está abriendo camino como uno de los lenguajes de programación más populares para las organizaciones modernas.
TypeScript es un superíndice de JavaScript estrictamente tipificado compilado (construido sobre el lenguaje JavaScript). Este lenguaje de tipado estático, desarrollado y mantenido por Microsoft, admite conceptos orientados a objetos como su subconjunto, JavaScript.
Este lenguaje de programación de código abierto tiene muchos casos de uso, como la creación de aplicaciones web, a gran escala y móviles. TypeScript se puede usar para el desarrollo de frontend y backend. También tiene varios marcos y bibliotecas que simplifican el desarrollo y amplían sus casos de uso.
¿Por qué usar TypeScript con Node.js? Este artículo discutirá por qué TypeScript se considera «mejor» que JavaScript, cómo instalarlo usando Node.js, configurar y crear un pequeño programa usando TypeScript y Node.js.
Tabla de contenido
TypeScript con Node.js: Beneficios
- Escritura estática opcional: JavaScript se escribe dinámicamente, lo que significa que el tipo de datos de una variable se determina en tiempo de ejecución y no durante el tiempo de compilación. Por otro lado, TypeScript ofrece escritura estática opcional, lo que significa que una vez que declaras una variable, no cambiará su tipo y solo tomará ciertos valores.
- Previsibilidad: cuando se trata de TypeScript, existe la seguridad de que todo lo que defina seguirá siendo el mismo. Por ejemplo, si declara una determinada variable como booleana, nunca puede cambiar a una cadena en el camino. Como desarrollador, tiene la seguridad de que sus funciones seguirán siendo las mismas.
- Fácil de detectar errores temprano: TypeScript detecta la mayoría de los errores tipográficos temprano, por lo que su probabilidad de pasar a producción es baja. Esto reduce el tiempo que los ingenieros dedican a probar el código en etapas posteriores.
- Compatible con la mayoría de los IDE: TypeScript funciona con la mayoría de los entornos de desarrollo integrados (IDE). La mayoría de estos IDE proporcionan finalización de código y resaltado de sintaxis. Este artículo utilizará Visual Studio Code, otro producto de Microsoft.
- Código fácil de refactorizar: puede actualizar o refactorizar su aplicación TypeScript sin cambiar su comportamiento. La presencia de herramientas de navegación y el IDE que comprende su código facilita la refactorización de la base de código sin esfuerzo.
- Utiliza paquetes existentes: no tiene que crear todo desde cero; puede usar paquetes NPM existentes con TypeScript. Este lenguaje también tiene una comunidad sólida que mantiene y crea definiciones de tipos para paquetes populares.
Cómo usar TypeScript con Node.js
Aunque TypeScript tiene estas ventajas, los navegadores modernos no pueden leer su código en forma simple. Por lo tanto, el código TypeScript debe transpilarse primero a código JavaScript para ejecutarse en los navegadores. El código resultante tendrá la misma funcionalidad que el código TypeScript original y funcionalidades adicionales que no están disponibles en JavaScript.
requisitos previos
- Node.js: Node es un entorno de tiempo de ejecución multiplataforma que permite ejecutar código JavaScript fuera de un entorno de navegador. Puede verificar si el nodo está instalado en su máquina usando este comando;
nodo -v
De lo contrario, puede descargar Node.js desde el sitio web oficial. Ejecute el comando anterior nuevamente después de la instalación para verificar si se ha configurado correctamente.
- Un administrador de paquetes de nodos: puede usar NPM o Yarn. El primero se instala de forma predeterminada cuando instala Node.js. Usaremos NPM como administrador de paquetes en este artículo. Use este comando para verificar su versión actual;
npm-v
Instalación de TypeScript con Node.js
Paso 1: configurar una carpeta de proyecto
Comenzaremos creando una carpeta de proyecto para el proyecto de TypeScript. Puede dar a esta carpeta el nombre que desee. Puede usar estos comandos para comenzar;
mkdir mecanografiado-nodo
cd mecanografiado-nodo
Paso 2: Inicializar el proyecto
Use npm para inicializar su proyecto usando este comando;
npm inicializar -y
El comando anterior creará un archivo package.json. El indicador -y en el comando le dice a npm que incluya los valores predeterminados. El archivo generado tendrá un resultado similar.
{
"name": "typescript-node",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo "Error: no test specified" && exit 1"
},
"keywords": [],
"author": "",
"license": "ISC"
}
Configuración de TypeScript con Node.js
Paso 1: Instale el compilador de TypeScript
Ahora puede instalar el compilador de TypeScript en su proyecto. Ejecute este comando;
npm install –save-dev mecanografiado
La salida en su línea de comando será algo similar a esto;
added 1 package, and audited 2 packages in 26s found 0 vulnerabilities
Nota: El enfoque anterior instala TypeScript localmente en la carpeta del proyecto en el que está trabajando. Puede instalar TypeScript globalmente en su sistema, por lo que no tiene que instalarlo cada vez que trabaja en un proyecto. Use este comando para instalar TypeScript globalmente;
npm install -g typescript
Puede verificar si TypeScript se ha instalado usando este comando;
tsc -v
Paso 2: Agregar tipos de Ambient Node.js para TypeScript
TypeScript tiene diferentes tipos, como implícito, explícito y ambiental. Los tipos ambientales siempre se agregan al ámbito de ejecución global. Use este comando para agregar tipos de ambiente;
npm install @types/node –save-dev
Paso 3: Cree un archivo tsconfig.json
Este es el archivo de configuración que especifica todas las opciones de compilación de TypeScript. Ejecute este comando que viene con varias opciones de compilación definidas;
npx tsc --init --rootDir src --outDir build --esModuleInterop --resolveJsonModule --lib es6 --module commonjs --allowJs true --noImplicitAny true
Esto se emitirá en el terminal;
Se generará el archivo tsconfig.json, que contiene algunos valores predeterminados y comentarios.
archivo tsconfig.json
Esto es lo que hemos configurado:
- El rootDir es donde TypeScript buscará nuestro código. Lo hemos dirigido a la carpeta /src donde escribiremos nuestro código.
- La carpeta outDir define dónde se coloca el código compilado. Dicho código está configurado para almacenarse en la carpeta build/.
Usando TypeScript con Node.js
Paso 1: Cree la carpeta src y el archivo index.ts
Ahora tenemos la configuración básica. Ahora podemos crear una aplicación TypeScript simple y compilarla. La extensión de archivo para un archivo TypeScript es .ts. Ejecute estos comandos dentro de la carpeta que creamos en los pasos anteriores;
mkdir origen
toque src/index.ts
Paso 2: agregue código al archivo TypeScript (index.ts)
Puedes comenzar con algo simple como;
console.log('Hello world!')
Paso 3: Compile el código TypeScript en código JavaScript
Ejecute este comando;
npx tsc
Puede verificar la carpeta de compilación (build/index.js) y verá que se ha generado un index.js con esta salida;
TypeScript se ha compilado en código JavaScript.
Paso 4: Ejecute el código JavaScript compilado
Recuerde que el código TypeScript no se puede ejecutar en navegadores. Por lo tanto, ejecutaremos el código en index.js en la carpeta de compilación. Ejecute este comando;
node build/index.js
Esta será la salida;
Paso 5: configure TypeScript para compilar automáticamente en código JavaScript
Compilar el código de TypeScript manualmente cada vez que cambia sus archivos de TypeScript puede hacerle perder tiempo. Puede instalar ts-node (ejecuta el código TypeScript directamente sin esperar a que se compile) y nodemon (comprueba si hay cambios en su código y reinicia automáticamente el servidor).
Ejecute este comando;
npm install --save-dev ts-node nodemon
Luego puede ir al archivo package.json y agregar este script;
"scripts": {
"start": "ts-node ./src/index.ts"
}
Podemos usar un nuevo bloque de código con fines de demostración;
function sum (num1:number, num2:number, num3:number){
return num1 + num2 +num3;
}
console.log(sum(10,15,30))
Elimine el archivo index.js (/build/index.js) y ejecute npm start.
Su salida será similar a esta;
suma de 3 numeros
Configurar el Linting de TypeScript con eslint
Paso 1: Instalar eslint
Linting puede ser útil si desea mantener la coherencia del código y detectar errores antes del tiempo de ejecución. Instale eslint usando este comando;
npm install --save-dev eslint
Paso 2: Inicializar eslint
Puede inicializar eslint usando este comando;
npx eslint --init
El proceso de inicialización lo llevará a través de varios pasos. Use la siguiente captura de pantalla para guiarlo;
Una vez que finalice el proceso, verá un archivo llamado .eslintrc.js con un contenido similar a este;
module.exports = {
env: {
browser: true,
es2021: true
},
extends: 'standard-with-typescript',
overrides: [
],
parserOptions: {
ecmaVersion: 'latest',
sourceType: 'module'
},
rules: {
}
}
Paso 3: Ejecute eslint
Ejecute este comando para verificar y eliminar todos los archivos con la extensión .ts;
npx eslint . --ext .ts
Paso 4: Actualizar paquete.json
Agregue un script de pelusa en este archivo para la pelusa automática.
"scripts": {
"lint": "eslint . --ext .ts",
},
TypeScript con Node.js: mejores prácticas
- Mantenga TypeScript actualizado: los desarrolladores de TypeScript siempre lanzan nuevas versiones. Asegúrese de tener la última versión instalada en su máquina/carpeta de proyecto y benefíciese de las nuevas funciones y correcciones de errores.
- Habilite el modo estricto: puede detectar los errores de programación comunes en tiempo de compilación cuando habilita el modo estricto en el archivo tsconfig.json. Esto reducirá el tiempo de depuración y aumentará la productividad.
- Habilite comprobaciones nulas estrictas: puede detectar todos los errores nulos e indefinidos en tiempo de compilación habilitando comprobaciones nulas estrictas en el archivo tsconfig.json.
- Use un editor de código que admita TypeScript: existen muchos editores de código. Una buena práctica es elegir editores de código como VS Code, Sublime Text o Atom que admitan TypeScript a través de complementos.
- Usar tipos e interfaces: con tipos e interfaces, puede definir tipos personalizados que puede reutilizar en todo su proyecto. Este enfoque hará que su código sea más modular y fácil de mantener.
Terminando
Ahora tiene la estructura básica de una aplicación creada con TypeScript en Node.js. Ahora puede usar los paquetes regulares de Node.js, pero aún así, escriba su código en TypeScript y disfrute de todas las características adicionales que vienen con este último.
Si acaba de comenzar con TypeScript, asegúrese de comprender las diferencias entre TypeScript y JavaScript.