đ Tutorial TypeScript con Node.js y Express. ÂĄCrea tu API REST con tipos estĂĄticos DESDE CERO!
En este tutorial, aprenderĂĄs cĂłmo crear una API REST utilizando TypeScript, Node.js y Express. TypeScript es un lenguaje de programaciĂłn que extiende JavaScript agregando tipos estĂĄticos, lo cual te permite reducir errores durante el desarrollo y tener un cĂłdigo mĂĄs robusto.
Antes de comenzar, asegĂșrate de tener Node.js instalado en tu mĂĄquina. Puedes descargarlo desde https://nodejs.org.
Paso 1: ConfiguraciĂłn del proyecto
Lo primero que debemos hacer es crear una nueva carpeta para nuestro proyecto. Abre tu terminal y ejecuta el siguiente comando:
mkdir tutorial-typescript
Luego, ingresa al directorio recién creado:
cd tutorial-typescript
Ahora, inicialicemos nuestro proyecto de Node.js ejecutando el siguiente comando:
npm init -y
Este comando crearĂĄ un archivo package.json con la configuraciĂłn bĂĄsica de nuestro proyecto.
Paso 2: InstalaciĂłn de dependencias
Para poder utilizar TypeScript, necesitamos instalarlo como una dependencia de desarrollo. Ejecuta el siguiente comando:
npm install typescript --save-dev
También necesitaremos instalar los tipos de TypeScript para Node.js y Express:
npm install @types/node @types/express --save-dev
AdemĂĄs, instalaremos Express como una dependencia regular:
npm install express
Ahora que tenemos todas las dependencias instaladas, podemos pasar al siguiente paso.
Paso 3: ConfiguraciĂłn de TypeScript
En la raĂz de tu proyecto, crea un archivo llamado tsconfig.json con la siguiente configuraciĂłn:
{
"compilerOptions": {
"target": "es6",
"module": "commonjs",
"outDir": "dist",
"strict": true,
"esModuleInterop": true
},
"include": [
"src/**/*.ts"
],
"exclude": [
"node_modules"
]
}
Esta configuraciĂłn le indica al compilador de TypeScript cĂłmo debe transpilar nuestro cĂłdigo y dĂłnde debe colocar los archivos de salida.
Paso 4: CreaciĂłn de la API REST
Crea una carpeta llamada src en la raĂz de tu proyecto. Dentro de esta carpeta, crea un archivo llamado index.ts con el siguiente cĂłdigo:
import express, { Request, Response } from 'express';
const app = express();
const port = 3000;
app.get('/', (req: Request, res: Response) => {
res.send('ÂĄHola TypeScript con Node.js y Express!');
});
app.listen(port, () => {
console.log(`Servidor corriendo en http://localhost:${port}`);
});
En este cĂłdigo, estamos importando el mĂłdulo express y las interfaces Request y Response de este mĂłdulo. Luego, estamos creando una instancia de la aplicaciĂłn express y definiendo un punto de entrada en la ruta ‘/’ que devuelve un mensaje de saludo.
Finalmente, iniciamos el servidor en el puerto 3000.
Paso 5: CompilaciĂłn y ejecuciĂłn del proyecto
Para compilar nuestro proyecto TypeScript, ejecuta el siguiente comando:
npx tsc
Esto generarĂĄ los archivos JavaScript en la carpeta dist.
Una vez que la compilaciĂłn haya finalizado, puedes ejecutar tu API REST con el siguiente comando:
node dist/index.js
ÂĄFelicidades! Ahora podrĂĄs acceder a tu API REST en http://localhost:3000 y ver el mensaje de saludo.
En este tutorial, has aprendido cĂłmo crear una API REST utilizando TypeScript, Node.js y Express. Has visto cĂłmo configurar el proyecto, instalar las dependencias necesarias, configurar TypeScript y crear una API bĂĄsica. Ahora puedes explorar y expandir tu API agregando mĂĄs rutas, controladores y lĂłgica de negocio.
¥Diviértete creando tu propia API REST con tipos eståticos!
Me hubiera gustado que levantaras los Unit test ya que es super importante
Excelente video muy didĂĄctico, una pregunta tendrĂĄs algĂșn vĂdeo donde muestres como generar el build para producciĂłn del proyecto??? Gracias por compartir tu conocimiento. Saludos.
EstĂĄ genial el video gracias Midu, solo una aclaraciĂłn, el cĂłdigo NO SE COMPILA, cuando pasa de typescript a Javascript esto se llama TRANSPILAR, solo esa aclaraciĂłn ya que varias veces dices "compilar".
Sacas Eslint de la nada, o el thinder client como si todos supieramos que es y nisiquiera explicas que se tiene que instalar aparte, por algo es tutorial desde cero, otras cosas las sobreexplicas sin ser necesario đ
Excelente, aprendo mucho de ti, gracias por todos tus aportes.
Que theme usa? me gusta mucho el diseño
tengo una duda si escribo el codigo en TS -> se convierte a JS que sentido tiene si node correria es el en start JS y en dev en TS, lo digo en el caso de correr solo TS sin convertir a JS y ya ?
Excelente!!! Ahora una explicaciĂłn con este mismo cĂłdigo de cĂłmo se hace el deploy a AWS, usando Elastic B o quizĂĄs transformar esto a funciones lambda!
Te quiero bro
Yo guardaria el archivo utils.ts dentro de la carpeta libs. Excelente video he aprendido bastante, muchas gracias. đ
esto es nivel junior?
jeje yo que ya habia visto el error desde que probe antes , pero esperando como lo encuentra terrible y no saber como decir ahi esta, ahi ahi (tremendo crack aprendi bastante recien estoy comenzando con typescript y me parecio muy bueno gracias a lo genial que lo explico )
La explicaciĂłn que se da a partir del 23:30 es magistral. Me ayudĂł mucho. Gracias!
Alto curso, Midudev…!!! espectacular…!!! Muchas gracias.
Genial!, consulta el repositorio esta?
esto aĂșn es nivel pollo. no he visto en este video y otros de este canal el asunto de manejar las rutas como un verdadero profesional. eso de andar importando todas las rutas de venir y por haber, en el archivo app.ts y luego tener que usarlas en ese mismo archivo con app.use….. es una chapuza!!!!!!!. ASĂ LO HACEN EL 99%!!!!!!!! ahora imagĂnense que el directorio routes tenga mĂĄs o menos la siguiente estructura:
routes
index.ts
items.ts
otro.ts
otromas.ts
unomas.ts
…
…
subCarpeta
…
…
100 archivos aquĂ .ts
…
…
100 carpetas mĂĄs aquĂ, cada una con cientos de archivos .ts
…
…
qué pretenden?
llenar el app.ts a punta de imports y use??????? naaahhhhh, pero nadie hasta ahora ha subido un ejemplo de como lidiar con esta situaciĂłn!
Que extensiĂłn es la que te dice 0 complementaciĂłn encima de las interfaces?
si no es mucha molestia, alguien sabe como se llama la extensiĂłn que te dice lo errores en el cĂłdigo sin tener que hacer hover en el error?
sos un tipazo
Super bien explicado, genial que dejes los errores para saber como encontrarlos. Muchas gracias Midu