Busca Instantânea com React
Emerson Broga
#javascript #react #search
No vídeo de hoje, eu vou te mostrar como fazer uma busca instantânea com React, aquela busca que enquanto você vai digitando os resultados vão aparecendo na tela, que é conhecida como instant search, muito utilizada também nos autocomplete. E vamos ver também como animar os resultados usando css e um pulo do gato que vai ser como definir variáveis css inline no react.
Eu garanto que você vai aprender muita coisa com esse vídeo.
Espero que gostem!
Esse video tem fins educativos.
=========
Link Secreto:
❓❓ https://emersonbroga.com/secret❓❓
✅ Tenho um curso de JavaScript do básico ao avançado. http://emersonbroga.com/js
✅ Tenho também um livro sobre ES6, chamado JavaScript: As Novidades do ES6 http://emersonbroga.com/es6
✅ E em breve vou abrir mais uma turma do meu curso de React e NodeJS http://emersonbroga.com/react
✅ Video Anterior: Dropdown de Cidade e estado https://youtu.be/Aca6mAXi0j4
✅ Video: Como ordenar arrays no JavaScript! https://www.youtube.com/watch?v=JxdsTHdgqAU
✅ Video: Como funciona o useEffect? https://www.youtube.com/watch?v=ehtB6ynyIlU
========= Time Stamps:
00:00 Intro 00:30 Apresentação 01:18 Mostrando o projeto 04:02 Iniciando o projeto 04:56 Criando a estrutura inicial (JSX/HTML) 06:59 Estilizando o projeto (CSS) 16:49 Escutando o evento onChange 18:50 Fazendo a consulta na API 22:42 Exibindo os resultados da busca 26:40 BÔNUS: Melhorias no projeto 27:33 BÔNUS: Colocando input em foco (useRef) 29:58 BÔNUS: Animando os resultados de busca com CSS 33:42 BÔNUS: Variáveis de CSS inline no React 36:37 Finalização
=========
Acompanhe @emersonbrogadev nas redes sociais e aprenda mais sobre JavaScript/Node/React!
➜ Veja as dicas no Instagram 📸: https://emersonbroga.com/instagram
➜ Assista nosso canal no Youtube 📺 : https://emersonbroga.com/youtube
➜ Curta nossa página no Facebook 👍 : https://emersonbroga.com/facebook
➜ Não perca as atualizações no Twitter 🐦 : https://emersonbroga.com/twitter
➜ Siga nossos repositórios no Github ⌨️: https://emersonbroga.com/github
==========
Sobre Emerson Broga Dev (@emersonbrogadev):
Programador há mais de 15 anos, sou formado em Desenvolvimento de Sistemas pela Faculdade Pitágoras e pós-graduado em Gestão Estratégica de Marketing pela PUC Minas. Trabalhei em diversas agências de publicidade e desenvolvimento de software e atualmente trabalho em projetos internacionais como FOX.com, FXNetworks.com, NatGeo.com entre outros. Estou atualmente dedicando meu tempo a ensinar programação em meu blog e redes sociais. Saiba mais em http://bit.ly/2yFCqR1
========== Agradeço a sua atenção e lhe parabenizo pelo interesse em aprender \o/
react search api instant-search busca instantanea resultados de busca games n64 abstracao components javascript frontend dev soudev broga ... https://www.youtube.com/watch?v=3vmL_y9CxI8
272771350 Bytes