Cómo usar TypeScript con su proyecto Node.js

TypeScript es útil para crear aplicaciones complejas y arquitecturas sólidas como microservicios. Por supuesto, TypeScript no puede hacer nada que JavaScript no pueda, pero puede hacer que los proyectos complejos sean más manejables. La escritura estricta de TypeScript y el soporte para interfaces significan que es excelente para la programación orientada a objetos. Hemos visto a muchas empresas recurrir a TypeScript para codificar su backend.

No hay mejor momento para comenzar a usar TypeScript en su proyecto de Node.js que ahora. Pero, ¿cómo puede configurarlo para su proyecto Node.js? Lo descubrirás en este artículo.

¿Qué es TypeScript?

TypeScript es una versión compilada estrictamente tipeada de JavaScript desarrollada y mantenida por Microsoft. El código TypeScript se transpila a JavaScript.

La naturaleza de escritura estricta de TypeScript ayuda a los desarrolladores a evitar errores en su código. Solo compilará código que satisfaga las reglas de sus tipos de datos especificados. Esto hace que el código TypeScript sea más robusto que su contraparte de JavaScript puro.

También es compatible con la programación funcional y orientada a objetos. Todas estas características lo hacen altamente escalable y adecuado para desarrollar aplicaciones complejas.

Cómo configurar TypeScript en Node. JS

Tendrá que obtener algunas configuraciones aquí y allá para comenzar a usar TypeScript con su proyecto Node.js. Pero no te preocupes, es fácil.

Sin embargo, asegúrese de que usted instalar el paquete npm de Node.js antes de continuar.

Inicializar un archivo package.json

Abra su terminal y cree una carpeta de proyecto. Luego, ingrese este nuevo directorio e inicialice un proyecto Node.js:

inicio npm

El comando anterior crea un paquete.json archivo para almacenar sus dependencias.

Instalar TypeScript y otras dependencias

A continuación, continúe e instale TypeScript en su proyecto Node.js:

npm i -D texto mecanografiado

Él -D La palabra clave garantiza que TypeScript se instale como parte del devDependencias en paquete.json.

También tendrás que instalar @tipos/expreso, una definición de TypeScript para Express.js:

npm instalar -D @tipos/express

A continuación, inicialice un tsconfig.json expediente. Esto detalla las opciones básicas del compilador para su proyecto:

npx --en eso

El comando anterior crea un tsconfig.json archivo en la carpeta raíz de su proyecto.

Además, instale Express.js. Puede omitir esto si solo tiene la intención de administrar servidores con las primitivas HTTP integradas de Node.js. Pero Express.js lo hace fácil:

npm Instalar en pc Rápido

A continuación, instale nodemonio, un paquete que reinicia tu servidor automáticamente cada vez que hay cambios en tu código. Asegúrese de instalar esto globalmente para que funcione:

npm Instalar en pc -g nodemonio

Configurar TypeScript con nodo. JS

Abre el tsconfig.json archivo que inicializó anteriormente usando su editor de código elegido. Puede haber mucho en este archivo. Si bien puede configurar este archivo en su forma actual, puede reemplazar todo su contenido con el siguiente para simplificarlo.

Aquí está todo lo que necesitas en tsconfig.json para ponerse en marcha:

{
"opciones del compilador": {
"módulo": "comunes",
"esModuleInterop": verdadero,
"objetivo": "es6",
"móduloResolución": "nodo",
"fuenteMapa": verdadero,
"outDir": "dist" //Especifica el directorio del transpilador. 
 },
"liberación": ["es2015"]
}

Ahora abierto paquete.json. Así es como se ve actualmente después de instalar TypeScript y Express:

A continuación, agregue las siguientes configuraciones al guiones formación:

"guiones": {
"prueba": "eco \"Error: no se especificó ninguna prueba\"&& salida 1",
"construir": "npx",
"comienzo": "nodo ./dist/app.js",
"dist": "tsc-p.",
 "dev": "nodemon ./src/app.ts", //Reemplazar este con lo correcto directoriosenderopor aplicación.ts en su caso
"tipo": "módulo"
}

La configuración anterior apunta a que su servidor comience en aplicación.js, el transpilador. No se preocupe, este es un archivo predeterminado que se creará automáticamente en un dist carpeta cuando ejecuta el construir texto. Lo harás más adelante en la línea.

A continuación, la configuración especifica el script de desarrollo principal como aplicación.ts.

Por lo tanto, cuando inicia el entorno de desarrollo, nodemonio carreras aplicación.ts. Node.js luego compila esto en JavaScript dentro aplicación.js—que se comunica con el servidor HTTP.

A continuación, cree un origen carpeta en el directorio raíz de su proyecto. Dentro de esta carpeta, cree un archivo TypeScript vacío y asígnele el nombre aplicación.ts.

Crear el directorio Transpiler

El transpiler es un archivo JavaScript que compila código TypeScript en JavaScript nativo. Esto asegura que el servidor pueda relacionarse con su código como JavaScript en lugar del script estrictamente escrito.

Entonces, mientras TypeScript maneja la estructura del código, el archivo transpiler lo compila en JavaScript.

Ahora ejecuta el construir guión para crear el dist directorio transpiler automáticamente:

compilación de ejecución de npm

El comando anterior compila su código TypeScript en JavaScript. La carpeta creada contiene dos archivos; aplicación.js y aplicación.js.mapa.

Abierto paquete.json otra vez. Verá una clave en la matriz llamada principal. Puedes ver que su valor apunta a índice.js. Reemplace esto con el aplicación.js (transpilador) directorio de archivos:

"principal": "./dist/aplicación.js",

Después de formatear, paquete.json debería verse así:

Eso es todo por la parte de configuraciones.

Crear y ejecutar una solicitud HTTP

Ahora intente crear y ejecutar una solicitud HTTP a través del servidor Express.js para ver si su código se compila como debería.

En el interior aplicación.ts:

importar express, {Solicitud, Respuesta} desde 'Rápido'
constante aplicación = expreso()
aplicación.obtener('/', asíncrono (req: Solicitud, res: Respuesta)=>{
 consola.log('Hola Mundo')
 res.enviar('Hola Mundo')
})
constante puerto = 8080
app.listen (puerto, (): vacío=>{
consola.Iniciar sesión(`La aplicación está escuchando en http://localhost:${puerto}`)
})

A continuación, abra la línea de comando en el directorio raíz de su proyecto y ejecute el desarrollador script para iniciar su proyecto:

npm ejecutar dev

Abre tu navegador y ve a servidor local: 8080, y verás la respuesta (Hola Mundo). También verá esto en la terminal si ha aplicado el consola.log como lo hicimos en el ejemplo anterior.

TypeScript tiene perspectivas de alta demanda

Apenas hay mucha diferencia entre TypeScript y JavaScript. Pero el primero facilita el desarrollo con la adición de tipificación estricta.

TypeScript es un lenguaje valioso en marcos frontend como Angular, y no podemos negar su rendimiento y escalabilidad. Se está volviendo más popular y las perspectivas laborales para los desarrolladores de TypeScript siguen aumentando.

Una introducción a Angular

Leer siguiente

Sobre el Autor