Тёмный

Autenticacion con Firebase y Javascript (Correo, Gmail, Facebook, Github y Más) 

Fazt
Подписаться 585 тыс.
Просмотров 62 тыс.
50% 1

Aprende a crear una aplicación web que permita autenticar usuarios con Javascript y Firebase como Backend. En este tutorial aprenderemos a usar Firebase Authentication, el servicio de Firebase para registrar usuarios con Correo (Gmail), Facebook, Github, Twitter, y Más. Aprenderás a crear una aplicación desde cero, conectarlo a firebase, crear una interfaz con Bootstrap 5, conectarlo con una base de datos NoSQL con Firestore, y hacer login y registro de usuarios, además del despliegue en Firebase Hosting.
Código del ejemplo Práctico:
github.com/fazt/firebase-auth...
Índice del Tutorial:
00:00 Introducción
03:35 Configuracion del proyecto
07:50 Configuracion de Firebase
16:39 Bootstrap5
28:10 Formulario de Registro
34:01 Autenticacion con Firebase
46:47 Manejo de Errores
52:46 Toastifyjs
01:01:57 onAuthStateChanged
01:15:24 Login con Email
01:24:06 Login con Google
01:35:04 Login con Facebook
01:43:15 Login con Github
01:49:52 Firestore
01:08:14 Deploy
🎥 Videos Recomendados:
Curso de React ➜ • Curso de Reactjs desde...
Curso de React Router DOM v6 ➜ • React Router Dom V6 - ...
Excalidraw (Herramienta de dibujo) ➜ • Excalidraw, Mi Herrami...
Curso de Nodejs ➜ • Nodejs Curso Práctico ...
Curso de Express ➜ • Express Framework de N...
Curso de JSON ➜ • JSON (Javascript Objec...
Curso de Git ➜ • Git y Github | Curso P...
Variables de entorno Nodejs ➜ • Variables de Entorno e...
HTML ➜ • Curso HTML para Princi...
CSS ➜ • Curso CSS para Princip...
Javascript Orientado a Objetos ➜ • Curso de Javascript Or...
Arrays en Javascript ➜ • Javascript Arrays - Me...
ES Modules ➜ • Import y Export en Jav...
👨‍💻 ¿Qué servicios y productos utilizo?
Ledger (Hardware Wallet) ➞ bit.ly/3ijsVNW
SiteGround ➞ bit.ly/31u9ZEk
DigitalOcean ➞ m.do.co/c/8ef261d77de5
Expo ➞ bit.ly/2WpYKtx
Cloudinary ➞ bit.ly/3ohNlJ7
#firebase #javascript #desarrolloweb

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

 

19 июн 2024

Поделиться:

Ссылка:

Скачать:

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

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 189   
@enzudeveloper3540
@enzudeveloper3540 Год назад
Sos un Crack. Hay gente que cobra por explicar esto. Mis respetos
@oliveira1820
@oliveira1820 5 месяцев назад
Al contrario de muchos canales de programación, Fazt produce contenidos ÚTILES. Me encanta este canal.
@dacastror2
@dacastror2 Год назад
Cuando intenté hacer el paso del min 41:00 no funcionó, descubrí que era porque los diferentes archivos javascript que se importan de firebase deben tener la misma versión, eso arregló el problema. Gracias por el tutorial, es de gran ayuda
@sebastiansanchezjaramillo5187
Muchas gracias manito me quede estancado ahi. XD
@cristhofherdzibmoo5954
@cristhofherdzibmoo5954 Год назад
eso fue increible fazt, nuca me habia topado un tutorial tan bien explicado
@cristhianjgl
@cristhianjgl Год назад
siempre con videos interesantes y de calidad, Gracias Fazt!
@santiagogonzalezmontoya5370
Increíble siempre haces el vídeo que necesitaba !. Gracias Fazt , eres un superheroe!
@cientifica9150
@cientifica9150 Год назад
Este es sin duda el mejor tutorial, claro y rapido, por favor sigue asi
@MerovingioMerv
@MerovingioMerv Год назад
Me encantan tus explicaciones porque todas están relacionadas con tecnologías actuales. Sigue así!!!!
@diegoleandrokapfer9751
@diegoleandrokapfer9751 Год назад
muchas gracias amigo estuve buscando y no encontraba a nadie que explique tan bien como vos!
@valevlogs9493
@valevlogs9493 Год назад
Uno de los mejores tutoriales que he visto, explica todo de forma clara y es conciso. Eres grande Fazt! 👾
@JimyDrive
@JimyDrive Год назад
Precisamente he estado practicando con Supabase gracias a tus vídeos. Ahora toca probar Firebase
@user-xz8zh6ym5z
@user-xz8zh6ym5z 26 дней назад
Nadie explica tan bien como este pibe, como me carrea. Gracias Fazt.
@daque7253
@daque7253 Год назад
No antojar Fazt!!! que es viernes y hay tiempo para estudiar ✨🙌
@jesus_84_
@jesus_84_ Год назад
Maestro de maestros.
@emilio_sanchezarreaza6315
@emilio_sanchezarreaza6315 Год назад
excepcional video como siempre, haces lo difícil sencillo, muchas gracias por todo!!
@guillermogustavozumaranbaz6496
Increíble, uno de los mejores si no el mejor canal de programación de habla latina en mi opinión. Grande Fazt!!!
@gamuro6977
@gamuro6977 Год назад
El mejor!
@user-zu9zv9fu2d
@user-zu9zv9fu2d 4 месяца назад
Las explicaciones son buenas y me agrada como se entiende el video, eso que no me gusta programar pero cuando vi este canal se me hixo mucho mas facil.
@yassir-amzel
@yassir-amzel Год назад
Agradecido con cada aporte Maestro.
@davidramirez9727
@davidramirez9727 Год назад
Excelente video, muchas gracias por compartir Fazt!😎
@MaikolDxrk845
@MaikolDxrk845 Год назад
Gran trabajo haces hermano, gracias🙂
@anonymushadow282
@anonymushadow282 Год назад
graciaaaas esto es algo que nunca supe como se hacia ni como se llamaba como para poder buscarlo, encontraba el como hacer login y registro pero nadie me explicaba como proceder una vez logeado
@gabrielagalvis4775
@gabrielagalvis4775 6 месяцев назад
Hola, ¡Muchísimas gracias por el tutorial! Eres el que mejor explica estos temas, sería muy útil que subieras un vídeo explicando como hacer autenticación con roles de usuario y diferentes accesos y permisos, así como en este video con el js normal, no he podido encontrar un solo tutorial que lo explique sin usar frameworks :(
@reneramos1557
@reneramos1557 7 месяцев назад
Muchas gracias por este tutorial me esta ayudando mucho, muy buena explicación
@ZBROOS
@ZBROOS Год назад
Gracias Fazt! Buen fin de semana :)
@demavares
@demavares Год назад
Increíblemente genial, mil gracias por este video.
@diegomoguel1818
@diegomoguel1818 Год назад
Me estoy empezando a interesar en esto y voy a dedicarme a ver todos tus vídeos con tal de aprender algo, o recomiéndame algo, en verdad me gustaría aprender
@ggg_galan
@ggg_galan Год назад
Gracias a ti estoy aprendiendo a programar ☠️ de Corazón, gracias
@fidelp27
@fidelp27 Год назад
Excelente! Un grande Fazt! Hyper claro todo!
@1vickfaby
@1vickfaby 7 месяцев назад
Demasiado bueno y útil este curso
@MrEduleon78
@MrEduleon78 Год назад
Fazt de verdad gracias por el video y la enseñanzas, muestras de forma clara y sencillas herramientas de vanguardia. Siempre trato de guiarme por tus ejemplos pero en este caso el ejemplo del video no es el mismo del repositorio, entre para consultar unas líneas de código pero no es lo mismo! :(
@rayoseldev819
@rayoseldev819 Год назад
muy bien explicado cómo siempre, eres un crack, super top de youtube!
@deepernature2358
@deepernature2358 Год назад
PREGUNTA: Por favor, si puedes explicar como esconder credenciales Firebase al pasar a modo producción... MIL GRACIAS POR TUS VIDEOS; LOS MEJORES. Todo lo que explicas se entiende a la perfección, paso a paso, GENIAL, MIL gracias de nuevo!!
@WILLL859
@WILLL859 Год назад
eso fue super rapido. Esto vale oro
@unlimited_code
@unlimited_code Год назад
Hola mi querido y estimado Fazt!
@MrFacundoruiz
@MrFacundoruiz Год назад
Un excelente Ejemplo, cerrando un circulo
@marcosnochebuena6291
@marcosnochebuena6291 Год назад
Buen video, seria genial si adaptaras esto para una aplicacion de React Native. Gracias por la informacion
@ivanes285
@ivanes285 Год назад
Que buenos videos Fast
@sandrogonzalez118
@sandrogonzalez118 Год назад
thanks, it actually let me through so i could download it.
@brawnie3969
@brawnie3969 14 дней назад
Gracias por el tutorial
@tonalliisaiasgarciagarcia3973
@tonalliisaiasgarciagarcia3973 10 месяцев назад
Excelente contenido, me sirvio mucho amigo, sos groso sabelo
@brianacevedoramirez2142
@brianacevedoramirez2142 Год назад
Excelente contenido!
@TheArmandoMartinez
@TheArmandoMartinez 10 месяцев назад
Excelente tutorial...!
@axtron1468
@axtron1468 Год назад
Hola Fazt, tus videos son los mejores, y queria saber si algun día haras un curso de c# 😅😁
@FrankGP.com.
@FrankGP.com. Год назад
gracias por el tutorial
@wdelcanto
@wdelcanto Год назад
Gracias crack. Mis peticiones han sido escuchadas jajaj.
@wdelcanto
@wdelcanto Год назад
Esperare ese curso premium, ya que me han servido bastante tus tutoriales 🤩
@mariaortega8171
@mariaortega8171 Год назад
muy bueno!!! me has ayudado un montón!
@pupoxws983
@pupoxws983 Год назад
EXCELENTE, GRACIAS
@nesidaligarcia4116
@nesidaligarcia4116 Год назад
Muchas gracias Fazt, estoy usando vue + firebase y este video me ayudo a despejar algunas dudas que tenia.
@cientifica9150
@cientifica9150 Год назад
para que sirve vue? soy nueva en esto y me ha picado la curiosidad
@nesidaligarcia4116
@nesidaligarcia4116 Год назад
@@cientifica9150 Vue es un framework de javascript que nos facilita la vida a la hora de desarrollar el front-end de una aplicación web
@cientifica9150
@cientifica9150 Год назад
@@nesidaligarcia4116 Ya veo! Muchas gracias amigo por explicarme
@juandicaprio-guillermodelt9294
Muy Buen Video , gracias Por compartirlo. Si puedes profundizar más en el tema estaria muy gradecido: Por ejemplo como hacer si el usuario quiere recuperar su contraseña se le olvida y la quiere recuperar.Muchas gracias de antemano !!! Eres el mejor un saludo desde colombia.
@SanchayanPackiyanathan
@SanchayanPackiyanathan Год назад
Gracias Amigo!!!
@TendenciaAndroid
@TendenciaAndroid Год назад
Me salvaste la vida jajaja Gracias!!
@YODA5919
@YODA5919 Год назад
Buen video saludos
@lock_9983
@lock_9983 Год назад
Siempre 10/10
@Que_Risa_Causa
@Que_Risa_Causa Год назад
Genial!
@yeisondavidcorreacuellar9615
buen video!
@julioenriquecorrealtorres9000
Excelente video, muchas gracias. Una pregunta de urgencia, luego de tener los valores del usuario, cómo subirlos al Realtime Database de Firebase?
@exodavid0780
@exodavid0780 Год назад
SOS un crack
@elliscaicedo9045
@elliscaicedo9045 Год назад
seria increíble con express y postgress, aun mas genial con testing unitario! saludos
@dariodwc
@dariodwc Год назад
Muy buen tutorial, muy claro , mas allá de que la voz es irritante con esas muletillas y coletillas desagradables al oído ( por fortuna se puede poner subtítulos ) el material es excelente
@bellosalcedooswaldo
@bellosalcedooswaldo Год назад
Excelente video Fazt, ¿Que tema tienes en VS Code que marca monitor de RAM y CPU en Terminal?
@sergiocotero6622
@sergiocotero6622 Год назад
Genial...
@neyjunoir
@neyjunoir Год назад
muy bueno fazt gracias crack una pregunta tu nunca haces videos sobre Android studio o kotlin ?? para aplicaciones Android
@Polly1
@Polly1 Год назад
Excelentes cursos brindas Fazt. Cuando un cirso de Sql o MongoDb?? Saludos!!!
@piojosevaldivia2676
@piojosevaldivia2676 7 месяцев назад
excelente video me ayudo mucho puedes hacer uno como agregarle roles como usuario,administrador y gestor por favor
@amdresscavalcante9545
@amdresscavalcante9545 Год назад
buena fazt
@MrJuancho2706
@MrJuancho2706 Год назад
Wow siento que te amo jajaja, haras algun tuto de esos de 5 horas pero uso completo de Firebase? muchas gracias
@oksanathenextstep
@oksanathenextstep Год назад
Fazt! Excelente! Solo me quedo una duda, cuando haces deploy te pueden acceder a las credenciales de Firebase? No entiendo si todo es front end, como ocultas esas credenciales en producción? Las credenciales no han quedado fuera de "src" :(
@josainsite5141
@josainsite5141 3 месяца назад
Ojalá pudieras repricarlo con arquitectura limpia en express. Te llevaria al siguiente nivel, gracias
@benjabrielvaldez6968
@benjabrielvaldez6968 Год назад
:V nice XD Maravilloso
@oscargrande9766
@oscargrande9766 Год назад
Fazt has visto turbopack? gracias por todo tu contenido!!!!
@luismiguelbaldemora13
@luismiguelbaldemora13 Год назад
si buenas, hola fazt soy yo luis miguel bro yo ciempre veo tus video y de verdad que que eres el mejor en el area de programacion, quiero que sepas que estoy muy agradecido contigo bro por tus video, solo queria preguntarte que hay algun modo de poner en mi pagina web una auto dezplasacion al entrar en ella
@cristianmendoza1915
@cristianmendoza1915 Год назад
Gracias por tus vídeos, una consulta, cómo puedo agregar al documento creado en firestore el uid del usuario logueado agradezco tu ayuda y tiempo
@ferxas4560
@ferxas4560 Год назад
¿Has estado considerando un curso de PHP? Entiendo que es un lenguaje "muerto", pero sigue estando fuerte. Saludos Fazt y excelente video, echaré una práctica este finde con tus vídeos!
@Javi-Crypto
@Javi-Crypto Год назад
Colega, me gustaría ver un ejemplo con verificación de e-mail. Por ejemplo digitando un código de verificación enviado al correo cuando se realiza el alta. Limitando el acceso cuando el usuario cuando éste no se haya verificado. Yo personalmente puedo hacerlo, pero quizás pueda ser beneficioso para tu comunidad.
@fernandojosesoteloromero9418
Excelente idea, en caso de que no se logre hacer tambien podrias tu hacer un tutorial acerca de eso y compartirlo a la comunidad!
@Holri
@Holri Год назад
Master 🥵
@gabrielpaniagua1618
@gabrielpaniagua1618 Год назад
PRIMER COMENTARIO , Genio Fazt
@gabrielpaniagua1618
@gabrielpaniagua1618 Год назад
lo vere en varias partes al video . se agradece el Índice del Tutorial:
@eduardocanelo3973
@eduardocanelo3973 Год назад
Hola Fazt estoy muy emocionado con el contenido de tu video, soy nuevo en este mundo de la programacion y estoy teniendo el siguiente problema en la consola: Uncaught Error: Component auth has not been registered yet ; es posible que me ayudes con este error?
@emmanuelareiza9699
@emmanuelareiza9699 Год назад
Patrce Faaaaaaaaaaaaaaaaaaaazt El mejoooooooooooooooooor
@Deus-lo-Vuilt
@Deus-lo-Vuilt Год назад
Bro de casualidad , harás algo sobre como hacer para enviar el correo de verificacion antes de dejarlos entrar a la app y tengan que verificar su correo?
@Shimuya
@Shimuya Год назад
likazo
@cientifica9150
@cientifica9150 Год назад
Una pregunta, es seguro que los datos aparezcan en consola? o es solo a modo de ejemplo? digo, no seria posible que alguien pudiera robar estos datos mediante la consola? Lo siento si mi pregunta es un poco estupida, soy novata en este tema, gracias por tu genial video!! :D
@pabloandres7047
@pabloandres7047 Год назад
Hola pana gracias por el contenido, tienes perfil en Linkedin?
@ZONANORTE247
@ZONANORTE247 Год назад
muy buen video deberia a ver mas de firebase o un curso, si lo hay porfavor pasarmelo... el hosting esta deprecado
@Emma-eb5zb
@Emma-eb5zb Год назад
Fazt, has pensado en hacer algo sobre .NET core?
@josephchavez7185
@josephchavez7185 Год назад
Cuando importo "./firebase.js" en la consola me sale un error de CORS, como lo soluciono? help uu
@neilcameroledezma3365
@neilcameroledezma3365 11 месяцев назад
Saludos Fazt, encontré un problema con los enlaces CDN, si no estan actalizados estrictamente en las linias de los modulos Js. se detiene la App. ¿Entonces Esto nos obligaría a estar siempre pendientes de Firebase Documentation para estar al día de los enlaces CDN?
@romialdro4766
@romialdro4766 9 месяцев назад
Lo amo, saben si tiene ciberseguridad?
@javierromero6024
@javierromero6024 Год назад
Sería excelente auth Firebase con Redux y rutas protegidas basada en roles...
@MarisolFlores-jx6bg
@MarisolFlores-jx6bg Год назад
hola que tal queria preguntar que cuando en sigIn se registra el correo con google en los usuarios pero cuando se quiere solo entrar y no registrarse entre los usuarios, esque no lo busca sino solo lo registra, como se le hace para que no lo registre sino que lo busque
@andersonrosa8085
@andersonrosa8085 Год назад
gracias por el vídeo muy útil. Podrías refrescar el browser para ver si la applicacion persiste la session? o el usuario deveria iniciar sesion otra vez.
@FaztTech
@FaztTech Год назад
Cuando refrescas la página, ese oauth state changed restablece la sesión, Justo cuando lo establezco recuerdo que refresco la página varías veces :)
@rogerj9411
@rogerj9411 Год назад
Estoy comenzando a creer lo que he leido en los comentarios => (Dios Fazt) = { mis pensamientos y dudas return videos reciente de fast } jajajaj inteligencia alienígena fazt?
@amdresscavalcante9545
@amdresscavalcante9545 Год назад
tal vez no lo han pensado pero un spa de cero combinado con pwa seria posible??
@KanguroJack___
@KanguroJack___ Год назад
Fazt, qué pasó con los videos de Twitch? Quería revisar algo y ya no hay ninguno
@ivanvazquez826
@ivanvazquez826 Год назад
Funcionará con react? Por cierto muchas gracias, es algo que estaba necesitando. Grande Fazt
@FaztTech
@FaztTech Год назад
SI claro, hace tiempo tambien hice un ejemplo con react y esta version de firebase, te dejo el enlace ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-H_vEJt5Id_I.html
@soydev8484
@soydev8484 11 месяцев назад
Hola excelente video. Lo único que quiero implementarlo. Y usando los mismos archivos que tú No me funciona al hacer click en los botones Google, facebook, ni por correo y contraseña. Cambie los datos. Puse los de mi proyecto, y tmb cambie el número de FIREBASE 9.10.0 a 10.0.0 y no me funciona. No sé si habrá que tocar algo en consola ??????
@samuelclaros8550
@samuelclaros8550 Год назад
sabes por que al momento de ingrear funciona en localhost pero no en al subir la pagina ya con el dominio y todo
@fidelp27
@fidelp27 Год назад
Fazt, cómo guardamos las variables de entorno en este proyecto? He intentado y nada que me sale. Si me puedes dar una pista te lo agradecería un montón
@serranocrespojosemanuel9798
¡Excelente! ¿Qué tema usas para Visual Studio?
@FaztTech
@FaztTech Год назад
Esta es la lista de los plugins incluido el tema: ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-9iqmT6dXYik.html
@chabellylezcano415
@chabellylezcano415 Год назад
Existe alguna forma de hacer esto con una base de datos de MySQL?
@LuisSanchezYT
@LuisSanchezYT 9 месяцев назад
A mi me sale "The requested action is invalid." al momento de usar el signInWithPopup, No encuentro ninguna solución para esto 😢 porfavor ayuda...
Далее
Проверил на логику певца L’one
00:17
Обзор ЛЮКС вагона в поезде
01:00
Просмотров 763 тыс.
ОН ТОЧНО ЗАЕДЕТ. ВЕЗДЕХОД АГ-34.
41:09
Como usar ChatGPT para ser más productivo
39:30
Просмотров 37 тыс.
Frontend vs Backend vs DevOps ¿Cual escoger?
14:07
Просмотров 32 тыс.