TELA DE LOGIN COM REACT JS - PROJETO DE REACT JS PARA INICIANTES PÁGINA DE LOGIN

Подписаться 142 тыс.

Просмотров 19 тыс.

50% 1

Neste vídeo você aprenderá a criar uma página de login com React JS!
🔵 Curso completo de React: app.horadecoda...
🔴 Curso completo de React + TS: app.horadecoda...
👉 Ebook gratuito de React: app.horadecoda...
💡Ebook de React da Hora de Codar: amzn.to/4aVC9tc
Arquivos do projeto: github.com/mat...
Começaremos do absoluto zero, criando o nosso projeto de React com Vite. Depois realizaremos um reset, excluindo tudo que não vamos utilizar da base do React, e criar nossa estrutura do projeto de pastas e arquivos.
Modelaremos então o componente principal de formulário de login, e criaremos a funcionaliade de envio de form com o evento onSubmit, mapeando os dados do usuário com onChange em cada campo e salvando no hook useState.
Por fim faremos a estilização do projeto com CSS, para criar o efeito de glass com CSS, que é um recurso bem interessante e também simples de fazer.
Criaremos este projeto para iniciantes em React JS utilizando estratégias de código otimizadas, e também explicando para que serve cada linha de código que vamos programar.
Entre no nosso servidor de Discord e me siga nas redes:
🟣 Discord Hora de Codar: / discord
🔴 Instagram: / horadecodar
🔷 Telegram: t.me/horadecodar
#reactjs

Опубликовано:

26 сен 2024

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 63

@MatheusBattisti 5 месяцев назад

🔵 Curso completo de React: app.horadecodar.com.br/course/curso-react-js-completo 🔴 Curso completo de React + TS: app.horadecodar.com.br/course/curso-projetos-react-js 👉 Ebook gratuito de React: app.horadecodar.com.br/ebookpages/ebook-react-js-para-iniciantes 💡Ebook de React da Hora de Codar: amzn.to/4aVC9tc

@FelipeEmilio_27 5 месяцев назад

Matheus faz uma parte 2 usando o Node.js como o back-end e o banco de dados, creio q seria muito interessante

@MatheusBattisti 5 месяцев назад

Opa, valeu pela sugestão

@DagurasuKun 5 месяцев назад

up!

@tanushenrique8466 5 месяцев назад

Por favor faça isso 🎉😅😅@@MatheusBattisti

@developing01 5 месяцев назад

@@MatheusBattisti Por favor Matheus, faça mesmo! Sua didática é top!

@GermesonMartins 4 месяца назад

Nossa, iria ajudar muito! Estou procurando muito por isso, iria ajudar muita gente, inclusive eu, Matheus! Tmj Up

3 месяца назад

Eu nunca tive contato com React, ai fiz o seu curso de React e fiquei apaixonado não só pela tecnologia mas também pela sua didática, você explica muito bem e não deixa nada escapar, agora sempre que eu quero fazer algum projeto usando React vou lembrar de você, meus parabéns e muito obrigado por compartilhar seus conhecimentos, esta ajudando muito.

@jorgeluizcamposmelo3844 3 месяца назад

Graças a Deus temos um canal como o teu! Tu é o cara, Matheus!

@CarolineMoraes 4 месяца назад

Tutorial incrível!!!! Ajudou demais no meu aprendizado! 👏👏👏👏👏

@MatheusBattisti 4 месяца назад

valeuu!

@PekasMakeup 5 месяцев назад

Muito massa fica impossível vc ver esse video e nao comprar o curso 😂😂 parabens! Muito bom

@MatheusBattisti 5 месяцев назад

Obrigado, te espero lá! =D

@alanadami 2 месяца назад

Valeu Matheus! Curtida número 1000!!!

@LucasCouto466 4 месяца назад

Sei html, css e o básico de java script, vou pegar a manha do react enquanto me aprofundo mais no Java S Conteúdo top meu velho, top msm

@MatheusBattisti 4 месяца назад

opa, valeu Lucas, tamo junto!

@mgmoura 5 месяцев назад

muito legal, bem explicado e objetivo

@MatheusBattisti 5 месяцев назад

valeu Marcelo!

@ThaliTorres_ Месяц назад

Muito bom, projeto feito!

@niltonmedeiros9313 5 месяцев назад

Me inscrevi, dei like e comprei o curso! Bora codar!

@MatheusBattisti 5 месяцев назад

boa Nilton, tamo junto!

@flavioa.damaia1293 5 месяцев назад

Bacana abordagem!!! Parabéns

@MatheusBattisti 5 месяцев назад

Valeu Flávio!

@FernandoHenrique-ni3qg 3 месяца назад

Esse cara é foda!

@ricardob-x2o Месяц назад

GÊNIO

@andersondesouza281 5 месяцев назад

Muito obrigado pelo video

@MatheusBattisti 5 месяцев назад

