Aprendendo React do Zero, Conectando Back e Front End, e Consumindo API

Este vídeo é um guia completo para quem quer aprender React do zero. Você verá como construir uma aplicação prática, um cadastro de usuários [00:06:37], e o mais importante: como conectar essa aplicação front-end com um back-end (API) [00:00:13]. A aula cobre desde a criação do projeto até o consumo de uma API real.

O que você vai aprender

• Como iniciar um projeto React do zero usando a ferramenta Vite [00:02:46].
• A estrutura de pastas e arquivos de um projeto React, incluindo o package.json e o index.html [00:03:41].
• O que são componentes React e como funciona o JSX (mistura de HTML e JavaScript) [00:06:02], [00:09:11].
• Como organizar o projeto em pastas (Pages, Services, Assets) [00:12:37].
• Estilização com CSS, tanto globalmente (index.css) quanto por componente [00:09:52].
• Como renderizar listas de dados dinamicamente usando o método .map() e a importância da prop key [00:25:01], [00:28:22].
• O que são Hooks do React e como usar os principais:
  • useState: Para gerenciar estados e fazer a tela reagir a mudanças [00:54:43].
  • useEffect: Para executar efeitos colaterais, como buscar dados na API assim que a página carrega [00:48:18].
  • useRef: Para pegar referências de elementos da tela, como os valores de inputs de um formulário [00:59:51].
• Como usar a biblioteca axios para se comunicar com um back-end [00:41:42].
• Realizar requisições HTTP (GET para buscar usuários [00:47:08], POST para criar [01:04:02] e DELETE para deletar [01:08:17]).
• Como resolver problemas comuns de CORS no back-end para permitir a comunicação [00:51:00].

Pré-requisitos

• Conhecimento básico de HTML, CSS e JavaScript [00:01:20].
• Ter o Node.js e o NPM instalados [00:01:52].
• (Opcional) Ter assistido à aula anterior onde o back-end foi criado [00:00:20].

Para quem é este curso

Desenvolvedores iniciantes que querem aprender React de forma prática e entender o fluxo completo de comunicação (full stack) entre um front-end e uma API.