Mi primer proyecto TypeScript

Eddy Arellanes

student•

Si queremos ejecutar archivos de .ts sin transpilar, podemos usar una librería que se llama ts-node

Por ejemplo en el package.json

 &quot;dev&quot;: &quot;ts-node index.ts&quot;

O directamente en consola con npx

npx ts-node index.ts

Su caso de uso común es probar que todo funcione antes de traspilar para ahorrar tiempo, un ejemplo de cuando se quiere monitorear Express usando TS

En el package.json

&quot;dev&quot;: &quot;nodemon --exec ts-node -- ./server.ts&quot;,

Alex Leonardo Rodriguez Carvajal

student•

cool!

Miguel Angel Reyes Moreno

student•

¿Quieres decir que nos ahorramos un paso y ejecutamos directamente TS sin tener que crear archivos JS?

ELKIN YESID MORENO VELEZ

student•

Importantísimo aprender TypeScript para afrontar proyectos en Node Js, en Angular, en React.

TypeScript es un Lenguaje de Alto Nivel que al Transpilarse genera JavaScript.

Cristian Blandon

student•

Con el único objetivo de fomentar discusión constructiva... Me gustaría, ¿por qué lo haces ver tan importante para afrontar proyectos con dichas tecnologías? Acaso, ¿no es posible generar buenos o excelentes proyectos con, por ejemplo, React, sin usar Typescript?

Hector Vasquez

student•

concuerdo. Typescript incluso en modo no estricto, ayuda a evitar errores como mínimo los más básicos, como que una variable pueda no estar definida.

Esto evita posibles errores difíciles de detectar a simple vista en tiempo de ejecución. Yo lo apliqué a react y los problemas disminuyeron bastante

Jhon Alexander Romero Gonzaga

student•

Aprender Webpack es aun mejor, podemos impulsar a TypeScript mucho, incluso implementarlo con react, vue y Angular (pero este ya lo tiene :)).

Lina Katherine Larrea

student•

¿Hay algún curso de Wepack en Platzi?

Federico Walovnik

student•

Si lo hay, creo que lo da Leonidas, esta bastante bueno

Luis Alejandro Vera Hernandez

student•

MI PRIMER PROYECTO TYPESCRIPT

Ir al archivo tsconfig.json
Descomentar la linea "outDir":"./"
Agregar a la linea anterior el directorio dist: "outDir": "./dist",
Compilar con tsc
Invocar al motor de Node acceder al directorio dist y al archivo para ejecutarlo: node dist/hello.js

Juan Diego Urbina Chuscano

student•

es muy similar usar tsc --watch a nodemon.

Abril Rios

student•

En parte si aunque nodemon te permite ver los resultados que en TypeScript es con node rute/file. Nodemon se podria tomar con una combinación de tsc --watch y node rute/file.

Moisés Manuel Morín Hevia

student•

Seee me converse más usar -w

Miguel Angel Reyes Moreno

student•

Podemos configurar en el archivo de configuración la instrucción "outDir": "./dist", para que los archivos de JavaScript se guarden en una carpeta dist que, si no existe, se generará de forma automática.

Jeisson Santiago Cortes Ortiz

student•

Alguien me puede explicar para que hacemos lo del outDir?, desafortunadamente no lo he comprendido del todo

Marlon Ramirez

student•

Es para que los archivos compilados se guarden autimaticamente en la direccion que estipules alli

Isaac Navajas Pozo

student•

Lo que estamos configurando y programando es Typescript, Typescript es un copilador que compila el código a javascript, el outDir de TsConfig sirve para guardar la ubicación del archivo compilado a javascript.

Moisés Manuel Morín Hevia

student•

Crear una carpeta, tsc --init, crear una carpeta src & mover(crear) el main.ts, ejecutar tsc --watch 1.) En tsconfig.json descomentar outDir & agregar la carpeta "./dist" & ejecutar ts --watch para compilar cambios. 2) Ejecutar el archivo js. node dist/main.js

Carlos Guerra

student•

Hello TS World!

Moisés Manuel Morín Hevia