tamo junto Anderson!

@danillohss12 5 месяцев назад

Ótimo conteúdo, trás mais conteúdo de Vue também, seria muito bom se fosse com Composition API

@MatheusBattisti 5 месяцев назад

opa, pode deixar! =D

@douglasmiranda6500 5 месяцев назад

Matheus, você pretende lançar algum curso sobre MaterialUI ? Parabéns pelo conteúdo !

@MatheusBattisti 5 месяцев назад

valeu Douglas, te falar que no momento não temos planos para material, mas obrigado pela sugestão =)

@jhontecvieira7170 4 месяца назад

Quando comecei a estilizar o .App. No css, ele não estava fazendo as alterações na página

@Atem.Diego_J 4 месяца назад

npx : O termo 'npx' não é reconhecido como nome de cmdlet, função, arquivo de script ou programa operável. Verifique a grafia do nome ou, se um caminho tiver sido incluído, veja se o caminho está correto e tente novamente. poderia me dar uma luz? travei logo no começo

@Guizihn 3 месяца назад

O meu deu a mesma coisa kkkk

@mrbrau952 3 месяца назад

O node tá baixado no Pc? Se não tiver, baixa. Se tiver tenta dar um 'npm i npx' no terminal do projeto

@divinomarcio2463 4 месяца назад

fiquei muito confuso com as informações de CSS, parece muita coisa, acho que seria interessante comentar cada bloco informar o que esta fazendo com ele o ajuste que ele faz

@rb9422 2 месяца назад

=\ Parei no primeiro dos passos, quando rodo no terminal o "npx create-vite ." não abre as opções para selecionar o framework. Aparece um erro faltando o npm.

@akfifos Месяц назад

meu tbm tava dando o erro, mas consegui resolver

@lagoawb 5 месяцев назад

Muito top, o curso Curso completo de React + TS é com type script e vite tambem?

@MatheusBattisti 5 месяцев назад

oi, valeu! sim po, foi gravado recentemente, não tem 3 meses =)

@leandrodocruze3056 5 месяцев назад

matheus no seu curso de react tem projeto de login com autenticação no banco de dados??

@MatheusBattisti 5 месяцев назад

opa, tem sim! =)

@gravity2387 4 месяца назад

opa, o codigo do video não ta funcionando pra mim, o único codigo que ta funcionando e o do github que está diferente do video

@albertovillar9106 5 месяцев назад

Essa estilização boladona, qual curso ensina?

@MatheusBattisti 5 месяцев назад

o de HTML e CSS trabalha muito nisso, é este: app.horadecodar.com.br/course/curso-html-e-css-completo

@thecorinthiano 5 месяцев назад

Matheus, só uma dúvida bem de leigo, é possivel fazer um projeto desse sem ter uma "cola", fazer ficar automático as linhas de código na nossa cabeça ou durante a carreira de desenvolvedor é sempre normal ter que pesquisar por esquecer?

@MatheusBattisti 5 месяцев назад

cara, sendo sincero, são vários processos, desde a concepção da ideia do projeto, design, esquema do banco de dados, e etc... nunca vai chegar só e programar tudo, sempre vai ter que buscar referências, olhar documentação, isso é o nosso dia a dia =)

@SrGopp 4 месяца назад

Seria melhor react ou vue para começar?curti bastante vue, mas react é mais usado, então fico na dúvida 🤔

@FernandoHenrique-ni3qg 3 месяца назад

faça o que lhe dar mais prazer, tem opotunidades para ambos.

@augustoalbuquerque 5 месяцев назад

Matheus !! Trabalhando com Vite facilita para publicar ? Estou tendo um problema danado com cache da aplicação quando público uma nova versão. O Vite ajuda nisso?

@MatheusBattisti 5 месяцев назад

Cara, geralmente o cache tem relação com servidor ou cdn, pois se os arquivos estão atualizados o problema não é da ferramenta que builda

@Matheus_1582 5 месяцев назад

Opa falou em linguagem de programação. Eu quero aprender a linguagem Scala.

@MatheusBattisti 5 месяцев назад

Boa Matheus!

@andreluisdev 4 месяца назад

Quando digito npm i dar erro

@Miguel23567 Месяц назад

Tá com o node ?

@HarmoniaInteriorofc Месяц назад

eu adorei o video muito interessante , durante o video tem anúncios pakas

@luiza_rodrigues 4 месяца назад

Dúvidas: 1) Vi que você esta utilizando o nomeDoArquivo.css . não seria nomeDoArquivo.module.css? O module saiu das novas versões do react? 2) Porque precisa instalar react-icons e @react-icons/all nesse projeto? Apenas a instalação de um deles não seria suficiente?

@labezerra 2 месяца назад

o .module seria apenas para você manter as classnames e id de um componentes exclusivos dele mesmo, podendo repetir elas em outro componente sem puxar a estilização, mas ss, na versão atual ainda há o .modules