DEV Community: Samuel

Cursor Ai: Gracias, pero no gracias.. todavía

Samuel — Wed, 04 Sep 2024 10:30:14 +0000

Por qué no estoy usando Cursor AI... todavía

Como programador experimentado, me ha intrigado el auge de las herramientas de programación impulsadas por IA. Cursor AI, en particular, ha llamado mi atención. Aunque ofrece algunas características impresionantes, me he resistido a integrarlo completamente en mi flujo de trabajo. Estas son las razones:

Control: Valoro saber exactamente qué está cambiando en mi código y por qué. Con la IA, ese nivel de control puede verse comprometido.
Memoria y contexto: Las herramientas de IA a veces retienen direcciones previas, lo que puede llevar a resultados inesperados si cambio mi enfoque a mitad del proyecto.
Funcionalidad del Compositor: Aunque prometedora, la función del compositor aún no está del todo lograda. Su rendimiento puede ser inconsistente.
Redundancia: Con acceso a Claude 3.5, ChatGPT y otros LLMs, las ofertas de Cursor AI se sienten algo redundantes.
Experiencia y requisitos: Mi experiencia en programación me permite visualizar soluciones precisas, a menudo dentro de requisitos específicos del proyecto que la IA podría no captar completamente.
Gestión de proyectos: Apreciaría una forma más robusta de introducir y gestionar los requisitos y especificaciones del proyecto.
Placer de programar: Realmente disfruto programando. Con TypeScript e IntelliSense en VS Code, combinado con LLMs para documentación y sugerencias de IA, ya tengo un flujo de trabajo satisfactorio.
Visibilidad del control de versiones: La facilidad para ver los cambios no confirmados es crucial, especialmente con código generado por IA. La interfaz de Cursor hace que esto sea menos intuitivo en comparación con VS Code.

Sin embargo, Cursor AI no carece de méritos. Sobresale en el análisis rápido de proyectos existentes con múltiples importaciones y es experto en hacer cambios simples en toda la base de código. Para demostraciones rápidas, proyectos simples y principiantes, es una herramienta poderosa.

Aunque Cursor AI muestra promesa, aún no está listo para reemplazar mi configuración actual. Muchas de sus características destacadas podrían potencialmente implementarse como plugins de VS Code, manteniendo el entorno familiar al que me he acostumbrado. A medida que las herramientas de programación con IA evolucionan, estoy emocionado por ver cómo abordarán estas preocupaciones y potencialmente revolucionarán la forma en que programamos.

Probando Cursor AI

Renderización Dinámica de Componentes en Vue 3 y Nuxt 3: Guía Práctica y Caso Real

Samuel — Sun, 30 Jun 2024 08:22:00 +0000

Componentes dinámicos en Vue y Nuxt: Guía Práctica y Caso Real

Nuxt 3 ofrece una forma flexible y muy potente de renderizar diferentes componentes basados en condiciones dinámicas. Esto es especialmente útil cuando el componente exacto a renderizar no se puede determinar hasta el tiempo de ejecución.

Configuración Básica

Para empezar, asegúrate de tener un componente que deseas resolver dinámicamente. Por ejemplo, supongamos que tenemos un componente llamado MyButton que queremos usar dinámicamente:

<script setup lang="ts">
import { SomeComponent } from '#components'

const MyButton = resolveComponent('MyButton')
</script>

En el script anterior, usamos resolveComponent para resolver dinámicamente el componente MyButton. Este método es útil cuando los componentes necesitan cargarse de manera condicional o cuando se trata de aplicaciones grandes donde los componentes se cargan bajo demanda.

Uso de Componentes Dinámicos en Plantillas

Una vez que hemos resuelto nuestros componentes, podemos usarlos en la sección de la plantilla. La etiqueta <component> en Vue 3 (y por lo tanto en Nuxt 3) permite la renderización dinámica de componentes. Aquí tienes un ejemplo:

<template>
  <component :is="clickable ? MyButton : 'div'" />
  <component :is="SomeComponent" />
</template>

En esta plantilla:

La primera etiqueta <component> usa una operación ternaria para decidir si renderizar el componente MyButton o un simple elemento div basado en la condición clickable.
La segunda etiqueta <component> renderiza SomeComponent directamente.

Explicación Técnica

