This is a great introduction to regular notifications, but these are NOT push notifications, the video title is misleading. In order to make push notifications, you must pair the Notification API with the Push API (see MDN docs) in server workers. You should update the title of the video to reflect that.
Correction: this is known as a local notification, not a push notification. They are both part of the umbrella term of notifications but have entirely different implementations. A push notification is triggered with data sent from a remote origin, typically an APN (iOS), GCP (Android) or via the web push API connected to a remote server. The remote data provider pushes the data to the client, hence the term 'push notification'. A local notification is triggered from within a web page or app, and does not rely on a remote origin to provide data. The local notification can be displayed with data retrieved from a remote source, but this is not the same as a push notification.
this is what I've been looking for the entire video. I made a push notification with node NodeJS and I could still remember that there is VAPID thing you need to be able to send push notification. I was confused when he said you can send push notification with just client-side JavaScript.
My take away from this tutorial i just watched because it sounded interesting is: i know it exists, i know it is easy to do, i know where to find a tutorial. Thanks a lot Kyle
It is super easy to learn stuff about the notifications API, so it does not require much research, but the point still stands that he makes nice explanations. And that is all that matters. :thumbsup:
@@xdmemeguy no, you did not say that the notifications API is super easy and needs no research at all, you can literally just read the docs, there is no need for a tutorial, but I am not saying that this is a worthless video
great video about notifications! but beware! notifications only, not push notifications! for push notifications you must first subscribe to push notifications on a web page / site, and then the server will send those push notifications, no matter if the browser is on that page or that page is closed; of course, after receiving a push notification you will show it to the user like the examples in this video
@@ksrele yes you need a service worker on the client to listen for the notifications and you need some cryptography to communicate between the server and the client.
I'm the guy who told you to blink your eyes a bit more when you only had like 7k subscribers. Congratulations on 1 million, also you are doing good with blinking 👁️💪
As mentioned by @chronSyn below this is not a push notification, that requires a backend service to 'push' the notification based on some event to the browser even when you are not viewing the page. Google has a push api but most are paid and a little complex to implement.
Thanks for the tutorial... As in my case of Win10, go to [Settings] -> [System] -> [Notifications and Actions] then turn on [Get notifications from apps and other senders] and everything works fine...
Nice tutorial, thanks! Please do a tutorial on PWA & Web push notifications (for when the browser is closed to keep receiving notifications). They are kinda complex, but I think you will be able to explain them very clearly.
Great tutorial! Though the JS notification api isn’t fully supported on phones. It isn’t even possible on IOS as of now and chrome on android needs service workers. Just additional information :)
Would have really liked to see how the Notifications look and work for mobile usage. Also interesting would be the mobile Notifications on a PWA, which looks and feels like a mobile App.
![[#SHORTS CLIP] ครูอึ้ง กรรมการอึ้ง ฮ่าๆ l ซานิเบาได้เบา l One Playground](http://i.ytimg.com/vi/qeBTuMJs4t0/mqdefault.jpg)
This is a great introduction to regular notifications, but these are NOT push notifications, the video title is misleading. In order to make push notifications, you must pair the Notification API with the Push API (see MDN docs) in server workers. You should update the title of the video to reflect that.
Push API isn't supported by Safari.
+1
+1
+1
@@porroapp yea only on apps not safari which is a L
Correction: this is known as a local notification, not a push notification. They are both part of the umbrella term of notifications but have entirely different implementations.
A push notification is triggered with data sent from a remote origin, typically an APN (iOS), GCP (Android) or via the web push API connected to a remote server. The remote data provider pushes the data to the client, hence the term 'push notification'.
A local notification is triggered from within a web page or app, and does not rely on a remote origin to provide data. The local notification can be displayed with data retrieved from a remote source, but this is not the same as a push notification.
So the notification done in this way would work if the user is not with the page opened?
@@alexdominguess no it wont
@@alexdominguess no
this is what I've been looking for the entire video. I made a push notification with node NodeJS and I could still remember that there is VAPID thing you need to be able to send push notification. I was confused when he said you can send push notification with just client-side JavaScript.
thank you for the correction, if not because you, i'll misguided too
My take away from this tutorial i just watched because it sounded interesting is: i know it exists, i know it is easy to do, i know where to find a tutorial. Thanks a lot Kyle
Your tutorials are the best for me through the whole youtube. Useful information in every seconds, and nothing else.
Thank you Kyle. I'm from Uzbekistan and Im learning web programming. You really simplify the web!
This guy is God sent. The explanation is sooo clean
It's been great to have this video posted recently as I've been thinking about how to do this for my app. Thank you so much
Very useful video. Glad I'm part of your subscribed viewers Kyle. Keep it up!
Yet another high value tutorial. Thank you!
I will have to implament that next week at my job. Perfect timing. Thank you so much!
such a high value tutorial and info! thanks kyle!
Amazing tutorial, the best I've seen, it was well explained and in 11 minutes, thanks 👏💯👍😄👍
Your way Of Teaching Is Awesome ❤️
Very, very awesome Kyle! I've always wondered how these notifications work. Thanks!
I love the way you research something for a video. Now this can't be more explained than you have already done
It is super easy to learn stuff about the notifications API, so it does not require much research, but the point still stands that he makes nice explanations.
And that is all that matters. :thumbsup:
@@arjix8738 Thats what i said in fewer lines
@@xdmemeguy no, you did not say that the notifications API is super easy and needs no research at all, you can literally just read the docs, there is no need for a tutorial, but I am not saying that this is a worthless video
I’ve been thinking of additional features to my website and this helps alot thanks kyle❤️
Too good and an excellent addition to my code arsenal. Long live mate.
@John REST IN PISS QUEEN, SMOKING ON THE ROYAL PACK 🚬🚬🚬
@John 💀
@John Queen what??!! What are you on?
@John dude...
@John ayo
Thanks *Kyle* for sharing a good tutorial like this.
Thank you so much! Your clips are really useful for me and other people.
I was looking for this video in your channel. But now i got it. Big ❤ bro.
Stuff like this is awesome, I think your CSS stuff is good but this is what people really want!
This is a very good tutorial for notification. I just wanted to have this kind of feature for my project. Thanks😁
We need more videos like this!
i looked long time for a video like this. Thank you.
Thanks! I've been searching how to get it and this is brilliant :D
You make killer content 👍. Good teacher too!
Even without Push API , still, CONCISE,INFORMATIVE,MEANINGFUL...GREAT!
Wow, your knowledge is amazing. Thanks for all buddy!!
Thank you man i was looking for this video
Your the best in covering useful Javascript API's
you are such a good teacher man
I always wondered how this worked. Thanks!
Cheers for this tutorial man !
Damn. I needed this like a week ago lol. But it's still a great learning experience.
Great lesson, thank for sharing this. Tomorrow I will introduce this in some systems that Im building
Wow! Thank you so much for this video ... I learnt a lot in one video 😍😍😍
great video about notifications! but beware! notifications only, not push notifications! for push notifications you must first subscribe to push notifications on a web page / site, and then the server will send those push notifications, no matter if the browser is on that page or that page is closed; of course, after receiving a push notification you will show it to the user like the examples in this video
Do you need background workers for this to work?
@Web Dev Simplified can you make a tutorial on workers, what they are and how to use them?
@@ksrele yes you need a service worker on the client to listen for the notifications and you need some cryptography to communicate between the server and the client.
Yooo i needed this for my project, thanks a lot
Great tutorial! You are my Hero 👍
Ooh, very interesting! Great tutorial.
So brilliant! Thank you!
Very helpful and well explained
thank you kyle.
how awesome is this!
You are awesome i love your content keep going ♥
Nice! Good job bro, best tutorials!
Thanks a lot for this fantastic video. Best explanation ever.
Awesome explanation. I owe you!! 😊
Super exciting content!
amazing! again, nice to see that JS is so powerful
Really learned some new things bro. Love you
Amazing Stuff, as always...... Please make one with React PWA and Web... I believe your tutorial would be so much better to wrap my head around.
Cool! Thank for a great tutorial.
I'm the guy who told you to blink your eyes a bit more when you only had like 7k subscribers. Congratulations on 1 million, also you are doing good with blinking 👁️💪
As mentioned by @chronSyn below this is not a push notification, that requires a backend service to 'push' the notification based on some event to the browser even when you are not viewing the page. Google has a push api but most are paid and a little complex to implement.
nice didin't expect that really good well done
This is amazing!
wow, thank you so much, it was a big help
Welldone bro. Love your tutorials. I however belive I am stuck in the tutorial hell. Been doing Front dev for a month. No job or internship yet
I justtttt wanted to learn about push notification and you got me
Thanks for the tutorial... As in my case of Win10, go to [Settings] -> [System] -> [Notifications and Actions] then turn on [Get notifications from apps and other senders] and everything works fine...
ITS REALLY WORKED LOL THANK YOU DUDE
Great video Kyle
Great man 👍🏻
The video was helpful thank you for making me better than before
you deserve a huge like 👍🏻👍🏻
Nice tutorial, thanks! Please do a tutorial on PWA & Web push notifications (for when the browser is closed to keep receiving notifications). They are kinda complex, but I think you will be able to explain them very clearly.
That would be super cool to have such a tutorial
Yes, please! 😄
Yes please!
Yes please
Yes please
Thanks for sharing those are great materials
New level knowledge, thanks bro 👍
Great tutorial! Though the JS notification api isn’t fully supported on phones. It isn’t even possible on IOS as of now and chrome on android needs service workers.
Just additional information :)
Thank you so much!
I was thinking for a few days about sending you an email to make a video about PWA and push notifications. Here is the part of those. Thanks
always cool to see native stuff
But it's actually not push notifications, if my app is closed I don't receive anything like we see in the thumbnail
Thank you!!
tutorial added to my "to try list" asap
thanks max thats really helpfull
Just Amazing man❤❤❤❤
You earnt a subscribe, my friend.
You are the best !!
It's cool to try on the phone! For my own site notification
good as usual
Awesome!!!!!😊👍
nice tuts...
great, super useful
Nice tutorial. I doubt many people actually grant that access. I always say NO when that popup shows
Would have really liked to see how the Notifications look and work for mobile usage.
Also interesting would be the mobile Notifications on a PWA, which looks and feels like a mobile App.
hey man did you find anything like that? I am searching for the same thing
Great video
This tutorial is a big help for my thesis right now! Thank you!
Thank you
Good idea !
Can you show us how to monitor ajax loading progress? So we can make something like a progress bar?
Wow, I love this short and the way he was explaining it, EXCELLENT. Not one time I felt lost or disorientated. K.I.S.S. is the way to go!!😀
cool dude , useful !
This is dope
What did u do in "if" part of clearing interval, the auto closing of parenthesis?
The COME BACK please is having me dead.😂
Never disappoints
Perfect! Now I can annoy people more jist for fun 🤣
merci beaucoup a toi :))
That's really an informative Video,
Thanks @kyle