Formação em

Pré-lançamento

formação_

Formação React com TypeScript

Aprenda a biblioteca mais usada em desenvolvimento Front-end

Esta formação faz parte dos nossos cursos de Front-end
65h

Para conclusão

6
Cursos
1
Vídeo extra
5
Artigos

Assista o vídeo

veja nossa apresentação da Formação e uma Alura Live sobre a Carreira em Front-end

Essa formação está em pré-lançamento! O que isso quer dizer? Uma formação em pré-lançamento indica que o time está trabalhando nela nesse exato momento.

Você já pode fazer os primeiros cursos dessa formação. Ela continuará a ser criada a partir do seu feedback no fim dos cursos e no nosso Discord.

React com TypeScript

O React é a biblioteca JavaScript mais popular em desenvolvimento Front-end na atualidade. O que faz essa 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. O React trabalha de forma declarativa e flexível, possibilitando a criação de interações complexas.

Somado ao TypeScript, a pessoa desenvolvedora consegue otimizar o seu código, identificando errros durante o desenvolvimento e tendo uma flexibilidade maior para trabalhar com tipagem.

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

Professores especializados Front-end

Com quem você vai aprender

  • Fábio Pimentel

    Fábio é desenvolvedor full-stack com foco em Android (Java e Kotlin) e Ruby on Rails, formado pela UFRJ. É ativo na comunidade, palestrou na CocoaHeads e na Mobile Conf.

  • Fábio Pimentel

    Fábio é desenvolvedor full-stack com foco em Android (Java e Kotlin) e Ruby on Rails, formado pela UFRJ. É ativo na comunidade, palestrou na CocoaHeads e na Mobile Conf.

  • Luiz Fernando Ribeiro

  • Luiz Fernando Ribeiro

  • Marcos Vinicios da Silva Neves

    Marcos é arquiteto de software, envolvido na arquitetura, design e implementação de microsserviços, micro frontends e sistemas distribuídos. Tem experiência significativas em aplicativos, integração e arquitetura corporativa. É Engenheiro de Software pela UNESA e Arquiteto de Software pela PUC Minas.

  • Marcos Vinicios da Silva Neves

    Marcos é arquiteto de software, envolvido na arquitetura, design e implementação de microsserviços, micro frontends e sistemas distribuídos. Tem experiência significativas em aplicativos, integração e arquitetura corporativa. É Engenheiro de Software pela UNESA e Arquiteto de Software pela PUC Minas.

Essa formação está em pré-lançamento. O que isso quer dizer? Uma formação em pré-lançamento indica que o time está trabalhando nela nesse exato momento.

Ao mesmo tempo você já pode fazer os primeiros cursos e conteúdo. Ela será criada a partir do seu feedback no fim dos cursos e no nosso Discord.