resolveComponent: Esta función se utiliza para resolver dinámicamente un componente por su nombre. Devuelve un componente que se puede usar en tu plantilla.
<component :is="...">: Esta etiqueta especial de componente te permite especificar qué componente renderizar dinámicamente usando el atributo :is.

Beneficios de los Componentes Dinámicos

Flexibilidad: Los componentes dinámicos permiten a los desarrolladores crear aplicaciones más flexibles y modulares. Los componentes pueden renderizarse basándose en interacciones del usuario, el estado de la aplicación u otras condiciones dinámicas.

Ejemplo en un Caso Real

En un caso real, necesitaba cargar dinámicamente componentes según la ruta. Aquí tienes un ejemplo de cómo se puede lograr esto:

<script lang="ts" setup>
import { UiVerticalNavigation, UiNavigationAccordion, UiBreadCrumbs } from '#components';
const route = useRoute()
const component = route.params.component as string

const componentList = [
  {
    label: 'Vertical Navigation',
    id: 'vertical-navigation',
    component: UiVerticalNavigation
  },
  {
    label: 'Navigation Links (PRO)',
    id: 'navigation-accordion',
    component: UiNavigationAccordion,
    pro: true
  },
  {
    label: 'Breadcrumbs',
    id: 'breadcrumbs',
    component: UiBreadCrumbs
  }
]

const currentComponent = componentList.find(c => c.id === component)
</script>

<template>
  <UContainer class="p-5 mt-32">
   <div v-if="component && currentComponent">
     <h1 class="text-4xl font-bold py-4">{{ currentComponent.label }}</h1>
     <component :is="currentComponent.component" />
   </div>
   <div v-else class="">
     <h1 class="text-4xl font-bold">Component not found</h1>
   </div>
  </UContainer>
</template>

<style>
</style>

En este ejemplo:

Importación de Componentes: Importamos los componentes que queremos renderizar dinámicamente (UiVerticalNavigation, UiNavigationAccordion, UiBreadCrumbs).
Obtención de la Ruta: Utilizamos useRoute para obtener la ruta actual y el parámetro component de la URL.
Lista de Componentes: Creamos una lista de componentes con sus etiquetas, identificadores y referencias a los componentes importados.
Selección del Componente Actual: Encontramos el componente actual en la lista basado en el identificador de la URL.
Renderización en la Plantilla: Utilizamos <component :is="currentComponent.component" /> para renderizar el componente seleccionado dinámicamente. Si no se encuentra el componente, mostramos un mensaje de "Component not found".

Este enfoque permite que la aplicación cargue y renderice componentes específicos basados en la ruta actual, lo cual es útil para crear interfaces de usuario dinámicas y adaptativas.

Conclusión

Usa componentes dinámicos, es un recurso que te puede ahorra muchos dolores de cabeza

¡Adiós Options API, Hola Script Setup! La no tan nueva forma de programar en Vue 3

Samuel — Sat, 27 May 2023 06:24:52 +0000

script setup proporciona una forma más concisa de utilizar la Composition API en Single File Components (SFCs).

En su versión 3, Vue introdujo un nuevo sistema para organizar el código de los componentes llamado "Composition API". Esta API es una alternativa a la "Options API", que era el sistema original para organizar el código en Vue.

La diferencia fundamental entre estas dos APIs radica en cómo se organizan y se acceden a las distintas partes del componente Vue.

Options API

Cuando defines un componente utilizando la Options API, lo haces proporcionando un objeto con diferentes opciones predefinidas.

Estas opciones son (entre otras): data, methods, computed, watch, props, components, etc. Cada una de estas opciones sirve para un propósito específico y define una parte de la funcionalidad del componente. Hay muchas más opciones (mounted, created, beforeDestroyed etc), de ahí el nombre (Creo yo).

export default {
  data() {
    return {
      message: '¡Hola, Vue!'
    }
  },
  methods: {
    sayHello() {
      console.log(this.message);
    }
  }
}

Composition API

La Composition API es una nueva forma de definir y organizar componentes en Vue 3. En lugar de utilizar diferentes opciones para diferentes características, con la Composition API, defines tu componente utilizando una sola función: setup.

Dentro de la función setup, puedes definir todos los aspectos de tu componente: datos reactivos, funciones, observadores, etc. Esto te permite agrupar la lógica relacionada en lugar de dividirla por características.

import { ref } from 'vue';

