#react #tutorial #modal

No tutorial de hoje vou mostrar pra você como criar um componente de modal no React JS.

Esse é o tipo de componente que a gente precisa na maioria dos projetos, mas como as pessoas geralmente vem do jQuery elas não fazem ideia de como fazer modal no react.

Espero que gostem!

========= 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

✅ Livro Sobre ES6 Gratuito no Kindle: https://amzn.to/3iE4lIF

✅ E em breve vou abrir mais uma turma do meu curso de React e NodeJS http://emersonbroga.com/react

========= Time Stamps:

00:00 Intro 01:24 Inicializando o projeto 05:14 Criando o componente de Modal 06:32 Exibindo e escondendo o Modal 09:11 Passando o conteúdo do Modal 13:30 Estruturando o Modal 14:18 Criando um botão de fechar com CSS 23:04 Fazendo o Modal fechar ao clicar no botão 24:10 Fazendo o backdrop do Modal 27:15 Botão de fechar opcional 27:59 Fechar Modal ao clicar fora 32:15 Fechar Modal com ESC 36:43 Botões de ação no modal 40:11 Recapitulando 43:47 Encerramento

=========

Outros videos:

✅ Video: Regex https://youtu.be/PJN6_n-pdj8

✅ Video: React use(); https://www.youtube.com/watch?v=CNz3VDXX3H0

✅ Video: useId(); https://www.youtube.com/watch?v=D6GoXiuQ82U

✅ Video: Tailwind css para iniciantes https://youtu.be/mK_19iqznc8

✅ Video: Automatização simples com NodeJS https://youtu.be/ZcjJ2qyTr7k

✅ Video: Unidades de Medida do CSS https://youtu.be/ftq6FsIRwDk

✅ Video: Entendendo o tal do CORS https://youtu.be/VZI1I3c6a2g

✅ Video: Carrossel com React https://www.youtube.com/watch?v=cX0N3TNxumw

✅ Video: Upload de imagens com a FETCH API do JavaScript! https://www.youtube.com/watch?v=5RUgDRZjmjA

✅ Video: Alterando respostas da API com Charles Proxy https://youtu.be/AhKy8dSXia4

✅ Video: Busca Instantânea com React https://youtu.be/3vmL_y9CxI8

✅ Video: 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

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 QuickNode.com 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/

useId react js javascript react reactjs node nodejs frontend backend desenvolvedor programador dev soudev broga emersonbroga ... https://www.youtube.com/watch?v=aY0HLDJKTSc