Passo a passo

  1. 1 Primeiro mergulho no React

    Aprenda a criar um projeto do zero com React e Typescript, utilizando props e state para aprender sobre componentização e boas práticas, evitando problemas de sobreposição de CSS com CSS Modules e refatorando class components para function components.

    Além disso, você irá aprender como lidar com arquivos estáticos no React. Comece criando um projeto do zero com Create React App, aprenda como utilizar pacotes como o classnames e entenda como o React lida com diferentes tipos de arquivos.

    • Curso Fundamentos de React: escrevendo com Typescript

      12h
    • Faça esse curso e:
      • Crie um projeto React com Typescript do zero com Create React App
      • Entenda conceitos de React como Componentização, Props e State
      • Evite sobreposições de CSS com CSS Modules
      • Aprenda sobre os hooks useState e useEffect e entenda como eles eram usados nos class components
      • Deixe seu código mais limpo e documentado com a forma mais atual de se escrever React
      • Desenvolva seu código com conceitos de boas práticas como DRY (Don't repeat yourself) e SRP (Single Responsibility Principle)
    • Artigo React Hooks: o que é e como eles funcionam | Alura Cursos Online

    • Artigo NPM vs Yarn | Alura Cursos Online

    • Curso React: lidando com arquivos estáticos

      10h
    • Faça esse curso e:
      • Crie um projeto do zero com Create React App
      • Aprenda a utilizar o normalize.css para resetar estilos padrões de navegadores
      • Configure absolute imports para não precisar mais importar arquivos com vários níveis ('../../../')
      • Aprenda boas práticas em CSS como criar variáveis, criar arquivos para estas variáveis e para breakpoints de media-queries
      • Utilize o pacote classnames para poder utilizar o CSS Modules sem precisar concatenar um monte de estilos CSS e lidar com estilos condicionais
      • Aprenda como utilizar o SVGR, um pacote que vem no Create React App para importar svgs como componentes React
      • Entenda como o React entende os imports estáticos tanto via arquivos .js quanto em arquivos de estilos como .scss ou .css. Aprenda como importar arquivos estáticos como variáveis via js ou utilizando a pasta public para imports dinâmicos de arquivos estáticos
  2. 2 Trabalhando com Rotas

    Veja como o React lida com a manipulação de rotas utilizando React Router. Você irá aplicar na prática conceitos dessa biblioteca que possibilita a navegação fluida do usuário no navegador quando trabalhamos com Single Page Applications.

  3. 3 Gerenciando estados

    Trazendo um exemplo próximo do dia a dia, aprenda como organizar a gestão de estado em uma aplicação React. Existem várias ferramentas disponíveis para isso, mas, nesse caso, utilizaremos o Recoil: uma das alternativas mais simples para a implementação de estados globais.

  4. 4 Hora de praticar

    Chegou o momento de colocarmos em prática tudo que você viu nessa formação. Montar o seu portfólio e fixar todo o conhecimento que adquiriu com os professores e professoras da Alura. Nesse próximo passo você encontrará uma atividade do #7DaysOfCode que foi pensada por pessoas do mercado para que você resolva desafios comuns em qualquer empresa que trabalha com tecnologia.

nossos alunos e alunas

Experiências de quem já mergulhou com a gente.

Ótimo curso, me surpreendeu bastante! Sou iniciante na área e me trouxe muito conhecimento e assuntos que não sabia.

HTTP: Entendendo a web por baixo dos panos

Vitória Mariano da Silva

Comece hoje mesmo os cursos de React com TypeScript. Matricule-se agora!

Plus

  • Acesso a TODOS os cursos da plataforma

    Mais de 1200 cursos completamente atualizados, com novos lançamentos todas as semanas, em Programação, Front-end, UX & Design, Data Science, Mobile, DevOps e Inovação & Gestão.

  • Alura Challenges

    Desafios temáticos para você turbinar seu portfólio. Você aprende na prática, com exercícios e projetos que simulam o dia a dia profissional.

  • Alura Cases

    Webséries exclusivas com discussões avançadas sobre arquitetura de sistemas com profissionais de grandes corporações e startups.

  • Certificado

    Emitimos certificados para atestar que você finalizou nossos cursos e formações.

  • Alura Língua (incluindo curso Inglês para Devs)

    Estude a língua inglesa com um curso 100% focado em tecnologia e expanda seus horizontes profissionais.

12X
R$85
à vista R$1.020
Matricule-se

Pro

  • Acesso a TODOS os cursos da plataforma

    Mais de 1200 cursos completamente atualizados, com novos lançamentos todas as semanas, em Programação, Front-end, UX & Design, Data Science, Mobile, DevOps e Inovação & Gestão.

  • Alura Challenges

    Desafios temáticos para você turbinar seu portfólio. Você aprende na prática, com exercícios e projetos que simulam o dia a dia profissional.

  • Alura Cases

    Webséries exclusivas com discussões avançadas sobre arquitetura de sistemas com profissionais de grandes corporações e startups.

  • Certificado

    Emitimos certificados para atestar que você finalizou nossos cursos e formações.

  • Alura Língua (incluindo curso Inglês para Devs)

    Estude a língua inglesa com um curso 100% focado em tecnologia e expanda seus horizontes profissionais.

12X
R$120
à vista R$1.440
Matricule-se
Conheça os Planos para Empresas

Acesso completo
durante 1 ano

Estude 24h/dia
onde e quando quiser

Novos cursos
todas as semanas