export default {
  setup() {
    const message = ref('¡Hola, Vue!');

    const sayHello = () => {
      console.log(message.value);
    }

    return {
      message,
      sayHello
    }
  }
}

Diferencias

Las principales diferencias entre estas dos APIs son:

Organización del código: Con la Options API, la lógica relacionada se divide entre diferentes opciones, mientras que con la Composition API, puedes agrupar la lógica relacionada juntos.
Reutilización de código: La Composition API facilita la reutilización de código y lógica entre componentes.
Tipo de datos: Con la Options API, se utiliza this para acceder a los datos reactivos, mientras que con la Composition API, se utilizan funciones como ref y reactive para crear y acceder a los datos reactivos.

Vue 3 todavía soporta completamente la Options API, por lo que puedes seguir usándola si prefieres.

Script Setup

es una nueva característica introducida en Vue 3.2 que proporciona una forma más concisa de utilizar la Composition API en Single File Components (SFCs).

En lugar de exportar un objeto de configuración del componente con una función setup, puedes escribir el código de tu componente directamente en el bloque . Cualquier variable o función que declares en se expondrá automáticamente en la plantilla de tu componente.

<script setup>
import { ref } from 'vue';

const message = ref('¡Hola, Vue!');

const sayHello = () => {
  console.log(message.value);
}
</script>

Este es el equivalente exacto al componente que definimos anteriormente con la función setup estándar, pero es más conciso.

Ventajas de Script Setup

Código más conciso y limpio: Puedes escribir tu código directamente en el bloque en lugar de tener que exportar una objeto
Mayor re utilización de la lógica: Puedes agrupar toda la lógica relacionada con una function en un mismo bloque
Mejor soporte de Typescript: Si estás utilizando Typescript, script setup y compositions API tienen mejor soporte que la options API
Control más granular sobre la reactividad: Puedes decidir exactamente qué datos deben ser reactivos y cómo deben reaccionar a los cambios
Organización del código: Puedes organizar el código por lógica de la funcionalidad, no por las opciones del componente.

Conclusión

La elección entre usar y la Composition API versus la Options API depende en gran medida de tu proyecto y de tus preferencias personales. No obstante es la nueva preferencia en proyectos Vue 3.

Revoluciona tu desarrollo web: Descubre las tendencias emergentes en Vue3, TypeScript y TailwindCSS

Samuel — Fri, 28 Apr 2023 20:36:56 +0000

Tendencias y desarrollos futuros

Mejoras en la experiencia del desarrollador
Aumento del uso de utilidades CSS
Web Components y Micro Frontends
Mejoras en la seguridad y la privacidad
Aumento del uso de tecnologías sin servidor
Rendimiento y optimización

1. Mejoras en la experiencia del desarrollador

API Composition
Integraciones sólidas con TypeScript
Expansión de las capacidades de Vite

2. Aumento del uso de utilidades CSS

Popularidad de las bibliotecas de utilidades CSS
Nuevas herramientas y características complementarias
Plugin JIT (Just-In-Time) de TailwindCSS

3. Web Components y Micro Frontends

Componentes reutilizables y aislados
Integraciones y compatibilidad mejoradas
Funcionamiento en diferentes frameworks y aplicaciones

4. Mejoras en la seguridad y la privacidad

Herramientas y prácticas relacionadas con la seguridad
Aplicación de las mejores prácticas de seguridad en proyectos

5. Aumento del uso de tecnologías sin servidor

Arquitecturas sin servidor y funciones como servicio (FaaS)
Integración en proyectos con Vue3, TypeScript y TailwindCSS

6. Rendimiento y optimización

Mejoras y actualizaciones en las herramientas de optimización de rendimiento
Aplicación en proyectos con Vue3, TypeScript y TailwindCSS

Mantenerse actualizado y adaptarse a los cambios

Seguir blogs, podcasts, conferencias y redes sociales relevantes
Participar en comunidades en línea y contribuir a proyectos de código abierto
Estar atento a las actualizaciones y noticias en el ecosistema

Introducción a Typescript: ¿Huir o Abrazarlo con Pasión?"

Samuel — Thu, 20 Apr 2023 05:39:15 +0000

¿Qué es TypeScript y por qué utilizarlo?

TypeScript es un lenguaje de programación de código abierto desarrollado por Microsoft que extiende JavaScript al agregar tipos estáticos. Facilita la detección de errores en tiempo de desarrollo y mejora la legibilidad y autocompletado del código.

