Como crear un proyecto con TypeScript

¿Por que usar TypeScript?

TypeScript le da una clase de superpoderes a JavaScript en cualquiera de sus presentaciones, ya sea para Node.js, un navegador o cualquier framework basado en Javascript que quieras implementar como React-Native.

TypeScript se ha vuelto muy popular en los últimos años y si no estás codificando con TypeScript, ya vas atrasado.

El objetivo de esta publicación es generar un entorno de desarrollo limpio para probar tus códigos.

Requerimientos

En esta ocasión los requerimientos son sencillos, solo necesitamos nuestra linea de comandos o terminal y las siguientes dependencias:

• Node.js v.16 o superior
• NPM v.9 o superior (se instala con node)

Para validar las versiones en tu linea de comandos teclea npm --version y node --version para comprobar la instalación. Y ya está 😄

Procedimiento

1. Abre tu linea de comandos o terminal e ingresa a una ubicación donde crear tu proyecto.

ℹ️ No necesitas crear la carpeta que contendrá el proyecto

2. Ingresa el siguiente comando npm create vite@latest para iniciar el asistente de Vite
3. Ingresa un nombre para tu proyecto (solo letras, números y guiones) como typescript-prueba
4. A continuación te mostrará un menú, selecciona Vanilla

5. En el siguiente menú, selecciona Typescript

6. Y listo al final se muestra un resumen de la creación como la siguiente imagen

Para finalizar vamos a ingresar a la carpeta del proyecto para instalar las dependencia y ejecutar el proyecto.

Instalación

1. Ingresa desde la línea de comandos o terminal a la carpeta del proyecto (en este caso cd typescript-prueba)
2. Instala las dependencias con npm install
3. Al terminar la instalación te mostrará un resumen como el siguiente:

Ejecución

Ahora si puedes abrir tu proyecto en tu IDE Favorito ya sea Visual Studio Code o el mejor editor WebStorm

Para ejecutar o correr el proyecto, desde la linea de comandos ingresa a la ubicación y teclea el siguiente comando: npm run dev

Si todo sale bien veras una pantalla como la siguiente:

Ingresa a la url que te menciona en color azul para ver tu proyecto. http://localhost:5173

Y listo ahora tienes un proyecto listo con TypeScript para probar tus códigos y desarrollar aplicaciones mágicas. Espero te sea de utilidad y puedes comentar tus dudas a hola@porfi.dev.