Aplicando SOLID e Design Patterns nos React Hooks

Рет қаралды 2,662

Ай бұрын

Faça parte dessa comunidade, seja MEMBRO DO CANAL! 👊🚀
Isso me ajuda demais a continuar trazendo conteúdo de qualidade! Muito obrigado de coração ♥️
---
A aplicação do Princípio da Inversão de Dependência (DIP) do SOLID em hooks do ReactJS oferece inúmeras vantagens, promovendo a flexibilidade e a reutilização do código.
Ao implementar o DIP, os hooks são projetados para depender de abstrações em vez de implementações concretas, facilitando a manutenção e a escalabilidade do código.
Isso nos permite alterar as dependências de forma mais fácil e segura, sem modificar os hooks em si.
Além disso, o DIP melhora a testabilidade dos hooks, possibilitando a injeção de dependências durante os testes unitários.
Em suma, a adoção do DIP em hooks do ReactJS resulta em um código mais robusto, modular e fácil de gerenciar, características essenciais para aplicações com alta qualidade.
---
✅ Curso de Next.js 13:
hotm.art/lA0ujDcw
📷 Segue lá no Instagram:
/ devjunioralves
💭 Participe da nossa comunidade no Discord:
/ discord
🧑‍💻 Repositório do canal:
github.com/jjunior96/dev-juni...
---
𝗢𝗦 𝗠𝗘𝗟𝗛𝗢𝗥𝗘𝗦 𝗩𝗜𝗗𝗘𝗢𝗦 𝗗𝗢 𝗖𝗔𝗡𝗔𝗟:
7 CONCEITOS DO TYPESCRIPT QUE VOCÊ DEVE SABE
• 7 CONCEITOS DO TYPESCR...
Signals no React.js?!
• Signals no React.js?!
QUAL A MELHOR ESTRUTURA DE PASTAS PARA PROJETOS REACT/NEXT.JS
• QUAL A MELHOR ESTRUTUR...
COMO APLICAR SOLID NO REACT - Inversão de dependência DIP
• COMO APLICAR SOLID NO ...
[ROADMAP] O QUE VOCÊ DEVERIA ESTUDAR EM 2O23? Fique de olho nessas tecnologias
• [ROADMAP] O QUE VOCÊ D...
TUTORIAL NEXT.JS 13: FETCHING DATA - PARTE 3/3
• TUTORIAL NEXT.JS 13: F...
A FORMA CORRETA DE CRIAR ROTAS PRIVADAS NO NEXT.JS 13 - Nova pasta pasta app!
• A FORMA CORRETA DE CRI...
QUANDO NÃO UTILIZAR ESTADOS NO REACT?
• QUANDO NÃO UTILIZAR ES...
MELHORE A USABILIDADE DE SUAS APLICAÇÕES COM ISSO
• MELHORE A USABILIDADE ...
TUTORIAL NEXT.JS 13: VALE A PENA MIGRAR? PARTE 1/3
• TUTORIAL NEXT.JS 13: V...
A FORMA CORRETA DE CRIAR ROTAS PRIVADAS NO NEXT.JS 13 - Nova pasta pasta app!
• A FORMA CORRETA DE CRI...
---
Livros que me ajudaram:
Código Limpo
amzn.to/3hHXVKY
Arquitetura Limpa
amzn.to/3Viqw7v
Como ser um programador melhor
amzn.to/3POQ5fq
Estruturas de dados e algoritmos com JavaScript
amzn.to/3hM0L1u
Entendendo Algoritmos: Um guia ilustrado para programadores e outros curiosos
amzn.to/3BWsaEO
14 hábitos de desenvolvedores altamente produtivos
amzn.to/3uZqsyy
Hábitos Atômicos
amzn.to/3FGllIM
Aprendendo a Aprender
amzn.to/3WxM0hG
Rápido e devagar
amzn.to/3PLrYhq
A vida dos Estoicos
amzn.to/3vaQIGl
Meditações de Marco Aurélio
amzn.to/3joFYS1
*Links afiliados.
---
👋 Você pode me encontrar aqui:
🧑‍💻 Blog: www.devjuniorplus.com.br
💼 LinkedIn: / junior-alves-b66a10127
💻 GitHub: github.com/jjunior96
📷 Instagram: / devjunioralves
👨‍💻 Sobre mim
Eu sou Junior, Senior Frontend Engineer! Tenho mais de 4 anos de experiência.
Aqui, compartilho conteúdo sobre React.js, Next.js, TypeScript, JavaScript, testes, livros, SOLID e tudo mais relacionado à desenvolvimento de software.
✉️ Email comercial
devjuniorplus@gmail.com
📌 Utilidades
Editor: VS Code
Tema: Illusion
Music provided by NoCopyrightSounds.
#reactjs #solid #typescript

Пікірлер: 20

@devjunioralves Ай бұрын

Lógica de Programação e Algoritmos com JavaScript: amzn.to/48Cj65Z JavaScript: O Guia Definitivo: amzn.to/48jh9vp Como ser um programador melhor amzn.to/48WYGVj Arquitetura Limpa (Clean Arch) amzn.to/3Viqw7v Clean Code amzn.to/3hHXVKY Estruturas de dados e algoritmos com JavaScript amzn.to/49FOzFd --- ✅ Segue lá no Instagram: instagram.com/devjunioralves/ ✅ Nossa comunidade no Discord: discord.com/invite/bVxW4Dhgrf

@fi3018 Ай бұрын

Essa história de "vou deixar genérico pq nem sempre vai ser axios" eu ouço desde 1920 e sempre foi axios. Conteúdo top demais, curti!

@devjunioralves Ай бұрын

Kkkkkkk Sim, o axios é de fato o mais utilizado, porém, eu ja tive problemas quando o axios virou para versão 1.x. Se tivesse criado um adapter assim, teria sido mais feliz naquela época kkkk

@PiclesShow Ай бұрын

@@devjunioralves eu tenho uma dúvida mais ou menos relacionado a isso. se eu exporto um objeto genérico API (export const api = ....), usando axios, e crio uma interface (export interface ApiClient), precisa mesmo fazer um adapter? se um dia eu quiser mudar de axios pra fetch, eu não posso simplesmente ir lá no export const api, e refatorar usando o fetch de modo que atenda mesma interface? teoricamente não quebraria nos locais da aplicação que usa o api exportado, certo?

@maykon-oliveira 25 күн бұрын

Overengineer que fala?

@danilochgs 21 күн бұрын

Lança os cursos logo prf

@victorbiasibetti Ай бұрын

olhei essa parte dos HTTPStatus lembrei do curso do manguinho, top demais o conteudo

@devjunioralves Ай бұрын

Ajuda demais! Valeu Victor 👊

@oreis_ba 24 күн бұрын

Cara, muito bom! Evoluí dois níveis depois do seu vídeo. Uma pergunta, no caso eu pegaria a função useFetch e relacionaria a cada endpoint com seu método específico na aplicação?

@diegofrr Ай бұрын

Massa dms os conteúdos! Queria sugerir um conteúdo: Effector, uma alternativa robusta e escalável ao Redux. Não encontrei vídeos BR sobre

@devjunioralves Ай бұрын

Valeu Diego! 👊 Sobre a sugestão, vou estudar sobre, pois não conheço o Effector.

@MarcosSarges Ай бұрын

Também temos o zustand

@viniciusuchoas8385 24 күн бұрын

custom hook é a única forma separar a camada de apresentação da lógica ou tem alguma outra? dependendo da complexidade tenho a impressão de ficar meio bloated