Ventajas de TypeScript sobre JavaScript

Tipos estáticos: Ayudan a prevenir errores en tiempo de ejecución
Herramientas de desarrollo mejoradas: Autocompletado, refactorización y navegación más sólidos
Características modernas de JavaScript: Incluye características de ECMAScript recientes y propuestas
Orientación a objetos más sólida: Clases, interfaces, herencia y otros conceptos de OOP

Tipos primitivos (string, number, boolean, null, undefined, symbol)

Los tipos primitivos, también conocidos como tipos básicos o tipos fundamentales, son los bloques de construcción básicos de un lenguaje de programación. Estos tipos representan valores simples que no están compuestos por otros valores o estructuras de datos más complejas. Los tipos primitivos suelen incluir:

Number: representa números, tanto enteros como decimales (por ejemplo, 42, -3, 3.14). En JavaScript y TypeScript, todos los números se representan como números de coma flotante de doble precisión según el estándar IEEE 754.
String: representa secuencias de caracteres, es decir, texto (por ejemplo, "hola", "abc123"). Los strings pueden ser delimitados por comillas simples (''), comillas dobles ("") o acentos graves (``) en JavaScript y TypeScript.
Boolean: representa valores verdaderos o falsos (por ejemplo, true, false). Este tipo se utiliza comúnmente para representar condiciones, resultados de comparaciones o estados binarios.
Null: representa un valor nulo, es decir, una referencia que no apunta a ningún objeto o valor. En JavaScript y TypeScript, null es un tipo primitivo y un valor especial que indica que una variable no tiene ningún valor o referencia.
Undefined: representa un valor que no ha sido asignado o definido. En JavaScript y TypeScript, undefined es un tipo primitivo y un valor especial que indica que una variable ha sido declarada pero no se le ha asignado un valor.

En TypeScript, además de los tipos primitivos mencionados, existen dos tipos básicos adicionales:

Symbol: representa valores únicos e inmutables que pueden ser utilizados como identificadores para propiedades de objetos.
BigInt: representa números enteros de precisión arbitraria. Este tipo permite trabajar con números enteros más grandes que el límite superior de los números de tipo number.

`typescript var s = "JavaScript syntax highlighting"; alert(s); `

Ejemplos prácticos de uso de tipos primitivos

`typescript var s = "JavaScript syntax highlighting"; alert(s); `

`javascript
let nombre: string = "Juan";\
let edad: number = 30;\
let casado: boolean = false;\
let indefinido: undefined;\
let nulo: null = null;

function saludo(nombre: string): string {\
return Hola, ${nombre}!;\
}

console.log(saludo(nombre)); // Hola, Juan
`

ver online este ejemplo

Ejemplo con Symbol

`typescript
const simboloNombre = Symbol("nombre");\
const simboloEdad = Symbol("edad");

const persona = {\

saludar: function () {\
console.log(Hola, mi nombre es ${this[simboloNombre]} y tengo ${this[simboloEdad]} años.);\
},\
};

persona.saludar(); // Hola, mi nombre es Juan y tengo 30 años.

// Las propiedades con símbolos no se muestran en un bucle for...in ni en Object.keys()\
for (const prop in persona) {\
console.log(prop);\
}\
// Output: saludar

console.log(Object.keys(persona)); // Output: [ 'saludar' ]
`

En este ejemplo, las propiedades nombre y edad del objeto persona usan símbolos como claves en lugar de strings. Esto garantiza que estas claves sean únicas y no entren en conflicto con otras propiedades que puedan tener el mismo nombre.

Ejemplo con BigInt

`typescript
const numeroGrande1: bigint = BigInt("123456789012345678901234567890");\
const numeroGrande2: bigint = BigInt("987654321098765432109876543210");

const suma: bigint = numeroGrande1 + numeroGrande2;\
const multiplicacion: bigint = numeroGrande1 * numeroGrande2;

console.log("Suma:", suma.toString()); // Suma: 1111111110111111111011111111100\
console.log("Multiplicación:", multiplicacion.toString());\
// Multiplicación: 12193263113702179522496570642228279470
`

En este ejemplo, creamos dos números BigInt a partir de strings que contienen números enteros muy grandes. Luego realizamos operaciones de suma y multiplicación con estos números BigInt. Con BigInt, podemos trabajar con números enteros más grandes que el límite superior de los números de tipo number sin perder precisión.

