Redux do CONCEITO a PRÁTICA! Migrando Redux Antigo para Redux Toolkit (Tutorial)

Uma aula completa para você nunca mais ter dúvidas de como o Redux funciona. Do conceito a prática, passando pelo Redux Antigo até o Redux Toolkit.

O que você aprenderá nesse tutorial?

- Os principais conceitos exigidos para vagas de emprego. Entenderá o que é uma Action, um Reducer e um Store. Aprenderá os conceitos de dispatch e global state e como tudo isso se comunica no que chamadas de Data Flow do Redux.

- Como implementar o Redux em seu aplicativo ReactJS ou React Native. Verá primeiro o modo "antigo" com uso do HOC connect, e a realizar os famosos mapStateToProps e mapDispatchToProps.

- Substituir os items citados acima pelos hooks useSelector e useDispatch.

- Aprenderá a nova forma de usar a biblioteca, o Redux Toolkit, faremos isso através da migração do Redux Antigo implementado no passo anterior. Para isso usaremos as função createSlice e configureStore.

✅ VOCÊ TAMBÉM VAI GOSTAR DESSES VÍDEOS:

▸ Programador Sênior | O que Faz? Como se tornar um? (Dicas e Relato Pessoal)

▸React Query Tutorial em TypeScript - Queries, Mutations e Query Invalidation

▸ Playlist DICAS de CARREIRA

✅ REDES SOCIAIS:

Instagram: @coffstack

TikTok: @coffstack

Twitter: @coffstack

Blog/Artigos

Instagram: @lucasgar6

00:00 - Sumário da Aula
01:53 - O que é o Redux?
03:56 - Redux Data Flow
05:12 - Store, Action e Reducer
07:07 - Como o Redux Funciona (Data Flow)
10:00 - Redux Antigo - Iniciando Projeto
12:47 - State e Store (Antigo)
14:22 - Reducer e Imutabilidade (Antigo)
17:48 - Redux Provider
18:38 - HOC connect (Antigo)
20:08 - mapStateToProps (Antigo)
22:07 - Redux DevTools (Antigo)
23:40 - mapDispachToProps (Antigo)
27:09 - DevTools na Prática
28:03 - Dispatch Action com Payload (Antigo)
31:32 - useSelector (Redux Hooks)
33:58 - useDispatch (Redux Hooks)
36:12 - Redux Toolkit
37:30 - Reducer e Actions (Toolkit)
45:27 - Store (Toolkit)
48:38 - A Retrocompatibilidade entre Redux Antigo e Toolkit
49:50 - Dispatch Action (Toolkit)
51:27 - Redux e TypeScrtipt - hooks customizado
56:34 - Conclusão

#redux #reactjs #reactnative #toolkit #typescript #javascript #frontend

[thyagoribeiro]

Cara gostei bastante do teu conteúdo e da tua didática. Tinha reservado hoje para revisar uns conceitos de Redux e teu vídeo foi supimpa pra isso ! Parabéns pelo conteúdo !!!

[michaeladafne]

Queria poder apertar o botão do like mil vezes!!!
Esse vídeo tem uma didática incrível, me ajudou a entender o redux de uma vez por toda e já consegui aplicar em um projeto do zero.
Parabéns pelo trabalho!!!

[fabricio]

Insano demais esse video, didática surreal, parabéns pelo empenho e dedicação em ajudar a comunidade dev Lucas, resta agora quebrar a cabeça um pouco mais pra conseguir implementar no projeto da empresa

[leomarsartor]

Parabéns pelo conteúdo. Sensacional. Didática excelente, Vídeo dividido em capítulos com índice, super organizado, bem articulado. Até a hora que deu uma enrolada no inglês trocou a foto pro técnico da seleção e finaliza com a cereja do bolo (tipagem do typescript para o estado). Uma pena apenas 413 curtidas.

[Lakke_Edu]

Mano, me salvou, tô como trainee em uma empresa e eles usam redux 'OldSchool', seu vídeo me colocou no eixo pq eu tava perdidão.

[victorfigueiredo]

Muito rica essa aula e de graça, assistindo pela segunda vez dps de uns meses pra relembrar, pois fiquei um tempo usando só ContextAPI 😅

[thiagopaz]

Cara já fazia um tempo que tava pra estudar redux, e esse vídeo veio em melhor hora, sempre ouvir o pessoal falar que tinha dificuldade pra aprender redux, mas sinceramente achei bem tranquilo, e claro tua didática ajudou bastante. Obrigadão pela aula e muito sucesso pra ti.

[xOnlyyx]

Que didática maravilhosa, entender os conceitos antigos e como o Redux funciona é muito importante para saber como utilizar corretamente as funções. Nota 10 pelo conteúdo, muito obrigado!!!!

[ronaldoriosespindola]

Cara, tua didática é muito boa. Tava sofrendo com o Redux. Muito obrigado! Ganhou um like e mais um inscrito. Abração.

[viniciuskampgen]

Muito obrigado pelo vídeo, tua didática é ótima! Sou da época do redux oldschool e o vídeo me ajudou muito a entender melhor toda a mudança

[obrenoborges]

Ótimo video! Continue assim, qualidade máxima!

[heliolucio]

Te conheci por esse vídeo e você é um monstro cara, vídeo atualizado, bem editado, didático, com exemplos antigos e novos e com uma pitada de humor ainda por cima ganhou 1 inscrito

[thomascosta]

Simplesmente fantástico!!! Muito obrigado.

[Joao-ooyj]

Obrigado por compartilhar o conhecimento cara, seu vídeo ficou muito bom, parabéns.

Há alguns meses atrás quando eu estava estudando redux, eu andei pesquisando por conteúdos BRs aqui no YT, só que todos ensinavam a versão antiga do redux. Eu tive que aprender por vídeos gringos mesmo sem saber inglês, se virando nos trinta. Mas o problema é que isso era mt improdutivo, aí no final das contas resolvi estudar pelas docs mesmo, que aliás, é muito bem feita, clara e organizada. Esse seu vídeo foi apenas pra dar um revisada mesmo. Mas é isso, obrigado.

Se alguém tiver dificuldades com a syntaxe esquisita do redux, recomendo vocês primeiro se familiarizarem com os hooks: useContext e useReducer do react. Fica mais fluído entender redux quando se sabe estes dois.

[thiagoandrade]

Cara adorei assistir vários vídeos de redux, mas só entendi com você, obrigado!!!
Excelente, Excelente, Excelente

[heltonwylammi]

Excelente aula!! Lembro que há 3 anos atras demorei muito pra aprender de fato redux, trunk, saga, persist... como era complicado. Hoje vejo que tá ficando mais simples.

[ricardohenrique]

Muito obrigado! eu já tava quase desistindo de entender isso

[daSilvaPlay]

O muleque é braboooo.
Parabéns manin, deixa eu ser seu amigo. 🤣🤣. Tmj

[adrianmouzinho]

Que aula meu amigo. Eu tava estudando redux e não tava entendendo nada. Depois de assistir esse eu comecei a entender como funciona essa lib, vlw bro 👌

[analyce-ferreira]

Muito bom, ótimo conteúdo e explicação! Obrigada pela ajuda