# 😍 Web Notifications web API 😍

Have you ever visited a website and saw a notification popup on your screen? That's the power of Web Notifications web API!

### What are Web Notifications?

Web Notifications are a type of notification that websites can send to users, regardless of whether the website is open or not. These notifications appear as a small popup window on the user's screen, providing real-time updates and alerts. There are lots of 3rd parties web notification providers available but we are going to use our web API.

### How to implement Web Notifications on our site?

![easy-hai](https://media1.giphy.com/media/3ohhwhLRprHtEWzi1O/giphy.gif?cid=ecf05e47qob3sf951qlcuw6gzhjajc5yuaacln22oasx4syt&rid=giphy.gif&ct=g align="center")

Yeah, it's really easy to get started with web notification. Let's learn how to integrate it into our website.

![web-notication](https://cdn.hashnode.com/res/hashnode/image/upload/v1679930424401/a41393ea-0f08-440b-9167-acf39a8756dc.png align="center")

On the above code, we first request permission from the user to send notifications using `Notification.requestPermission()`. Once permission is granted, we create a new notification with the **Notification constructor**, specifying the title, body, and icon for the notification. Always ask for the user's permission before sending notifications.

Overall, Web Notifications are a powerful tool for enhancing user engagement on the web. By providing real-time alerts and updates, websites can keep users informed and engaged, leading to a better overall user experience.

%[https://codepen.io/Atul-Rajput/pen/yLxweaM] 

[Check here](https://web-notification.netlify.app/)

---

Thanks a lot for reading till the end 🙏 If you liked the article, please give likes and share it with your others.

Email: [atul19251@gmail.com](mailto:atul19251@gmail.com)

Web: [https://iamatul.netlify.app/](https://iamatul.netlify.app/)

Github: [https://github.com/iamrajput](https://github.com/iamrajput)

LinkedIn: [https://www.linkedin.com/in/atul-kumar-singh-673357102/](https://www.linkedin.com/in/atul-kumar-singh-673357102/)