Interfaces y tipos personalizados

Una interfaz en TypeScript es una estructura que define la forma de un objeto, es decir, el conjunto de propiedades y métodos que un objeto debe tener.

Las interfaces en TypeScript se crean utilizando la palabra clave interface seguida del nombre de la interfaz. Las interfaces pueden contener declaraciones de propiedades, métodos y también pueden ser extendidas o implementadas por otras interfaces y clases.

`typescript
interface Persona {\
nombre: string;\
edad: number;\
casado?: boolean;\
saludar: () => string;\
}

const juan: Persona = {\
nombre: "Juan",\
edad: 30,\
saludar: function () {\
return Hola, soy ${this.nombre} y tengo ${this.edad} años. ${this.casado ? 'Estoy casado' : 'Estoy Soltero'};\
},\
};

console.log(juan.saludar()); // "Hola, soy Juan y tengo 30 años. Estoy Soltero"
Los tipos personalizados se crean utilizando la palabra clave type`, seguida del nombre del tipo y la definición del mismo. Estos tipos te permiten especificar estructuras de datos más complejas y darles un nombre semántico, lo que mejora la legibilidad y la organización del código.

Los tipos personalizados también pueden representar uniones de tipos, alias de tipos primitivos y tipos más complejos, como funciones y tuplas. Por ejemplo:

`typescript type ID = string | number;\ type Callback = (error: Error | null, data: any) => void;\ type Punto3D = [number, number, number]; `

¿Debería estar usando Typescript ya?

Yo creo que sí, pero la respuesta no se tan sencilla como parece. Te pongo algunos ejemplos donde usar Typescript es una ventaja clara.

Ventajas de usar Typescript

Detección de errores: TypeScript verifica los tipos de datos en tiempo de compilación, lo que ayuda a detectar errores antes de que el código se ejecute en tiempo de ejecución. Si copias y pegas código de un sitio a otro y hay problemas de tipo, TypeScript te alertará sobre estos problemas antes de que se conviertan en errores difíciles de encontrar en tiempo de ejecución.
Mejora la colaboración entre equipos: TypeScript proporciona una forma explícita de definir las estructuras de datos y las expectativas de tipos en el código. Esto facilita la comprensión y la colaboración en el código escrito por otros equipos, ya que los desarrolladores pueden ver rápidamente cómo deben interactuar con las funciones y objetos proporcionados por otros equipos.
Navegación y refactorización en proyectos grandes: TypeScript mejora la navegación y refactorización en proyectos grandes al proporcionar información de tipo detallada y herramientas de análisis estático. Las herramientas de desarrollo integradas en los editores de código (como Visual Studio Code) pueden aprovechar esta información de tipo para proporcionar sugerencias de código, saltos a definiciones, cambios de nombre globales y otras características que facilitan la navegación y la modificación del código en proyectos grandes y complejos.
Integración con frameworks y bibliotecas: TypeScript es compatible con muchas bibliotecas y frameworks populares de JavaScript, como React, Angular y Vue. Los archivos de declaración de tipo (archivos .d.ts) proporcionados por estos proyectos permiten a los desarrolladores utilizar TypeScript para aprovechar la verificación de tipos, la autocompletión de código y otras características útiles al trabajar con estas bibliotecas y frameworks.
Desarrollo de aplicaciones escalables: TypeScript es especialmente útil en proyectos de software grandes y a largo plazo que requieren escalabilidad y mantenibilidad. El sistema de tipos de TypeScript y las características de lenguaje adicionales (como interfaces, clases y decoradores) permiten a los desarrolladores crear aplicaciones modulares y bien estructuradas que son más fáciles de mantener y ampliar a lo largo del tiempo. Esto es especialmente útil en aplicaciones empresariales y proyectos de código abierto con muchos colaboradores.

Desventajas de implementar Typescript

Aunque TypeScript ofrece muchas ventajas, también hay algunas desventajas o desafíos potenciales al implementarlo en un proyecto. Algunas de estas desventajas incluyen:

