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.
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
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.
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.
¡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 ... ;-)
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.
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
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
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!
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 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.
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 :)
Muy buen video! puedes explicar como hacer para que sean notificaciones autenticadas? por ejempolo que solo se notifique a un grupo de personas? gracias
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
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?
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.
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
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?
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.
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
Sos un Master, no por el conocimiento, sino por compartir GENEROSAMENTE. Gracias Fazt!!!!
Excelente Titán, el mejor RUclipsr que conozco.!
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.
muchas gracias Fazt! me salvaste muchas veces, no sabia que era ni mucho menos como funcionaba el service-worker
La verdad me cuesta creer que solo tengas 80k de suscriptores. Recomendémoslo mas chicos y chicas !!
Q ganas tenia de que explicaras esto🎉🎉
Excelente amigo, con vos si se aprende, que proyectos para profesionales.
Eso sí me interesa. Gracias crack! 😜 Ya casi cumples 5 años en RUclips 😳
Dejo mi like sin ver el video esto se sabe que es calidad, Gracias Fazt
Muy didáctico y bien explicado!!
Gracias Fazt eres el mejor! me has sacado de muchos problemas!
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.
Super, fuiste explicando muy bien, sigue así.
Excelente como siempre. muchas gracias.
Me encantan tus vídeos broo tenes talento. Me gustaría que hicieras algún sistema distribuido que maneje concurrencia estaría genial
Excelente tutorial Fazt Gracias
Haras un Curso de PWA?
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
14:30 comando web push PRIVATE KEY PUBLIC KEY
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.
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.
Gracias, justo lo que necesitaba :)
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
timestamp to watch later: 17:28
¡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, muchas gracias
15:09 VARIABLES DE ENTORNO
Me pregunto como es que funciona si se supone que los service workers solo van sobre https
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
Hola fazt, has usado o conoces un ORM llamado Prisma? Sabes si se puede integrar sin GraphQL?
Podrias hacer un turorial de PWA con VueJS?
Muchas Gracias maestro Fazt!
Excelente, muchas gracias ='D
Push notification con firebase y angular 🙌🙌🙌🙌 pls
Hola Fazt! esto lo puedo hacer directamente con react?
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.
Grande Fazt. :)
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
Vi una pregunta que es muy buena: Solo funciona en Chrome?
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.
Más vídeos de Arduino junto con nodejs gracias profe
Maestro como siemore ☺️
Si uso vue, como puedo enviar notificaciones al llegar tal fecha
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
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?
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
Hola. Quisiera saber si puedes hacer un video de introducción a scala.. SALUDOS DESDE ECUDOR 🇪🇨
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, como haría para que se muestren también en el teléfono?
fazt mi hosting debe tener nodejs para que funcione las notificaciones?.
Sería muy bueno una pwa !
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 esto tambien puede servir para aplicaciones de escritorio tipo windows forms?
Excelente video.
si estoy haciendo una app con react native para android y IOS sirven las notificaciones?
Y si quiero mandar mensaje a muchos dispositivos?
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, buenisimos videos!, duda: ¿las notificaciones solo funcionan en google chrome?
No, son una API del navegador.
Fazt para instalar web-push en typescritp es posible? Estoy intentado usarlo pero el module @types no lo encuentra
haz otro video para php!
Muy buen video! puedes explicar como hacer para que sean notificaciones autenticadas? por ejempolo que solo se notifique a un grupo de personas? gracias
¿Esto es como el web sockets?
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
¿como lo puedo implementar del ladod el servidor?
Buenas tardes, buen video, podrias hacer un video con servidor https y serverworker?
Haz un tutorial guardando las suscripciones!
vamos hazlo ajaja!
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?
Buena, no pude terminar no me funciona el endpoint..
Me llegó a funcionar pero no funciona en android lo cual no lo hace muy práctico
Por cierto, en reactjs solamente con instalar el create react app ya viene configurado como PWA ?
si
@@davidisrael8937 gracias
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?
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
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?
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
Alguien sabe cómo mandar notificaciones a un usario específico?
bro como seria para enviar notificaciones a diferentes usuarios que estan en una bd :/
encontraste la manera? tambien buscaba ese tema...
Esto es un websocket?
noo, web push
¿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.
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
crack, c':
Deberias subir el proyecto gratis para que uno pueda descargarlo
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