React + Typescript
Cómo tipar las propiedades de React usando Typescript
React + TypeScript
Un gran beneficio de pasar de JavaScript a TypeScript con React, es el de poder definir un contrato tipado de las propiedades que expone cada componente.
Esto lo cubría en cierta manera React con sus prop types pero ésta es una solución limitada que además añade peso extra a tu bundle.
Temario
1. Tipado básico de un componente
En este vídeo vamos a ver como usar TypeScript para definir tus propiedades.
2. Tipando funciones como propiedades de un componente
Pasar propiedades del tipo cadena de texto o un objeto está chupado con React, pero... ¿Y si queremos pasar una propiedad de tipo función? Esto es muy normal si por ejemplo queremos que un componente padre pueda capturar el evento onChange o el onClick de un componente hijo.
3. Propiedades opcionales de un componente
Otro tema interesante a tener en cuenta es que no siempre queremos informar todas las propiedades que pida un componente hijo, algunas pueden ser opcionales, y en otros podemos querer alimentar valores por defecto.
Vamos a ver como podemos tratar ésto con TypeScript.
¿Te apuntas a nuestro máster?
Si te ha gustado este ejemplo y tienes ganas de aprender Front End guiado por un grupo de profesionales ¿Por qué no te apuntas a nuestro Máster Front End Online Lemoncode? Tenemos tanto edición de convocatoria con clases en vivo, como edición continua con mentorización, para que puedas ir a tu ritmo y aprender mucho.