Tutorial Principal de React

Introdução Instalação do React Conexão do plugin react-devtools Abordagem de Componentes Layout do Site Resultado do Trabalho do Componente

A linguagem JSX

Introdução ao JSX Retornando tags aninhadas Quebrando uma tag para baixo Retornando várias tags Retornando uma tag não fechada Retornando uma tag vazia com uma função Inserindo valores de variáveis Nuances ao inserir variáveis Inserindo arrays Inserindo objetos Inserindo em atributos Armazenando tags em JSX Armazenando várias tags Tags em linhas diferentes Retornando tags Tags JSX fechadas Correção da marcação Executando código JavaScript

Condições

Condições no JSX Mostrar por condição Condições para retornar uma tag Operador ternário no JSX Usando o operador && no JSX Invertendo para condições abreviadas

Funções

Usando funções Chamando funções dentro de tags Anexando manipuladores Parâmetros do manipulador Objeto Event Objeto Event ao passar parâmetros

Formação de Tags

Array de Tags Array de Tags em Loop Tags de Array com Dados Chaves em Array Array de Objetos Chaves Únicas via ID Tabela de Array de Objetos

Id exclusivos

Discussão Problemas com novos id Strings aleatórias para id Geração de id Função para geração de id Usando a função de id Uso incorreto da função

Estados

Introdução aos Estados Utilização Reatividade Valor Booleano no Estado Contador ao Trabalhar com Estados

Formulários

Trabalhando com inputs Modificando dados de input na saída Modificando dados usando uma função Trabalhando com múltiplos inputs Processamento de dados do formulário Trabalhando com textarea Trabalhando com checkboxes Checkboxes e renderização condicional Trabalhando com selects Itens do select a partir de um array Atributos value no select Atributos value do select a partir de um array Trabalhando com radio Valores padrão Vinculando inputs a um array Vinculando inputs a um objeto

Dados

Introdução Adição reativa em array Operações reativas com arrays Adição reativa em array de objetos Operações reativas com arrays de objetos Exibição reativa de dados

Componentes

Introdução aos Componentes Usando Componentes Múltiplas Instâncias de Componente Props de Componentes Componentes Filhos Array para Criar Componentes Filhos Componentes Filhos em Loop Passando Estados para Componentes Filhos Passando id para um Componente Alterando o Estado do Pai Editando o Estado do Pai Editando o Estado do Avô Modos de Operação via Estados

Conceitos

Introdução Dados de componentes Tipos de componentes Fluxo unidirecional de dados Elevação de estado (Lifting State Up) Fonte única da verdade

Estilização

Métodos de Estilização no React CSS Global Inserindo dados no atributo style a partir de um objeto Inserindo dados no atributo style a partir de um arquivo separado Trabalhando com estilos CSS no atributo style Inserindo dados no atributo style a partir de variáveis Styled Components Props em Styled Components Props e renderização condicional em Styled Components Componentes com estilos estendidos Começando com CSS Modules Continuando com CSS Modules Comando composes para classes Comando composes para arquivos

Projetos

Lista de Verificação Bloco de Notas
Português
AfrikaansAzərbaycanБългарскиবাংলাБеларускаяČeštinaDanskDeutschΕλληνικάEnglishEspañolEestiSuomiFrançaisहिन्दीMagyarՀայերենIndonesiaItaliano日本語ქართულიҚазақ한국어КыргызчаLietuviųLatviešuМакедонскиMelayuမြန်မာNederlandsNorskPolskiRomânăРусскийසිංහලSlovenčinaSlovenščinaShqipСрпскиSrpskiSvenskaKiswahiliТоҷикӣไทยTürkmenTürkçeЎзбекOʻzbekTiếng Việt
Nós usamos cookies para o funcionamento do site, análises e personalização. O processamento de dados é realizado de acordo com a Política de Privacidade.
aceitar todas configurar rejeitar