student•

Hellooooo

Ariel Ezequiel Biazzo Genua

student•

Hola! Como estan? Aclaro por si acaso, si ven que el camando tsc no crea los archivos .js, prueben con cerrar visual studio y volverlo a abrir, (lo comento porque a mi me sucedio y eso me lo soluciono)

Cesar Augusto Avendaño Gamboa

student•

A mi me pasó una novatada y era que cree el archivo .ts cuando escribí el código se me olvido guardar los cambios. Claro al ejecutar el comando tsc compilaba y el archivo .js no tenia nada de código.

Jonathan Venegas

student•

con ctl + c en windows puede cortar la ejecución del observador del compliador de TypeScript en la terminal

Daniel Cruz

student•

Aún no entiendo que es lo Super de TypeScript, cuales son las super ventajas de empezar a usarlo en lo lugar de JS.

Santiago Cepeda

student•

Puede que nos parezca a simple vista que es añadir mas complejidad a nuestro codigo sin embargo al tratar con proyectos grandes te daras cuenta que te ayudara full, ya que te ayuda a escribir código con menos errores, más sencillo, coherente y fácil de probar.

Gustavo Hernan Tiseira

student•

Con estos ejemplos tan basicos es imposible notar que haya una mejora, pero la realidad es que cuando se programa de verdad se empieza a notar las mejoras. Una vez leí como analogía que usar JS sin TS es como conducir sin frenos, me pareció gracioso pero interesante! jaja!

Fredy Daniel Flores Lemus

student•

Existe un archivo como tsconfig.json pero para configurar la compilación de SASS?

Carlos Zabala Roqueme

student•

Para compilar archivos sass, te recomiendo usar webpack o si usas vscode como editor de texto hay un plugin que se llama Live Sass Compiler, que te compila archivos sass automáticamente.

Fredy Daniel Flores Lemus

student•

😮 Gracias bro, no había escuchado de esa extensión.

Diego Fernando Caviedes Camaho

student•

que es nodemon es un demomio o proceso de node para que?

Joalin Pineda

student•

Es un demonio, una utilidad que monitorea los cambios en el código fuente que se está desarrollando y automáticamente reinicia el servidor. Es una herramienta muy útil para desarrollo de aplicaciones con javascript.

Diego Fernando Caviedes Camaho

student•

también sirve para despliegues me imagino verdad?

Roberto Enrique Ajuchan Lopez

student•

Buenísima la forma de explicar el profe, la velocidad, los temas, las palabras, todo es excelente.

Alex hernandez mitre

student•

console.log("todo funcionando a la perfección");

Jimmy Buriticá Londoño

student•

Listo el entorno, ahora si empecemos con el lenguaje.

Jofay Zhan Segura

student•

Hola compañeros, les comparto mi repositorio donde subo mis notas y codigo 😀

Gustavo Adolfo Perez Ramos

student•

TypeScript es increible :)

@ wrosb

student•

Personalizando las salidas de los diferentes archivos JS con outDir

Moisés Manuel Morín Hevia

student•

Sí, para almacenar las compilaciones que se hagan.

Mi primer proyecto TypeScript

Introducción a TypeScript

El lenguaje de programación TypeScript

Instalación de herramientas para TypeScript

Instalación de herramientas en Windows

Navegación y refactorización

Entorno de Desarrollo

El compilador de TypeScript

El archivo de configuración de TypeScript

Mi primer proyecto TypeScript

Tipos en TypeScript

Tipado en TypeScript

Number, Boolean y String

Any

Void y never

null y undefined

Object

Array

Tupla

Enum

Unión de Tipos, Alias y Tipos Literales

Aserciones de tipo

Funciones en TypeScript

Resumen

Tipos Personalizados

Interfaces

Interfaces: propiedades opcionales

Extensión de interfaces

Clases

Clases públicas y privadas

Métodos Get y Set

Herencia de clases y propiedades estáticas

Resumen

Módulos

Principios de responsabilidad única

Resolviendo módulos

Webpack y agrupación de Módulos

Cierre

Cierre