Curso de React | Typescript en React

Por 9.99€ al mes tendrás acceso completo a todos los cursos. Sin matrícula ni permanencia.

Documentación oficial

Permite añadir tipos de datos a nuestras variables y constantes.

Un fichero que use typescript debe tener extensión ts. Si es un componente, debe tener extensión tsx.

Añadir Typescript a un proyecto de Vite existente

npm i typescript @types/react @types/react-dom @types/node

/tsconfig.json

while(premium == false) verCodigo = false;

Para poder ver el código fuente, accede o suscríbete.

Suscríbete

/src/vite-env.d.ts

while(premium == false) verCodigo = false;

Para poder ver el código fuente, accede o suscríbete.

Suscríbete

Declaración de tipos

Tipado básico

while(premium == false) verCodigo = false;

Para poder ver el código fuente, accede o suscríbete.

Suscríbete

Funciones

while(premium == false) verCodigo = false;

Para poder ver el código fuente, accede o suscríbete.

Suscríbete

Trabajo con indefinidos

while(premium == false) verCodigo = false;

Para poder ver el código fuente, accede o suscríbete.

Suscríbete

Funciones que pueden recibir indefinidos:

while(premium == false) verCodigo = false;

Para poder ver el código fuente, accede o suscríbete.

Suscríbete

o

const hacerCosas = (libro?: Libro) => 

Tipos

Aunque podemos declararlos en el propio fichero donde los usemos, es recomendable declararlos en módulo dedicado a la descripción del dominio (en nuestro caso common/types/Classroom.ts ).

while(premium == false) verCodigo = false;

Para poder ver el código fuente, accede o suscríbete.

Suscríbete

A parte de Vanilla.js

A tener en cuenta en React:

Estados:

const [userId, setUserId] = useState<string>(null);

Props:

const BookC = ({ book, renderBooks, children }: { book: Book, renderBooks: () => void, children:React.ReactNode }) => {

Los ficheros ts tendrán código typescript, mientras que los ficheros tsx tendrán código typescript y jsx.

Context API:

while(premium == false) verCodigo = false;

Para poder ver el código fuente, accede o suscríbete.

Suscríbete

Trabajando con Firebase

while(premium == false) verCodigo = false;

Para poder ver el código fuente, accede o suscríbete.

Suscríbete

Por 9.99€ al mes tendrás acceso completo a todos los cursos. Sin matrícula ni permanencia.