Curva de aprendizaje: TypeScript agrega un conjunto adicional de características y conceptos a JavaScript, lo que significa que los desarrolladores que no estén familiarizados con TypeScript tendrán que aprender estos conceptos antes de poder trabajar de manera efectiva en un proyecto que lo utilice.
Tiempo de compilación: TypeScript requiere un paso de compilación adicional para convertir el código TypeScript en JavaScript antes de que pueda ejecutarse en un navegador o entorno de Node.js. Este paso de compilación puede aumentar el tiempo de desarrollo y construcción, especialmente en proyectos grandes.
Integración con bibliotecas y frameworks: Aunque TypeScript es compatible con la mayoría de las bibliotecas y frameworks populares de JavaScript, puede haber casos en los que una biblioteca o un framework no tenga tipos de TypeScript disponibles o estén desactualizados. Esto puede requerir que los desarrolladores creen sus propias definiciones de tipos o trabajen con tipos menos precisos, lo que puede aumentar la complejidad y el tiempo de desarrollo.
Verbosidad: El uso de tipos explícitos y anotaciones de tipo en TypeScript puede hacer que el código sea más largo y posiblemente más difícil de leer en comparación con el código JavaScript puro. Los desarrolladores pueden necesitar tiempo para adaptarse a este estilo de codificación y encontrar un equilibrio adecuado entre la precisión de los tipos y la legibilidad del código.
Adopción en el equipo: Si trabajas en un equipo con desarrolladores que no están familiarizados con TypeScript, puede haber resistencia a la adopción de TypeScript debido a la curva de aprendizaje y la preocupación por la compatibilidad con las herramientas y bibliotecas existentes.

En general, es importante sopesar las ventajas y desventajas de implementar TypeScript en función de las necesidades específicas de tu proyecto y equipo. Si las ventajas en términos de seguridad de tipos, escalabilidad y mantenibilidad superan los desafíos y las desventajas potenciales, entonces TypeScript puede ser una adición valiosa a tu proyecto.

¿Soy principiante, qué debo aprender antes Typescript o Javascript?

JavaScript es el lenguaje base sobre el que se construye TypeScript, por lo que comprender los fundamentos de JavaScript te permitirá aprender TypeScript de manera más efectiva. Conocer las estructuras de control, funciones, objetos y otros conceptos básicos de JavaScript es esencial para cualquier desarrollador web.

No obstante, puesto que Typescript está basado en Javascript, puedes aprender puedes aprender los principios básicos de Javascript en el entorno de Typescript.

Este código es valido en Javascript y en Typescript por ejemplo

`typescript let nombre = "Juan";\ let edad = 30;\ let casado = false;\ let indefinido;\ let nulo = null;\ let simbolo = Symbol("descripcion");\ function saludo(nombre) {\ return `Hola, ${nombre}!`;\ }\ console.log(saludo(nombre)); // Hola, Juan `

DEV Community: Samuel

Cursor Ai: Gracias, pero no gracias.. todavía

Por qué no estoy usando Cursor AI... todavía

Renderización Dinámica de Componentes en Vue 3 y Nuxt 3: Guía Práctica y Caso Real

Componentes dinámicos en Vue y Nuxt: Guía Práctica y Caso Real

Configuración Básica

Uso de Componentes Dinámicos en Plantillas

Explicación Técnica

Beneficios de los Componentes Dinámicos

Ejemplo en un Caso Real

Conclusión

¡Adiós Options API, Hola Script Setup! La no tan nueva forma de programar en Vue 3

Options API

Composition API

Diferencias

Script Setup

Ventajas de Script Setup

Conclusión

Revoluciona tu desarrollo web: Descubre las tendencias emergentes en Vue3, TypeScript y TailwindCSS

Tendencias y desarrollos futuros

1. Mejoras en la experiencia del desarrollador

2. Aumento del uso de utilidades CSS

3. Web Components y Micro Frontends

4. Mejoras en la seguridad y la privacidad

5. Aumento del uso de tecnologías sin servidor

6. Rendimiento y optimización

Mantenerse actualizado y adaptarse a los cambios

Introducción a Typescript: ¿Huir o Abrazarlo con Pasión?"

¿Qué es TypeScript y por qué utilizarlo?

Ventajas de TypeScript sobre JavaScript

Tipos primitivos (string, number, boolean, null, undefined, symbol)

Ejemplos prácticos de uso de tipos primitivos

Interfaces y tipos personalizados

¿Debería estar usando Typescript ya?

Ventajas de usar Typescript

Desventajas de implementar Typescript

¿Soy principiante, qué debo aprender antes Typescript o Javascript?

Conclusión - Abrazarlo, con pasión moderada!