Skip to content

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

3 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

🔔 Push Notification Web App

A simple and interactive Push Notification Web Application built using HTML, CSS, and JavaScript. This project demonstrates how to use the Browser Notification API to request user permission and send real-time push notifications directly from the browser.

🌐 Live Demo: https://vaibhavsain.github.io/push-notification/


🚀 Features

  • Request notification permission from the user
  • Send push notifications on button click
  • Clean and minimal UI
  • Uses native Browser Notification API
  • Lightweight and beginner-friendly

🛠️ Tech Stack

  • HTML5 – Structure of the application
  • CSS3 – Styling and layout
  • JavaScript (ES6) – Logic and browser interaction

📸 How It Works

  1. User clicks on the Enable Notifications button
  2. Browser asks for notification permission
  3. Once allowed, notifications can be triggered instantly
  4. Notifications appear even outside the browser tab

📂 Project Structure

📁 push-notification
 ┣ 📄 index.html
 ┣ 📄 style.css
 ┗ 📄 script.js

▶️ How to Run Locally

  1. Clone the repository

    git clone https://github.com/VaibhavSain/push-notification.git
  2. Open index.html in your browser

  3. Allow notification permission

  4. Click the button to trigger notifications


💡 Learning Outcomes

  • Understanding the Browser Notification API
  • Working with user permissions
  • Event-driven JavaScript
  • Improving user engagement through real-time alerts

⚠️ Important Notes

  • Notifications work only on HTTPS or localhost
  • Some browsers may block notifications by default
  • Best experienced on modern browsers like Chrome, Edge, or Firefox

🙌 Acknowledgements

Built as part of my learning journey to explore interactive web features and browser APIs.


📬 Connect With Me


⭐ If you found this project helpful, consider giving it a star!

About

A lightweight push notification web app built using HTML, CSS, and JavaScript that demonstrates browser-based real-time notifications using the Notification API.

Topics

Resources

Stars

1 star

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages