Aula 06
Configuração do Provider do React Redux
Summary
## Resumo do Transcript
Neste vídeo, o apresentador solicita apoio para continuar produzindo conteúdo e convida os espectadores a se inscreverem no seu canal do YouTube, bem como a segui-lo no Twitter e GitHub.
### Conexão do Redux no Aplicativo
1. **Instalação do ReactRedux**:
- O apresentador está no arquivo `app.js` e menciona que precisa conectar o Redux ao aplicativo.
- Anuncia a instalação do módulo `ReactRedux` do npm usando o comando:
```
npm install --save react-redux
```
2. **Instalação do Redux**:
- Também menciona a necessidade de instalar o módulo `Redux`, utilizando:
```
npm install --save redux
```
- Após essas instalações, ambos os módulos são adicionados como dependências no `package.json`.
3. **Uso do Provider**:
- O apresentador volta para o arquivo `app.js` para importar o componente `Provider` do `ReactRedux`.
- Explica que o `Provider` é um "componente de alta ordem" que permite estender as funcionalidades de um componente.
- O componente principal (neste caso, `Vio`) deve ser colocado dentro do `Provider`.
- O `Provider` é responsável por injetar a Store do Redux, que será passada como uma propriedade chamada `store`.
### Conclusão
O vídeo mostra o processo de integração do Redux com um aplicativo React, enfocando a importância do `Provider` na disponibilização da Store.
Video Transcript
Antes de continuar, eu gostaria de contar com seu apoio para continuar fazendo vídeos.
Por favor, se inscreva no canal, NBK Tutor no YouTube.
E também estou no Twitter e no GitHub com o usuário NBK-HOPE, NBK Hope.
Tá bom? Vamos continuar agora.
Vou voltar aqui. Agora a gente tem que disponibilizar o Redux dentro do nosso aplicativo.
Eu estou no app.js. Então, a gente escreveu esse Action Creator para fazer um pedido à HTTPS para pegar todos os posts.
Mas ainda não temos o Redux conectado.
Para fazer isso, a gente tem que contar com um módulo chamado ReactRedux.
É o npm, módulo do npm, chamado ReactRedux.
Eu vou instalá-lo, vou dar npm, install, dash dash save, react redux.
React dash redux.
Esse é o módulo que permite a gente conectar o React com o Redux.
Vou morar um pouquinho, mas vai ser adicionado ao nosso package.json como uma dependência.
ReactRedux.
Agora, vamos continuar.
Ah, esqueci também do Redux.
Tenho que instalar o Redux. Deu um warning aqui.
Então, npm, install save Redux.
Instala o módulo do Redux.
Morar um pouquinho, vai aparecer nas dependências.
Instala o Redux e instala o ReactRedux.
Quase lá.
Tudo ok agora?
Temos o Redux e temos o ReactRedux no nosso package.json.
Agora, se podemos continuar, vou voltar para o app.js.
E o que eu vou fazer?
Eu vou importar aqui.
Dá um import.
Esse componente chamado provider do ReactRedux.
Tá bom?
Então, esse provider é um componente de alta ordem.
Em inglês, a gente chama higher order component.
E esse higher order component é usado para você pegar um componente
e adicionar mais coisas ao componente.
A maneira que a gente faz isso, é usando componentes de alta ordem, higher order.
E da maneira que a gente faz isso, é só pôr qualquer componente dentro do provider.
Então, vou pôr provider e esse cara, o Vio, vou deixar dentro do provider.
Então, em inglês, a gente fala que o provider vai em REST, né?
O componente que é, nesse caso, a Vio.
Tá bom?
Então, o que é que vai acontecer?
O provider é uma maneira da gente injetar o Redux Store
para disponibilizar a Store dentro do aplicativo.
Então, tem um propriedade chamado Store.
E a maneira de criar a Store é com o Redux.
Nenhum comentário ainda (loading...)
Nenhum comentário ainda (loading...)
Gostou da aula? 😆👍
Apoie nosso trabalho com uma doação: