Mais um video show de bola! Eu fazia isso de uma forma bem gambiarra, vendo agora. Eu trabalhei por 7 anos em uma empresa que o lema era "faz o mais rápido possível, não importa como, desde que funcione... (5 minutos depois) já tá pronto??". Nessa pressão toda, não tinha como fazer um código limpo e bem estruturado. Hoje, que tenho toda liberdade e muito mais tempo para implementar meus códigos, é que venho aprimorando essa parte. E os videos da Rocket tem ajudado muito! Valeu!
Diego, estou feliz por dois motivos, o primeiro que eu consegui pesquisar sobre o que eu precisava implementar e cai no seu video e segundo que suas explicações são muito claras, você fala rápido e de forma clara. Quem deu deslike nesse video é um invejoso kkkkk , você é fera!! Muito obrigado!!!
Me salvou no desafio de procura de usuarios pela api do github, estava utilizando o state e ele renderizava toda vez o component quando eu digitava algo, pensei em usar o debounce do lodash, porem era necessario pesquisar dps do click do button. OBRIGADO DIEGO!
Perfeito a explicação👏🏽👏🏽👏🏽👏🏽👏🏽👏🏽👏🏽, e é por isso que tenho "virado" os olhos pro lado do svelte, react você TEM que se preocupar muito com essa performance. Hook daqui. hook dali, pra ajudar a desenvolver com performance. As vezes a impressão que da é que tem que usar muito artifícios para algo que, no fim das contas, deveria ser simples. ⚙️Acredito muito que o core do react vai passar logo por algumas mudanças que realmente nos levam a codificar de forma mais "límpida". Eu mesmo, nunca, nunca pensei em utilizar o imperativeHandle, duvido muito que alguém olhe para um esboço/rabisco/protótipo/layout de tela e já de cara pensa - Hummm, bem aqui vou usar useRef, fazer o foward e talz.. e depois expor ali com imperativeHandle, pq não é sugestivo, não é atoa que o pessoal do react está parindo o RecoilJS(em comparação com redux e context...)!
Já briguei muito pra fazer esse tipo de coisa antigamente, quando conheci o useImperativeHandle foi o salvador de vidas, já salvei uma galera depois também mostrando como utilizar. Rocketseat sempre com conteúdo pra agregar! 🚀💜
Finalmente encontrei algo sobre as refs, obrigado Rocketseat! Estava querendo fazer um componente para upload de fotos "customizado" e precisava de algo que me ajudasse a pegar o arquivo que estava salvo dentro do input dele. Tinha conseguido de outro jeito, mas com as refs fica bem mais fácil kkk
Muito bom, só precisei fazer uma alteração. No lugar de RefForwardingComponent usei ForwardRefRenderFunction porque o vscode reclama que o primeiro foi marcado como preterido
Muito bom!! bem o que eu precisava também. Uma sugestão de conteúdo que procurei e quase não tem, é o uso do material-table com react/typescript de forma avançada, criando componentes usando hooks etc. Sempre vejo conteúdo com formulários mas com tabela é mais difícil
Quando vc tá pesquisando sobre o assunto loucamente na internet nos ultimos dias, aí a Rocketseat vem com a faca e o queijo na mão kkkk... Vcs são demais!
sensacional , eu estava precisando submeter um formulário ao clicar em uma div que está em um outro componente , eu já estava pensando em usar ref mas com esse forwardRef fechou tudo , e o melhor você fez o video com TypeScript e hooks
pergunta pro PR: Pq usar o useCallback para as funções relacionadas ao comportamento dos componentes? Em videos mais antigos não era utilizado mas nesse foi usado em larga escala. Deve ser usado apenas quando se trabalha com refs ou faz sentido utilizar em todos os componentes da aplicação?
Caramba!!!! Em um projeto eu tive que virar um mago pra poder fazer isso sem esse imperativeHandle😵! Bora refatorar 😆. Valeu mais uma vez Diego e pessoal da Rocketseat por esse conteudo TOP!!!🚀👍
Hahahaha não temos sobre ele Washington! Mas é muito interessante conhecer as libs de formulário porque a implementação delas costuma ser semelhante, então vai te ajudar em qualquer outra que precise utilizar. Fica como sugestão esse vídeo que temos sobre o Unform, criado pela Rocketseat que também pode te ajudar nisso! E não tem nada de concorrência não Paulo 😄😄💜💜 ua-cam.com/video/P65RJTTqkN4/v-deo.html
@@paulohenriqueoliveirasanta6092 Quero deixar registrado aqui que tentei usar o react-hook-form com react-native e tive alguns problemas. Problemas esses com pouca documentação para serem solucionados. Aprendi na pratica q o @unform realmente é top.
Diego, E no caso de um formulário / tabela com 1000 campos, por exemplo Criar referencias em memórias para cada uma dessas 1000 linhas, traria algum problema de memória para a aplicação?
@@BCDMoura Nem sempre. Há alguns casos em que é preciso de bastante dados do usuário, por exemplo quando falamos de dados de empresas: nome fantasia, cnpj, endereço, contato, razão social, etc. E sem contar que nem sempre o programador contará com um bom time de design 🤷
Para quem estiver vendo em apr-2021 o RefForwardingComponent está marcado como depreciado então podemos usar o ForwardRefRenderFunction que tem funcionamento similar.
Muito massa os hooks. Obrigado por compartilhar. --- Quais os intelisenses e as extensions que tu usa pra programar em React (pra que não usa TypeScript). valeu.
Acho que seria interessante no próxima aula abordar Sobre a API do Google drive. Como aplicar no backend, enviar informações, consumir informações e tals. E sobre o vídeo, aprendi bastante e já vou aplicar nos meus projetos....
Conteúdo excelente! Só fiquei com uma dúvida. No caso do acceptTermsRef que vc utilizou para anotar um valor sem re renderizar o componente, eu poderia criar uma variável com let e utilizar pra guardar essa informação? Qual a diferença nesse caso de utilizar o useRef ou criar uma variável?
Olá, gostaria de perguntar quais os benefícios de usar o hook useImperativeHandle ao invés de só setar dentro do filho a referência para a função. Por exemplo: ref.current = { openDialog };
Engraçado ver como uma funcionalidade fica depreciada tão rápido. Faz nem 1 mês direito que esse vídeo saiu, e o RefForwordingComponent já está depreciado
4 роки тому+2
Diego, faz um vídeo sobre bibliotecas JS externas feitas para o HTML5 tradicional e a melhor prática para se usar elas no React =D
Diego, sou um fã e inscrito no seu canal, gostaria de sugerir uma olhada no framework Moleculer e se for do seu interesse um video com o seu ponto de vista. Abraço!
Fazia tempo que procurava estas dicas, muito obrigado por este vídeo!!! Existe alguma forma de declarar um objeto com varias ref? exemplo InputRefs que contenha um array de varios inputs que posso acessar pelo nome
Tenho um Modal q passa muita props... Pensa que p fechar, atualizar, pegar os dados do item da lista, excluir etc, precisa passar por props... Vou utilizar esse conhecimento p melhorar isso... O redux ajudou um pouco, mas... o q faltava era aprender useImperativeHandle kk
Fala Diego na paz, uma dúvida relacionado a renderização dos componentes, se um componente filho passar um valor para o componente pai através de uma props, bem similar a uma props onChange, ainda assim o componente pai vai ser renderizado novamente?
tambem queria saber, mas me parece que sim.. outro dia vi um problema com o lodash throttle que nao funcionava porque ele recriava a funcao toda hora 👍🏻👍🏻
o useCallback tem dois argumentos. o primeiro argumento é qualquer função que você queira armazenar na memória. o segundo argumento é uma array onde você diz pro react em que condições você quer que esta função passada no primeiro input deve ser recriada. se tu criar somente uma função dentro de um componente, toda vez que este componente renderizar novamente esta função será novamente recriada. colocando essa função dentro do useCallback você evita essa recriação pois o react puxa diretamente da memória. se for uma função simples não há necessidade de colocar dentro do useCallback, mas se for uma função bem complexa é bom colocar para ganhos de performance.
12:08 Eu não entendi pq usar uma ref para guardar uma informação de um formulário, tipo n poderia usar uma variável comum de js, ela também n renderizaria?
Faala Erik! Se entendi corretamente sua dúvida, caso criássemos um estado para armazenar esse valor e ele fosse alterado, acabaria resultando na renderização do elemento novamente. Com o useRef, isso não ocorre. Tanto que o Diego comenta logo em seguida que em qualquer outro cenário, ai sim usaríamos um estado para armazenar e modificar esse valor! 💜
Realmente ela não renderizaria o componente novamente, mas toda vez que um estado mudasse e ocorresse uma renderização do componente a variável seria recriada, perdendo assim qualquer valor a ela atribuído.
Fala Diego, blz? Fiquei com uma dúvida, pq vc esta utilizando o useCallback para criar as funções? Eu sempre criei somente como funções anonimas e não percebi diferença no resultado.
Funções criadas sem useCallback são recriadas em toda renderização de componente. ua-cam.com/video/RZG0iRfUaY0/v-deo.html O exemplo dado nesse vídeo deixa bem claro.
Faala André! O Paulo resumiu muito bem a diferença. Fica essa outra sugestão para entender melhor o useCallback: ua-cam.com/video/jMWNNSx-mcU/v-deo.html
Cara cmg funcionou deboas no inicio mas dps meio que tirou o autocomplete as vezes por exemplo quando n tem nd e vc da um ctrl+space. por isso n gosto mt
Esse Pop OS com cara de MacOs ficou show hahaha Qual foi a extensão que tu usaste pra colocar esse menu global na barra superior? Abraço Diego e a galera da Rocket.
Era disso que eu precisava kkk, tava quebrando a cabeça com ref ontem, continuem trazendo conteúdos avançados
Boaa Guilherme!! Valeeu pelo feedback!! 💜💜
Mais um video show de bola! Eu fazia isso de uma forma bem gambiarra, vendo agora. Eu trabalhei por 7 anos em uma empresa que o lema era "faz o mais rápido possível, não importa como, desde que funcione... (5 minutos depois) já tá pronto??". Nessa pressão toda, não tinha como fazer um código limpo e bem estruturado. Hoje, que tenho toda liberdade e muito mais tempo para implementar meus códigos, é que venho aprimorando essa parte. E os videos da Rocket tem ajudado muito! Valeu!
Valeeeeu Mr. Robot! Pode sempre contar com a gente!! 💜💜🚀
Diego, estou feliz por dois motivos, o primeiro que eu consegui pesquisar sobre o que eu precisava implementar e cai no seu video e segundo que suas explicações são muito claras, você fala rápido e de forma clara. Quem deu deslike nesse video é um invejoso kkkkk , você é fera!! Muito obrigado!!!
Me salvou no desafio de procura de usuarios pela api do github, estava utilizando o state e ele renderizava toda vez o component quando eu digitava algo, pensei em usar o debounce do lodash, porem era necessario pesquisar dps do click do button. OBRIGADO DIEGO!
Trabalho nobre de instruir o mundo.Está de parabéns Diego.
Essa aula me fez perceber que posso refatorar muitos de meus componentes para melhorar a perfomace! Show!
Perfeito a explicação👏🏽👏🏽👏🏽👏🏽👏🏽👏🏽👏🏽, e é por isso que tenho "virado" os olhos pro lado do svelte, react você TEM que se preocupar muito com essa performance. Hook daqui. hook dali, pra ajudar a desenvolver com performance. As vezes a impressão que da é que tem que usar muito artifícios para algo que, no fim das contas, deveria ser simples.
⚙️Acredito muito que o core do react vai passar logo por algumas mudanças que realmente nos levam a codificar de forma mais "límpida". Eu mesmo, nunca, nunca pensei em utilizar o imperativeHandle, duvido muito que alguém olhe para um esboço/rabisco/protótipo/layout de tela e já de cara pensa - Hummm, bem aqui vou usar useRef, fazer o foward e talz.. e depois expor ali com imperativeHandle, pq não é sugestivo, não é atoa que o pessoal do react está parindo o RecoilJS(em comparação com redux e context...)!
Faala Rogerio! Exatamente, isso é algo que fica meio "obscuro" por ali e nem todo mundo sabia bem como usar. Valeeu pelo comentário!! 💜
Valeu mesmo Diego, é muito difícil encontrar conteúdo avançado e acho que isso vai salvar meu dia kkkk
Já briguei muito pra fazer esse tipo de coisa antigamente, quando conheci o useImperativeHandle foi o salvador de vidas, já salvei uma galera depois também mostrando como utilizar. Rocketseat sempre com conteúdo pra agregar! 🚀💜
Boaaa André!! Você sempre salvando a galera também!! Valeeu pelo feedback 💜💜
Finalmente encontrei algo sobre as refs, obrigado Rocketseat!
Estava querendo fazer um componente para upload de fotos "customizado" e precisava de algo que me ajudasse a pegar o arquivo que estava salvo dentro do input dele.
Tinha conseguido de outro jeito, mas com as refs fica bem mais fácil kkk
Muito bom, só precisei fazer uma alteração. No lugar de RefForwardingComponent usei ForwardRefRenderFunction porque o vscode reclama que o primeiro foi marcado como preterido
Muito bom!! bem o que eu precisava também. Uma sugestão de conteúdo que procurei e quase não tem, é o uso do material-table com react/typescript de forma avançada, criando componentes usando hooks etc. Sempre vejo conteúdo com formulários mas com tabela é mais difícil
Quando vc tá pesquisando sobre o assunto loucamente na internet nos ultimos dias, aí a Rocketseat vem com a faca e o queijo na mão kkkk... Vcs são demais!
Hahahaha dizem por aí que lemos mentes Crisman, vai saber... 🔮😄💜
Providencial, esse vídeo bate exatamente com o que eu estava precisando. Obrigado Diego / Rocketseat
Sou fã demais dessa galera da Rocket. Diegão só metralhando conteúdo 💜
Hahaha valeeeu Danilo!! 😍💜
Sensacional!!! Estava precisando disso. E que forma clara de explicar esses dois hooks... Parabéns Diego
Tava quebrando a cabeça, e acho esse vídeo, tudo que precisava..
"Button nao tem valor" pesado em Diegao ashashash Emotional Damage
Que explicação fantástica de refs! Parabéns pelo conteúdo!
Nossa, meu comentário não tem nada a ver com o conteúdo, mas só precisava dizer o quanto eu AMO essa músiquinha da abertura!!
Boa! HAHAHAHA
É muito gostosinha de ouvir, né, Marcella? 💜 😍
Conteúdo assim a gente já salva na hora
sensacional , eu estava precisando submeter um formulário ao clicar em uma div que está em um outro componente , eu já estava pensando em usar ref mas com esse forwardRef fechou tudo , e o melhor você fez o video com TypeScript e hooks
Diego, você explica muito bem! Muito obrigado por compartilhar seu conhecimento com milhares de pessoas.
Faala, Herbertt! Muito obrigado pelo feedback!! 💜💜🚀
"Ah agora eu entendi, agora todas as peças se encaixaram"
Hahahaha 😊💜
Parece que você adivinhou o meu problema, como sempre!!!
Hahahaha 🔮
Já pensou em dar uma Talk no React Conf? Iria representar bem o Brasil. Ótimo vídeo, Abraço!
Top demais, vídeo curtinho, ótimo pra esse fim de dia
Faala, Leandro!! Valeeu pelo feedback! 💜💜
Muito obrigada
Parabéns Rocketseat! Sempre trazendo conteúdos excelentes.
Valeeeeeeu Gabriel!! 💜💜
Salvou esse vídeo hein
Excelente video, abriu minha mente para varias coisas!
Baita introdução meu caro. Muito bem explicado... Parabéns.
Valeeeu Leo! 💜
Excelente vídeo, parabéns pela iniciativa!
Valeu demais pelo feedback, Vinicius! 💜
Vlw! Suas dicas são excelentes
Nós que agradecemos o feedback! 💜 🚀
Muito massa! Bateu em cima daquilo que eu estava fazendo.
Que massa!! Valeeu pelo feedback, Lindemberg! 💜💜
Exatamente o que eu queria aprender sobre. Mais um ótimo conteúdo!!
Que massa Lucas! Valeeu pelo feedback! 💜
Top demais colocaremos na prática!!!!
Boaa! Só vaai Sidnei! 🚀
Show! Vídeo incrível e bem explicado. Agora só falta botar a mão na massa kkk
Muito bom Diego, valeu pelas excelentes dicas
Valeeeu pelo feedback, Feliphe! 💜💜
Top demais, sobre useImperativeHandle no repo que o Diego passou , ja tem conteudo lá ;)
Que maneiro. Mais um boom 💥
pergunta pro PR: Pq usar o useCallback para as funções relacionadas ao comportamento dos componentes? Em videos mais antigos não era utilizado mas nesse foi usado em larga escala. Deve ser usado apenas quando se trabalha com refs ou faz sentido utilizar em todos os componentes da aplicação?
Caramba!!!! Em um projeto eu tive que virar um mago pra poder fazer isso sem esse imperativeHandle😵! Bora refatorar 😆.
Valeu mais uma vez Diego e pessoal da Rocketseat por esse conteudo TOP!!!🚀👍
Boraa Walter!! Valeeu pelo feedback! 💜💜
Muito interessante... parabéns
Valeeeu Erik! 💜
Bom demais, salvou a semana!
Boaa! Valeeu pelo feedback, Gabriel! 💜💜
ajudou dms, muito obrigado
Cês são demais pqp
Valeeeeu Gabriel!! 💜😍
TOPP Vídeo perfeito, ja me ferrei muito com renderizações em excesso
Hahah faz parte Guilherme! Valeeu pelo feedback! 💜💜
OMG, it really worked. Thank you so much!!
You got a like, a subscriber and a buzzer on from an old guy. TNice tutorials is the best soft soft tutorial I've seen so far. You covered a lot of
Excelente!!
Valeeeeu Wilton! 💜💜
Top demais Diego. Cara comecei a estudar React-hook-form e queria saber se você tem algum vídeo sobre o assunto e se é uma boa investir nele.
Oloco mano, tu disse isso pro proprietário do Unform "lib concorrente" hahahahhahaha.
#zueraaaa
Hahahaha não temos sobre ele Washington! Mas é muito interessante conhecer as libs de formulário porque a implementação delas costuma ser semelhante, então vai te ajudar em qualquer outra que precise utilizar. Fica como sugestão esse vídeo que temos sobre o Unform, criado pela Rocketseat que também pode te ajudar nisso! E não tem nada de concorrência não Paulo 😄😄💜💜
ua-cam.com/video/P65RJTTqkN4/v-deo.html
@@paulohenriqueoliveirasanta6092 Quero deixar registrado aqui que tentei usar o react-hook-form com react-native e tive alguns problemas. Problemas esses com pouca documentação para serem solucionados. Aprendi na pratica q o @unform realmente é top.
@@rocketseat Vocês estão de parabéns. Sou super fã de vocês . 👌👌👌👌
@@washingtondasilvaribeiro748 poxa cara, daora esse feedback. Vou prestar atenção nesses detalhes quando (se) for usar pra RN. Boa monstro!!
Faz videos sempre desse tamanho Diego 🙌
Diego,
E no caso de um formulário / tabela com 1000 campos, por exemplo
Criar referencias em memórias para cada uma dessas 1000 linhas, traria algum problema de memória para a aplicação?
.
também queria saber como lidar com ref em casos de muitos inputs.
Oloco se seu projeto existir 1000 inputs o seu UX não tá fazendo um bom trabalho rs
@@BCDMoura Nem sempre. Há alguns casos em que é preciso de bastante dados do usuário, por exemplo quando falamos de dados de empresas: nome fantasia, cnpj, endereço, contato, razão social, etc. E sem contar que nem sempre o programador contará com um bom time de design 🤷
posso estar bem enganado, mas na minha opinião NADA JUSTIFICA 1000 campos em um form... Tem algo errado aí
VALEUUUUUUUUUU me salvou!!
Faaaaala, Jhonata! Wooow! Boa! Que massa que te ajudamos de alguma forma! 💜 🚀
Thank you very much, you saved me a lot.
quando o vídeo foi lançado já existia o hook useContext? se sim, pq usar o useImperativeHandle ao inves do context?
Para quem estiver vendo em apr-2021 o RefForwardingComponent está marcado como depreciado então podemos usar o ForwardRefRenderFunction que tem funcionamento similar.
Cara do céu, eu amo a rocketseat, mais de 1 hora pesquisando, ai venho aqui e acho a solução kk
AAAAAAAAA! 💜
HAHAHAHA obrigada pelo carinho e que bom que conseguimos te ajudar! 😉 🚀
@@rocketseat magina, o que vocês fazem pela comunidade é surreal. Obrigado!!
Muito massa os hooks. Obrigado por compartilhar.
---
Quais os intelisenses e as extensions que tu usa pra programar em React (pra que não usa TypeScript).
valeu.
Fala Diego, ótimo vídeo mas gostaria de saber qual a diferença e em qual momento usaria o createRef() ?
Massa, valeu!!!
Valeeeeeeeu Paulo! 💜
Faz um vídeo com as funcionalidades mais avançadas que você utilizou até hoje com React!
Boaa, valeeu pela sugestão Gabriel! 💜💜
Acho que seria interessante no próxima aula abordar Sobre a API do Google drive. Como aplicar no backend, enviar informações, consumir informações e tals. E sobre o vídeo, aprendi bastante e já vou aplicar nos meus projetos....
Valeeu pela sugestão, Lucas! 💜💜
Se tem vinheta nova a cada code drops tem like
Opaa! 💜💜
Conteúdo excelente! Só fiquei com uma dúvida. No caso do acceptTermsRef que vc utilizou para anotar um valor sem re renderizar o componente, eu poderia criar uma variável com let e utilizar pra guardar essa informação? Qual a diferença nesse caso de utilizar o useRef ou criar uma variável?
Boa, obrigado pelo conteúdo, gostaria saber como dockerizar uma aplicação Next.js para produção
Diegão Mãe Dináh, pesquisei esse conteúdo na segunda.
Hahahahahahaha essa é boa! 💜
Qual a diferença de expor uma função do componente filho pela props ou pelo useImperativeHandles??
Diegão pq usou useCallback em toda as funções? Ela deve ser usada em todos os casos mesmo?
Olá, gostaria de perguntar quais os benefícios de usar o hook useImperativeHandle ao invés de só setar dentro do filho a referência para a função.
Por exemplo: ref.current = { openDialog };
Diego, neste casos, eu posso usar REF pra tudo? Tipo eu sempre usei o useState.. mas vi q ele sempre está renderizando ...
Engraçado ver como uma funcionalidade fica depreciada tão rápido. Faz nem 1 mês direito que esse vídeo saiu, e o RefForwordingComponent já está depreciado
Diego, faz um vídeo sobre bibliotecas JS externas feitas para o HTML5 tradicional e a melhor prática para se usar elas no React =D
Faala Rafael! Valeeu pela sugestão! 💜💜
Curti a camisa Diego!
Hahaha valeeu! 💜
Diego stop blowing my mind!!!!!!!!!!!!!!!!
Igual o Fallen
Hahahaha 😄😄
Pra quem veio consultar sobre o Modal: 22:08
Diego, sou um fã e inscrito no seu canal, gostaria de sugerir uma olhada no framework Moleculer e se for do seu interesse um video com o seu ponto de vista. Abraço!
Faala Marcelo! Opa! Valeeu pela sugestão! 💜💜
Fazia tempo que procurava estas dicas, muito obrigado por este vídeo!!! Existe alguma forma de declarar um objeto com varias ref? exemplo InputRefs que contenha um array de varios inputs que posso acessar pelo nome
Tenho um Modal q passa muita props... Pensa que p fechar, atualizar, pegar os dados do item da lista, excluir etc, precisa passar por props... Vou utilizar esse conhecimento p melhorar isso... O redux ajudou um pouco, mas... o q faltava era aprender useImperativeHandle kk
carai que mto foda
top!
Fala Diego na paz, uma dúvida relacionado a renderização dos componentes, se um componente filho passar um valor para o componente pai através de uma props, bem similar a uma props onChange, ainda assim o componente pai vai ser renderizado novamente?
Faala Alisson! Dá uma conferida nesse vídeo aqui que deve tirar a sua dúvida! 💜
ua-cam.com/video/jMWNNSx-mcU/v-deo.html
Tenho uma dúvida: Quando adicionei o useImperativeHandle, os testes quebraram, dando mais assertions q o esperado. Como resolver?
O uso do useCallback foi para as funções passadas por referência não serem criadas novamente?
tambem queria saber, mas me parece que sim.. outro dia vi um problema com o lodash throttle que nao funcionava porque ele recriava a funcao toda hora 👍🏻👍🏻
o useCallback tem dois argumentos. o primeiro argumento é qualquer função que você queira armazenar na memória. o segundo argumento é uma array onde você diz pro react em que condições você quer que esta função passada no primeiro input deve ser recriada.
se tu criar somente uma função dentro de um componente, toda vez que este componente renderizar novamente esta função será novamente recriada. colocando essa função dentro do useCallback você evita essa recriação pois o react puxa diretamente da memória.
se for uma função simples não há necessidade de colocar dentro do useCallback, mas se for uma função bem complexa é bom colocar para ganhos de performance.
Valeu
Faala Wylliam! Dá uma conferida nesse vídeo aqui que vai te sanar todas as dúvidas sobre o useCallback! 💜
ua-cam.com/video/jMWNNSx-mcU/v-deo.html
G.O.A.T
Essa parte do forwardRef vale também para react native em um TextInput por exemplo?
Faala, Felipe! Pode sim, sem problemas! 💜
Alguém sabe qual o modelo de teclado e mouse que ele está usando ali ???
UseImperativeHandle , nem conhecia mas já considero pacas 😂😂😂.
Bem prático, né, Breno!? 👀 🤣
12:08 Eu não entendi pq usar uma ref para guardar uma informação de um formulário, tipo n poderia usar uma variável comum de js, ela também n renderizaria?
Faala Erik! Se entendi corretamente sua dúvida, caso criássemos um estado para armazenar esse valor e ele fosse alterado, acabaria resultando na renderização do elemento novamente. Com o useRef, isso não ocorre. Tanto que o Diego comenta logo em seguida que em qualquer outro cenário, ai sim usaríamos um estado para armazenar e modificar esse valor! 💜
Realmente ela não renderizaria o componente novamente, mas toda vez que um estado mudasse e ocorresse uma renderização do componente a variável seria recriada, perdendo assim qualquer valor a ela atribuído.
God!
💜💜
Usei muito para fazer um player personalizado
Fala Diego, blz? Fiquei com uma dúvida, pq vc esta utilizando o useCallback para criar as funções? Eu sempre criei somente como funções anonimas e não percebi diferença no resultado.
Funções criadas sem useCallback são recriadas em toda renderização de componente.
ua-cam.com/video/RZG0iRfUaY0/v-deo.html
O exemplo dado nesse vídeo deixa bem claro.
@@paulohenriqueoliveirasanta6092 Muito obrigado Paulo, já entendi, mas irei ver o vídeo tbm, vlw.
Faala André! O Paulo resumiu muito bem a diferença. Fica essa outra sugestão para entender melhor o useCallback:
ua-cam.com/video/jMWNNSx-mcU/v-deo.html
Boa Diego! Esse tabnine funciona de boas?
Cara cmg funcionou deboas no inicio mas dps meio que tirou o autocomplete as vezes por exemplo quando n tem nd e vc da um ctrl+space. por isso n gosto mt
Boa pergunta! Vou ver com ele algum feedback porque não conhecia ela também! 💜
Esse Pop OS com cara de MacOs ficou show hahaha Qual foi a extensão que tu usaste pra colocar esse menu global na barra superior? Abraço Diego e a galera da Rocket.
É o kubuntu. O widget é o "Global Menu".
@@robsong6689 aah, achava que ele usava pop Os. Obrigado
Cara, parece que não é Gnome não, ele ta usando KDE Plasma, e ele tem esse menu global nativo, é só ativar nas configs!
@@OMateusVidal vou baixar pra testar
Faaala, Arthur! Hahaha é o Ubuntu com KDE Plasma como a galera falou mesmo. 💜
pq ref não tão usada se ela consegue mudar um elemento sem rederizar novamente? teoricamente deviamos usa-la pra quase tudo nao?
Por curiosidade, qual teclado você está usando?
Qual switch dele?
Faaaala, Vinicius!
É o Keychron K2 switch blue! 😉 💜
My GMS soft really electric and notNice tutorialng like a app. Any tips how to fix?
como eu passaria as props para o modal?
alguem saberia dizer?
Aproveitando o modal, faz um codedrop abordando a ideia de Portal do React. Salve.
Faala, Douglas! Valeeu pela sugestão! 💜💜