Manual React

1. Conceitos Básicos

• React: Biblioteca JavaScript para construir interfaces de usuário (UI) reativas e componentes reutilizáveis.
• JSX: Sintaxe parecida com HTML dentro do JavaScript.

const elemento = <h1>Olá, mundo!</h1>;

• Componentes: Blocos reutilizáveis da interface. Podem ser:
  • Funcionais: Baseados em funções.
  • Classe: Baseados em classes (menos usados hoje).

2. Criando Projeto React

• Usando Vite (mais moderno e rápido):

npm create vite@latest meu-app
cd meu-app
npm install
npm run dev

• Usando Create React App:

npx create-react-app meu-app
cd meu-app
npm start

3. Componentes Funcionais

import React from "react";

function MeuComponente() {
  return <h1>Olá, React!</h1>;
}

export default MeuComponente;

• Props: Parâmetros passados para componentes.

function Saudacao({ nome }) {
  return <p>Olá, {nome}!</p>;
}

// Uso
<Saudacao nome="Phelipe" />

4. State (Estado)