Primeiros Passos com React
Construindo aplicações web
Descrição do livro
Saia trabalhando de imediato com React: a tecnologia de código aberto do Facebook para construir rapidamente aplicações web sofisticadas. Com este livro, o desenvolvedor web Stoyan Stefanov ensina você a construir componentes – os blocos de construção básicos da React – e a organizá-los em aplicações de larga escala, viáveis do ponto de vista da manutenção. Se você tiver familiaridade com a sintaxe básica de JavaScript, estará pronto para começar.
Depois de entender como React funciona, você construirá uma aplicação personalizada Whinepad completa para ajudar os usuários a classificar vinhos e a guardar anotações. Você aprenderá rapidamente por que alguns desenvolvedores consideram React essencial para o quebra-cabeça que é o desenvolvimento de aplicações web.
Instale React e escreva sua primeira aplicação web “Hello world”.
Crie componentes React personalizados, usando-os juntamente com componentes DOM genéricos.
Construa um componente de tabela de dados que permita editar, ordenar, pesquisar e exportar seu conteúdo.
Utilize a extensão de sintaxe JSX como alternativa a chamadas de função.
Configure um processo de construção simples, de baixo nível, que ajude você a se concentrar na React.
Construa uma aplicação personalizada completa que permita armazenar dados no cliente.
Use as ferramentas ESLint, Flow e Jest para verificar e testar o seu código à medida que sua aplicação evoluir.
Administre a comunicação entre os componentes usando Flux.
Sumário
- Prefácio
- Capítulo 1 Hello World
- Instalação
- Hello World com a React
- O que aconteceu?
- React DOM *
- Atributos especiais do DOM
- Extensão de navegador React DevTools
- A seguir: componentes personalizados
- Capítulo 2 A vida de um componente
- O mínimo necessário
- Propriedades
- propTypes
- Valores default das propriedades
- Estado
- Um componente textarea com estado
- Uma observação sobre eventos do DOM
- Tratamento de eventos nos velhos tempos
- Tratamento de eventos na React
- Propriedades versus estado
- Propriedades no estado inicial: um antipadrão
- Acessando o componente de fora
- Alterando as propriedades durante a execução
- Métodos de ciclo de vida
- Exemplo de ciclo de vida: fazendo log de tudo
- Exemplo de ciclo de vida: usando uma mixin
- Exemplo de ciclo de vida: usando um componente-filho
- Ganho de desempenho: evitando atualizações de componentes
- PureRenderMixin
- Capítulo 3 Excel: um componente de tabela elegante
- Primeiro os dados
- Laço para cabeçalhos da tabela
- Depurando o aviso do console
- Adicionando o conteúdo de <td>
- Como podemos melhorar o componente?
- Ordenação
- Como podemos melhorar o componente?
- Pistas sobre ordenação na UI
- Editando dados
- Célula em que é possível editar
- Célula com campo de entrada
- Salvando
- Conclusão e diferenças com o DOM virtual
- Pesquisa
- Estado e UI
- Filtrando o conteúdo
- Como podemos melhorar a pesquisa?
- Reprodução instantânea
- Como podemos melhorar a reprodução?
- Uma implementação alternativa?
- Download dos dados da tabela
- Capítulo 4 JSX
- Hello JSX
- Transpilação do JSX
- Babel
- Lado do cliente
- Sobre a transformação de JSX
- JavaScript em JSX
- Espaço em branco no JSX
- Comentários no JSX
- Entidades HTML
- AntiXSS
- Propagação de atributos
- Propagação de atributos de pai para filho
- Devolvendo vários nós no JSX
- Diferenças entre JSX e HTML
- Sem class nem for
- style é um objeto
- Tags de fechamento
- Atributos camelCase
- JSX e formulários
- Handler onChange
- value versus defaultValue
- Valor de <textarea>
- Valor de <select>
- O componente Excel em JSX
- Capítulo 5 Preparando-se para o desenvolvimento de aplicações
- Uma aplicação boilerplate
- Arquivos e pastas
- index html
- CSS
- JavaScript
- JavaScript: modernizado
- Módulos
- Módulos ECMAScript
- Reunindo tudo
- Instalando os pré-requisitos
- Node js
- Browserify
- Babel
- React e outros pacotes
- Vamos fazer a construção
- Transpilar o JavaScript
- Empacotar o JavaScript
- Empacotar o CSS
- Resultados!
- Versão para Windows
- Construindo durante o desenvolvimento
- Implantação
- Prosseguindo
- Capítulo 6 Construindo uma aplicação
- Whinepad v 0.0.1
- Configuração
- Comece a programar
- Os componentes
- Configuração
- Descoberta
- Componente <Button>
- Button css
- Button js
- Formulários
- <Suggest>
- Componente <Rating>
- Uma “factory” <FormInput>
- <Form>
- <Actions>
- Diálogos
- Configuração da aplicação
- <Excel>: novo e melhorado
- <Whinepad>
- Concluindo
- Whinepad v 0.0.1
- Capítulo 7 Lint, Flow, testar, repetir
- package json
- Configure o Babel
- scripts
- ESLint
- Configuração
- Execução
- Todas as regras
- Flow
- Configuração
- Execução
- Inscrevendo-se para verificação de tipos
- Corrigindo <Button>
- app js
- Mais sobre verificação de tipos em propriedades e no estado
- Exportação/importação de tipos
- Casting de tipo
- Invariantes
- Testes
- Configuração
- Primeiro teste
- Primeiro teste com a React
- Testando o componente <Button>
- Testando <Actions>
- Mais interações simuladas
- Testando interações completas
- Cobertura
- package json
- Capítulo 8 Flux
- A grande ideia
- Analisando o Whinepad novamente
- A Store
- Eventos da Store
- Usando a Store em <Whinepad>
- Usando a Store em <Excel>
- Usando a Store em <Form>
- Definindo o limite
- Actions
- CRUDActions
- Pesquisando e ordenando
- Usando Actions em <Whinepad>
- Usando Actions no <Excel>
- Recapitulando o Flux
- Imutável
- Dados imutáveis na Store
- Manipulação de dados imutáveis
Sobre o autor
Stoyan Stefanov é engenheiro do Facebook. Anteriormente na Yahoo ,ele criou a smush.it – uma ferramenta de otimização de imagens online – e foi arquiteto da ferramenta de desempenho YSlow 2.0. Stoyan é autor de Padrões JavaScript (Novatec) e Object-Oriented JavaScript (O’Reilly), além de ser blogueiro (phpied.com) e palestrante frequente… Ver perfil completo ▶
Livros relacionados
Recursos
Opinião dos leitores
Bruno G
O livro explica o assunto, mas não é muito didático.
Angel A G M
Bom livro, um pouco desatualizado, mas bom.
Claudio A
Comprei o livro pelo comentário do Isvaldo, e concordo plenamente, livro perfeito para quem está inseguro no desenvolvimento React com o ambiente frontend e Node! É um livro para ler e praticar.
Adriano A C
Muito bom o livro, possui uma didática fácil e completa, vale muito a pena para quem está começando com ReactJS.