Visão Geral

Este curso ensina como usar React JS com TypeScript para criar aplicações mais seguras, escaláveis e robustas. Você aprende desde os fundamentos do TypeScript até a construção de componentes tipados, garantindo mais qualidade e produtividade no desenvolvimento.

Objetivo

Após realizar este curso, você será capaz de:

• Usar TypeScript dentro de projetos React com confiança
• Tipar componentes, props, estados e eventos
• Criar interfaces e tipos reutilizáveis
• Trabalhar com Hooks tipados
• Evitar erros comuns e melhorar a manutenção do código
• Desenvolver aplicações React com arquitetura mais robusta

Publico Alvo

• Devs que já conhecem React básico
• Estudantes que querem migrar do JavaScript para TypeScript
• Pessoas que desejam escrever código mais seguro e previsível
• Quem busca melhorar a arquitetura de aplicações React

Pre-Requisitos

• React básico (componentes, props, hooks)
• JavaScript intermediário
• Noções iniciais de TypeScript são bem-vindas, mas não obrigatórias

Conteúdo Programatico

Module 1: TypeScript for React Developers

1. Why TypeScript matters
2. Basic types recap
3. Type inference
4. Interfaces vs types

Module 2: Setting Up React with TypeScript

1. Creating a project with TypeScript template
2. Understanding tsconfig
3. File structure in TypeScript projects
4. Common compiler options

Module 3: Typing Components

1. Typing functional components
2. Props with interfaces and type aliases
3. Optional and default props
4. Reusable prop types

Module 4: Typing Hooks

1. Typing useState
2. Typing useEffect dependencies
3. Typing useRef for DOM and values
4. Custom hooks with generics

Module 5: Event and Form Typing

1. Event types in React
2. Typing inputs and form handlers
3. Preventing common event mistakes
4. Best practices for form logic

Module 6: Working with Arrays, Lists and Maps

1. Typing arrays of objects
2. Rendering typed lists
3. Keys and UI patterns
4. Generic list structures

Module 7: API Integration with TypeScript

1. Typing fetch responses
2. Creating API interfaces
3. Handling loading and error states safely
4. Ensuring type-safe data flow

Module 8: Context API with TypeScript

1. Typing context values
2. Creating Provider and custom hooks
3. Safe global state patterns
4. Combining context + reducers

Module 9: Advanced Typing Patterns

1. Generics in React components
2. Utility types (Partial, Pick, Omit, Record)
3. Discriminated unions
4. Composition patterns with TypeScript

Module 10: Practical Project – Typed React App

1. Planning a TypeScript-friendly architecture
2. Building components with strong typing
3. Managing state and API calls
4. Reviewing, refactoring and deploying