50h

Para conclusão

5
Cursos
1
Podcast
6
Artigos
O que você vai aprender nesta Formação?

React com TypeScript

O que é o React?

O React é a biblioteca JavaScript mais popular em desenvolvimento Front-End na atualidade. O que faz esta biblioteca ser tão amada é que ela traz uma maneira simplificada para a criação de interfaces de usuário, além de possibilitar uma atualização e renderização eficientes dos componentes necessários à medida que os dados mudam.

Como o React surgiu?

Surgiu da dificuldade do time do Facebook em sincronizar os diversos eventos que ocorriam ao mesmo tempo na tela da rede social (pop-ups, chat, lista de amigos etc), porque a lógica ficava muito complexa para fazer a página atualizar todos os elementos simultaneamente. O que começou a ser resolvido mais tarde com o gerenciamento (alteração) de estado.

Como o React funciona?

O React trabalha de forma declarativa e flexível, possibilitando a criação de interações complexas.

O que é Styled Components e Recoil?

Ambas são bibliotecas que beneficiam o trabalho com React, enquanto com a primeira é possível fazer CSS no JavaScript (CSS-in-JS), a segunda se trata é para o gerenciamento de estados.

Como o React melhora com o Typescript?

Somado ao TypeScript, a pessoa desenvolvedora consegue otimizar o seu código, identificando e prevenindo erros durante o desenvolvimento, além de possuir uma flexibilidade maior para trabalhar com tipagem.

Quais conhecimentos ter para aprender React?

Antes de mergulhar no mundo React, é importante ter conhecimento em HTML, CSS, JavaScript e TypeScript. Conhecer Git e versionamento de código também será muito valioso para aproveitar a formação.

Por que estudar esta formação?

  • Guia de aprendizado

    Conteúdos pensados para facilitar seu estudo

  • Do básico ao avançado

    Formação completa para o mercado

  • Você dentro do mercado

    Do zero ao sonhado emprego em sua área de interesse

Comece essa formação agora mesmo e capacite-se para seu próximo projeto!

Conheça os planos

Com quem você vai aprender?

  • Vinicios Neves

    Vinicios Neves, Tech Lead e Educador, mistura código e didática há mais de uma década. Especialista em TypeScript, lidera equipes full-stack em Portugal e inspira futuros desenvolvedores na FIAP e Alura. Com um pé no código e outro no ensino, ele prova que a verdadeira engenharia de software vai além das linhas de código. Além de, claro, ser senior em falar que depende.

  • Vinicios Neves

    Vinicios Neves, Tech Lead e Educador, mistura código e didática há mais de uma década. Especialista em TypeScript, lidera equipes full-stack em Portugal e inspira futuros desenvolvedores na FIAP e Alura. Com um pé no código e outro no ensino, ele prova que a verdadeira engenharia de software vai além das linhas de código. Além de, claro, ser senior em falar que depende.

  • Neilton Seguins

    Sou graduado como Bacharel em Ciência e Tecnologia e em Engenharia Mecânica. Atuo como Instrutor de Desenvolvedor de Software na Alura e possuo experiência com desenvolvimento usando JavaScript/TypeScript, React js, Next js e Node.js. Amo compartilhar conhecimento, pois acredito que a educação é transformadora e quero mudar a vida de pessoas através da educação assim como consegui mudar de vida. Também amo ouvir e tocar música, ler livros e mangás e assistir séries.

  • Neilton Seguins

    Sou graduado como Bacharel em Ciência e Tecnologia e em Engenharia Mecânica. Atuo como Instrutor de Desenvolvedor de Software na Alura e possuo experiência com desenvolvimento usando JavaScript/TypeScript, React js, Next js e Node.js. Amo compartilhar conhecimento, pois acredito que a educação é transformadora e quero mudar a vida de pessoas através da educação assim como consegui mudar de vida. Também amo ouvir e tocar música, ler livros e mangás e assistir séries.

