This project demonstrates the implementation of web push notifications using JavaScript. It allows users to input a message and receive a browser notification displaying that message.
- User Input Validation: Ensures the message input is not empty before sending a notification.
- Browser Notification: Utilizes the Notification API to display messages to the user.
- Permission Handling: Requests notification permissions from the user and handles cases where permissions are denied.
- A modern web browser that supports the Notification API.
-
Clone the Repository:
git clone https://github.com/dev-kant-kumar/Notification.git
-
Navigate to the Project Directory:
cd Notification
-
Open the
index.html
File:- Double-click the
index.html
file, or - Right-click the file and select "Open with" followed by your preferred web browser.
This will open the application in your default web browser.
- Double-click the
-
Enter a Message:
In the input field labeled "Message," type the message you wish to receive as a notification.
-
Submit the Message:
Click the "Submit" button to send the message. If the input is empty, an error message will appear.
-
Receive Notification:
- If it's your first time using the application, the browser will prompt you to allow notifications. Click "Allow" to enable notifications.
- Once permissions are granted, a notification with your message will appear, displaying the content you entered.
- HTML (
index.html
): Contains the structure of the webpage, including the input field and submit button. - CSS (
styles.css
): Provides basic styling for the webpage elements. - JavaScript (
script.js
): Handles user interactions, input validation, and manages the Notification API to display messages.
This application relies on the Notification API, which is supported in most modern browsers. Ensure that your browser settings allow notifications for this application to function correctly.
This project is licensed under the MIT License. See the LICENSE file for details.