Han pasado 4 años que publicaste este video, pero aun asi es el unico que me ayudo a implementar las notificaciones push en mi App Web. Increible. Eres grande Fazt
Honestamente no me suscribo a ningún canal de youtube, pero tus videos son magníficos, soy desarrollador desde hace 13 años y tu conocimiento es extraordinario. Me gusta que vas a la práctica no como muchos otros que dan míl vueltas y no dicen nada, felicidades.
Otra vez la hiciste! excelente el material que has compartido. Con esa libreria evitaría la suscripción a FCM y podria pasar a gorush los datos!!! Hoy mismo hago el experimento. Gracias de verdad te pasaste.
El video está genial, super claro. Miré varios sobre el tema y es el más práctico, sin vueltas. Lamentablemente no logré que me funcionen las notificaciones en ningúnn navegador. En Firefox me pidió los permisos en los otros ni eso, y tengo los permisos correctos. El subscribe funciona y el send-message hace el post pero luego nada vuelve. Estoy en Windows 10.
42:11 En mi caso que tengo Windows 10 la notificación se puede ver en el centro de acciones de Windows. Hagan Click en el icono de globo de texto que esta al lado de la fecha y hora de Windows.
Hola Fast Code!, tengo una web en el cual tengo dos tipos de usuarios el usuario 2 le envía información al usuario 1 a través de un form, pero la única manera de que el usuario 1 sepa que ele enviaron una información es hacer f5, siempre y cuando el usuario 1 este en su dashboard, vi tu video es excelente!, y casi se ajusta a la necesidad, te agradecería mucho tu guía para poder solucionarlo. MUCHAS GRACIAS!
varios problemas con el codigo: no ejecuta en brave de forma correcta SALE ESTE ERROR:(DOMException: Registration failed - push service error) y en celulares parece que ni pregunta para activar notificaciones, el codigo y la explicacion esta de 10, una lastima que no se ejecute de forma correcta en el telefono o en ciertos navegadores
seria posible enviar notificaciones push pero discriminadas por usuario/navegador? es decir que una notif. se vea solo en un navegador y no en otro... de acuerdo al usuario.
¡Que bueno este primer paso en las PWA! Si puedes darnos otros "pasos" de las WPA sería fantástico! A mi me pasa algo raro: me funciona en la distro de linux lite con Chromium y no me funciona en Win 10 con Chrome.... tendría que averiguar si hay algo que me impide este push ... ;-)
Hey I have now seen your video and wanted to ask if it is also possible to select a date as a user on which a push message should be sent. So like a todo list where you are notified when you want that. You have a Html datetime and select a date and on the date it is only displayed. Is that possible and if so how exactly? Thanks :)
React solo necesitas seguir los pasos de google analyzer para crear una pwa unicamente, poco a pocoo no importa si es en react pero es mejor que busques por tu cuenta
Hola Fazt, una pequeña consulta. Me va muy bien el paso a paso. Cuando escribo en la caja de texto, veo en la consola el json con el title y el message. Pero visualmente no me sale la notificación! Tengo activadas las notificaciones en mi navegador. Qué puedo hacer, gracias de antemano! Excelente tutorial.
Hola, ya paso tiempo, pero te comento que al dia de hoy no funciona el ejemplo, todo está correcto sin errores, el worker registrado y funcionando pero la notificacion self.registration.showNotification( no se ve en el terminal. Nota que estoy con IOS y chrome.
Gracias bro, excelente trabajo. Me ha servido de mucho. Tengo un detalle. Me funciona perfecto en Chrome y Edge, pero cuando envio la notificación a un cliente Firefox, el 'webpush.sendNotification' me arroja este error: Request did not validate missing authorization header. Code 401 Sabes cuál header me hace falta?
hola, primero felicitaciones, por el video, queria que me aclares algo, por lo que veo en las repuestas del worker, usa FCM. api?, eso puede desactivarse, o es mejor directamente el plug de FCM?. gracias.
Muy buen video! puedes explicar como hacer para que sean notificaciones autenticadas? por ejempolo que solo se notifique a un grupo de personas? gracias
Hola. Gracias por el tutorial. Dios te acompañe. Tengo una pregunta, ¿el servicio requiere de internet? Si ejecuto todo en una red local aislada, ¿seguirían funcionando las notificaciones?
Implementé la solución y sí requiere de internet pues utiliza Firebase. Según la doc de Google, explica las características que debería tener tu servidor para utilizar esta funcionalidad, pero al final te sugiere utilizar Firebase, que pena.
Buen video, esto también puede funcionar para aplicaciones móviles?. Entonces si creamos nuestro propio servicio de notifications esto sustituiría a un alquiler servicios de terceros (One-push, Firebase)? Saludos Fazt Code
Se lo hace pero lo unica es que se tiene parecido un web socket entonces creo que deberias pensar o ver si te conviene y tu server aguantara tantas peticiones o envios de estas
@@yonaasael3945 lo mismo pense, pero tengo una consulta y como haria para enviar notificaciones si ya cerranron mi pagina asi como lo hacen las paginas de noticias,curiosidades etc
Tengo una duda. Al enviar la notification esta se ve reflejada en todos los dispositivos que aceptaron recibir notificaciones del sitio o solo en el mio?
Gracias Feazt, muy bueno el video. Una duda, lo he probado en un eroku, pero si por ejemplo me suscribo con varios navegadores, solo el ultimo recibe la push, hay forma de todos la reciban? y en caso de tener front en otro server, como se vincula con el servicio de push del backend? gracias.
Supongo que tienex que ir guardando las suscripciones de los usuarios, es decir, guardar los endpoint en un array y luego recorrerlos y mandarlos a cada suscripcion
mi estimado sera que me puesdes ilustrar como hacer para enviar una notificacion a un cliente en especifico, si se ocupa firebase te permite almacenar un token del cliente pero en este video no logro ver algo similar y me gustaria dejar de ocupar firebase gracias por todo y del tiempo que nos da para poder aprender con tus video
@@mauriciogiraldo937 si ya muchas gracias ahora lo que tengo es que en el momento de ocupar Jose para verificar mi coockie extraer el dato que lo ocupo para realizar una consulta cuando retorna a la vista me da un error 500 si quito la linia qué verifica si la coockie es válida no tengo ningún error
Excelente video :D tengo una consulta y como haria para enviar notificaciones si ya cerraron mi pagina asi como lo hacen las paginas de noticias,curiosidades etc, seria tambien con tambien con esta api?
Muy buen video!, una pregunta soy un poco nuevo en esto, como debería organizar las carpetas para subirlo a un servidor online? ya que el servidor ejecuta index.php o index.html, intente reorganizarlas y cambie las direcciones para que se me ejecutara el index.html y no me funciono en el servidor online. :(
Php y html se ejecutan en un servidor de apache, en node es algo distinto. Primero debes instalar node en tu servidor, luego correr un script para iniciar tu servidor, en este caso fazt usa express. Cuando ya tengas tu servidor corriendo deberás crear las rutas en donde quieres que mande los archivos html y usar la función res.send() para enviar el archivo a la ruta.
Abrí el puerto en windows para poder acceder a la app de node remotamente desde un celular para probar las notificaciones, pero las notificaciones se muestran en la computadora, no en el celular jajaj
Han pasado 4 años que publicaste este video, pero aun asi es el unico que me ayudo a implementar las notificaciones push en mi App Web. Increible. Eres grande Fazt
Hola, lo hiciste funcionar en alguna web en producción?
Honestamente no me suscribo a ningún canal de youtube, pero tus videos son magníficos, soy desarrollador desde hace 13 años y tu conocimiento es extraordinario. Me gusta que vas a la práctica no como muchos otros que dan míl vueltas y no dicen nada, felicidades.
Excelente Titán, el mejor UA-camr que conozco.!
Sos un Master, no por el conocimiento, sino por compartir GENEROSAMENTE. Gracias Fazt!!!!
Muchas gracias por todo, mi profesor insistia en que usara Google, pero tus tutoriales son sencillos organizados y minimalistas
Si luego como que omiten pasos y te quedas de que tengo que hacer ahora... A veces
van casi 3 a;os que programo y siempre vuelvo a fazt!.. Todas las respuestas, gracias por tanto.
Otra vez la hiciste! excelente el material que has compartido. Con esa libreria evitaría la suscripción a FCM y podria pasar a gorush los datos!!! Hoy mismo hago el experimento.
Gracias de verdad te pasaste.
La verdad me cuesta creer que solo tengas 80k de suscriptores. Recomendémoslo mas chicos y chicas !!
muchas gracias Fazt! me salvaste muchas veces, no sabia que era ni mucho menos como funcionaba el service-worker
El video está genial, super claro. Miré varios sobre el tema y es el más práctico, sin vueltas. Lamentablemente no logré que me funcionen las notificaciones en ningúnn navegador. En Firefox me pidió los permisos en los otros ni eso, y tengo los permisos correctos. El subscribe funciona y el send-message hace el post pero luego nada vuelve. Estoy en Windows 10.
Dejo mi like sin ver el video esto se sabe que es calidad, Gracias Fazt
Q ganas tenia de que explicaras esto🎉🎉
42:11 En mi caso que tengo Windows 10 la notificación se puede ver en el centro de acciones de Windows. Hagan Click en el icono de globo de texto que esta al lado de la fecha y hora de Windows.
Excelente amigo, con vos si se aprende, que proyectos para profesionales.
Eso sí me interesa. Gracias crack! 😜 Ya casi cumples 5 años en UA-cam 😳
Gracias Fazt eres el mejor! me has sacado de muchos problemas!
timestamp to watch later: 17:28
14:30 comando web push PRIVATE KEY PUBLIC KEY
Me encantan tus vídeos broo tenes talento. Me gustaría que hicieras algún sistema distribuido que maneje concurrencia estaría genial
Me pregunto como es que funciona si se supone que los service workers solo van sobre https
Super, fuiste explicando muy bien, sigue así.
Hola Fast Code!, tengo una web en el cual tengo dos tipos de usuarios el usuario 2 le envía información al usuario 1 a través de un form, pero la única manera de que el usuario 1 sepa que ele enviaron una información es hacer f5, siempre y cuando el usuario 1 este en su dashboard, vi tu video es excelente!, y casi se ajusta a la necesidad, te agradecería mucho tu guía para poder solucionarlo. MUCHAS GRACIAS!
Como hiciste amigo? Necesito enviarle la notificacion a un grupo de usuarios con cierto Id
varios problemas con el codigo: no ejecuta en brave de forma correcta SALE ESTE ERROR:(DOMException: Registration failed - push service error) y en celulares parece que ni pregunta para activar notificaciones, el codigo y la explicacion esta de 10, una lastima que no se ejecute de forma correcta en el telefono o en ciertos navegadores
Muy didáctico y bien explicado!!
seria posible enviar notificaciones push pero discriminadas por usuario/navegador? es decir que una notif. se vea solo en un navegador y no en otro... de acuerdo al usuario.
Ya hice todo lo que me dijiste pero debo ahora ponerlo en practica en mi pagina web
pero no se como ya que tu defines public como el contenido
¡Que bueno este primer paso en las PWA! Si puedes darnos otros "pasos" de las WPA sería fantástico! A mi me pasa algo raro: me funciona en la distro de linux lite con Chromium y no me funciona en Win 10 con Chrome.... tendría que averiguar si hay algo que me impide este push ... ;-)
Excelente como siempre. muchas gracias.
Si uso vue, como puedo enviar notificaciones al llegar tal fecha
fazt mi hosting debe tener nodejs para que funcione las notificaciones?.
Gracias, justo lo que necesitaba :)
si estoy haciendo una app con react native para android y IOS sirven las notificaciones?
15:09 VARIABLES DE ENTORNO
Push notification con firebase y angular 🙌🙌🙌🙌 pls
hola fazt me encanta que subas estos videos sigue asi eres fantastico tengo una pregunta es mujar frameworks como angular,reac,vue o usar ejs,hbs etc
Excelente tutorial Fazt Gracias
Hola, como haría para que se muestren también en el teléfono?
Hey I have now seen your video and wanted to ask if it is also possible to select a date as a user on which a push message should be sent. So like a todo list where you are notified when you want that. You have a Html datetime and select a date and on the date it is only displayed. Is that possible and if so how exactly? Thanks :)
Fazt para instalar web-push en typescritp es posible? Estoy intentado usarlo pero el module @types no lo encuentra
Podrias hacer un turorial de PWA con javascript?
Una PWA en react
@@jhonneirachise6464 Esa funcion ya la tiene ReactJS checa en el archivo index.js de src, solo cambia unregister por register y listo ;)
@@davidisrael8937 Tienes tener en cuenta si es con create-react-app ya que sin ese metodo, es un poco más complicado:)
React solo necesitas seguir los pasos de google analyzer para crear una pwa unicamente, poco a pocoo no importa si es en react pero es mejor que busques por tu cuenta
Hola Fazt! esto lo puedo hacer directamente con react?
Primero lo primero, insisto en que crees tutoriales en Udemy.
Gracias por tu aporte a los apasionados por la tecnología
para que los quieres en udemy si aqui nos da su conocimiento este crack
@@oscarescamilla5627 Exacto nos da conociemiento libre en udemy tendria que pagar y tomarse su tiempo pero depende mucho que quieras hacer
saludos, en el playload que envias se puede pasar parametros ademas de title y message?
Más vídeos de Arduino junto con nodejs gracias profe
Vi una pregunta que es muy buena: Solo funciona en Chrome?
Grande Fazt. :)
Y si quiero mandar mensaje a muchos dispositivos?
Haras un Curso de PWA?
Hola fazt, has usado o conoces un ORM llamado Prisma? Sabes si se puede integrar sin GraphQL?
Hola Fazt, una pequeña consulta. Me va muy bien el paso a paso. Cuando escribo en la caja de texto, veo en la consola el json con el title y el message. Pero visualmente no me sale la notificación! Tengo activadas las notificaciones en mi navegador. Qué puedo hacer, gracias de antemano! Excelente tutorial.
Hola, ya paso tiempo, pero te comento que al dia de hoy no funciona el ejemplo, todo está correcto sin errores, el worker registrado y funcionando pero la notificacion self.registration.showNotification( no se ve en el terminal. Nota que estoy con IOS y chrome.
Como lo solucionaste máster?
Muchas Gracias maestro Fazt!
Hola esto tambien puede servir para aplicaciones de escritorio tipo windows forms?
Gracias bro, excelente trabajo. Me ha servido de mucho. Tengo un detalle.
Me funciona perfecto en Chrome y Edge, pero cuando envio la notificación a un cliente Firefox, el 'webpush.sendNotification' me arroja este error:
Request did not validate missing authorization header. Code 401
Sabes cuál header me hace falta?
Podrias hacer un turorial de PWA con VueJS?
hola, primero felicitaciones, por el video, queria que me aclares algo, por lo que veo en las repuestas del worker, usa FCM. api?, eso puede desactivarse, o es mejor directamente el plug de FCM?. gracias.
Hola. Quisiera saber si puedes hacer un video de introducción a scala.. SALUDOS DESDE ECUDOR 🇪🇨
Excelente, muchas gracias ='D
Muy buen video! puedes explicar como hacer para que sean notificaciones autenticadas? por ejempolo que solo se notifique a un grupo de personas? gracias
Me llegó a funcionar pero no funciona en android lo cual no lo hace muy práctico
Hola. Gracias por el tutorial. Dios te acompañe.
Tengo una pregunta, ¿el servicio requiere de internet? Si ejecuto todo en una red local aislada, ¿seguirían funcionando las notificaciones?
Implementé la solución y sí requiere de internet pues utiliza Firebase. Según la doc de Google, explica las características que debería tener tu servidor para utilizar esta funcionalidad, pero al final te sugiere utilizar Firebase, que pena.
Excelente, muchas gracias
Maestro como siemore ☺️
¿como lo puedo implementar del ladod el servidor?
Sería muy bueno una pwa !
Buen video, esto también puede funcionar para aplicaciones móviles?. Entonces si creamos nuestro propio servicio de notifications esto sustituiría a un alquiler servicios de terceros (One-push, Firebase)? Saludos Fazt Code
Se lo hace pero lo unica es que se tiene parecido un web socket entonces creo que deberias pensar o ver si te conviene y tu server aguantara tantas peticiones o envios de estas
@@yonaasael3945 lo mismo pense, pero tengo una consulta y como haria para enviar notificaciones si ya cerranron mi pagina asi como lo hacen las paginas de noticias,curiosidades etc
Tengo una duda. Al enviar la notification esta se ve reflejada en todos los dispositivos que aceptaron recibir notificaciones del sitio o solo en el mio?
en todos
Gracias Feazt, muy bueno el video.
Una duda, lo he probado en un eroku, pero si por ejemplo me suscribo con varios navegadores, solo el ultimo recibe la push, hay forma de todos la reciban?
y en caso de tener front en otro server, como se vincula con el servicio de push del backend?
gracias.
Supongo que tienex que ir guardando las suscripciones de los usuarios, es decir, guardar los endpoint en un array y luego recorrerlos y mandarlos a cada suscripcion
Hola...buen video ,no me queda muy claro que funcionalidad le puede hacer a mi app si agrego eso ..Si alguien me puede ayudar :C
Excelente video.
¿Esto es como el web sockets?
Por cierto, en reactjs solamente con instalar el create react app ya viene configurado como PWA ?
si
@@davidisrael8937 gracias
Buena, no pude terminar no me funciona el endpoint..
Haz un tutorial guardando las suscripciones!
vamos hazlo ajaja!
bro como seria para enviar notificaciones a diferentes usuarios que estan en una bd :/
encontraste la manera? tambien buscaba ese tema...
Fazt, buenisimos videos!, duda: ¿las notificaciones solo funcionan en google chrome?
No, son una API del navegador.
mi estimado sera que me puesdes ilustrar como hacer para enviar una notificacion a un cliente en especifico, si se ocupa firebase te permite almacenar un token del cliente pero en este video no logro ver algo similar y me gustaria dejar de ocupar firebase gracias por todo y del tiempo que nos da para poder aprender con tus video
Ya sabes como enviarle la notificacion a personas específicas?
@@mauriciogiraldo937 si ya muchas gracias ahora lo que tengo es que en el momento de ocupar Jose para verificar mi coockie extraer el dato que lo ocupo para realizar una consulta cuando retorna a la vista me da un error 500 si quito la linia qué verifica si la coockie es válida no tengo ningún error
@@tomassalazar9000 me podrias enseñar como hacerlo?
Alguien sabe cómo mandar notificaciones a un usario específico?
Excelente video :D tengo una consulta y como haria para enviar notificaciones si ya cerraron mi pagina asi como lo hacen las paginas de noticias,curiosidades etc, seria tambien con tambien con esta api?
Encontrarte algo?
encontraste algo?
Soy yo? o el Señor Fazt se escuchaba algo agotado?
haz otro video para php!
Buenas tardes, buen video, podrias hacer un video con servidor https y serverworker?
¿Soy el único que le gritaba a la pantalla cuando pegó el mismo texto en ambas key? xD
Muy buen video!, una pregunta soy un poco nuevo en esto, como debería organizar las carpetas para subirlo a un servidor online? ya que el servidor ejecuta index.php o index.html,
intente reorganizarlas y cambie las direcciones para que se me ejecutara el index.html y no me funciono en el servidor online. :(
Php y html se ejecutan en un servidor de apache, en node es algo distinto. Primero debes instalar node en tu servidor, luego correr un script para iniciar tu servidor, en este caso fazt usa express. Cuando ya tengas tu servidor corriendo deberás crear las rutas en donde quieres que mande los archivos html y usar la función res.send() para enviar el archivo a la ruta.
Esto es un websocket?
noo, web push
A alguien le aparece este error?
Error: You must pass in a subscription with at least an endpoint.
A mi me pasa lo mismo, pudistes resolverlo?
Buen video ;). Alguien que me recomiende alguna doc para hacer una pwa?
Google analyzer te da todos los pasos necesarios
Deberias subir el proyecto gratis para que uno pueda descargarlo
crack, c':
Abrí el puerto en windows para poder acceder a la app de node remotamente desde un celular para probar las notificaciones, pero las notificaciones se muestran en la computadora, no en el celular jajaj