Passo a passo

  1. 1 Introdução ao Typescript no React

    No primeiro passo desta formação, você vai entender mais sobre o TypeScript e como configurá-lo em projetos. Explore os tipos mais utilizados como string, number, boolean entre outros, crie interfaces e generics e entenda os benefícios de usar o TypeScript em sua aplicação. Todos esses conceitos serão aplicados no contexto dos componentes do React.

  2. 2 Hooks, context API e gerenciamento de estados

    Neste passo, mergulhe de cabeça nos hooks e aprenda a tipá-los corretamente. Você vai dominar useState, useEffect, useContext e outros.

    Explore a Context API e TypeScript, entendendo como compartilhar dados entre componentes de forma organizada e previsível.

    Para completar, descubra como o Recoil muda a gestão de estados das suas aplicações.

    • Curso React com Typescript: aplique Hooks e Context API tipados

      10h
      • Aprenda como tipar hooks essenciais como useState, useRef, useContext e useImperativeHandler
      • Aplique utilitários do Typescript para criar novos tipos otimizados
      • Crie componentes avançados e acessíveis com Typescript
      • Realize a tipagem de funções assíncronas utilizando Axios e Typescript.
      • Entenda como tipar corretamente a Context API
      • Crie hooks customizados totalmente tipados garantindo a seguraça do seu código
      • Gerencie estados e centralize-os em um lugar com Context API

    • Curso React: gerenciando estado com Recoil

      08h
      • Projete uma boa solução de gestão de estado com Recoil
      • Entenda todas as vantagens do Recoil
      • Extraia a comunicação com o recoil em hooks
      • Implemente os principais hooks do Recoil
      • Compare diferentes soluções de mercado para gestão de estado

    • Artigo Qual o tipo de um React Hook? | Alura

    • Artigo Context API e TypeScript: guia prático para devs | Alura

  3. 3 Consumindo e tratando dados de APIs

    Neste passo, você vai aprender a integrar suas aplicações com APIs, enviando e recebendo dados. Crie hooks personalizados para lidar com requisições e organizar seu código de forma reutilizável e totalmente tipada.

    Para fechar com chave de ouro, conheça novos recursos do React como o hook use, que simplifica ainda mais o consumo de dados.

    • Curso React: integrando seu projeto React com APIs

      08h
      • Desenvolva a comunicação entre uma aplicação React e uma API REST
      • Implemente hooks para buscar dados em uma API
      • Utilize o axios para realizar requisições HTTP
      • Avalie as informações da resposta da API
      • Integre o frontend ao backend
      • Descreva o funcionamento de uma API a partir do Swagger

    • Artigo O que é o Docker e quais as Vantagens de usá-lo? | Alura

  4. 4 1, 2, 3, testando!

    Neste passo, você vai aprender a escrever testes automatizados para suas aplicações React, utilizando o TypeScript para trazer ainda mais segurança e clareza ao processo.

    Vamos explorar ferramentas como Jest e React Testing Library, garantindo que seus componentes e hooks funcionem como esperado.

    E mais: descubra como tipar corretamente seus testes, trabalhar com mocks e aplicar boas práticas como o padrão AAA (Arrange, Act, Assert) e aplicar o TDD (Test Driven Development — desenvolvimento orientado a teste).

Escola

Front-end

Além dessa, a categoria Front-end conta com cursos de HTML, CSS, React, Angular, JavaScript, jQuery,e mais...

Conheça a Escola

Comece a estudar agora na maior escola de tecnologia do país

Conheça os Planos para Empresas

Cursos

Cursos de Programação
Lógica | Python | PHP | Java | .NET | Node JS | C | Computação | Jogos | IoT
Cursos de Front-end
HTML, CSS | React | Angular | JavaScript | jQuery
Cursos de Data Science
Ciência de dados | BI | SQL e Banco de Dados | Excel | Machine Learning | NoSQL | Estatística
Cursos de Inteligência Artificial
IA para Programação | IA para Dados
Cursos de DevOps
AWS | Azure | Docker | Segurança | IaC | Linux
Cursos de UX & Design
Usabilidade e UX | Vídeo e Motion | 3D
Cursos de Mobile
Flutter | iOS e Swift | Android, Kotlin | Jogos
Cursos de Inovação & Gestão
Métodos Ágeis | Softskills | Liderança e Gestão | Startups | Vendas

Cursos universitários FIAP

Graduação | Pós-graduação | MBA