https://github.com/teneplaysofficial/push-notifications-js
A simple JavaScript implementation for browser push notifications using the Notification API. This project demonstrates how to request permission for notifications, send notifications, and manage visibility changes to enhance user engagement.
https://github.com/teneplaysofficial/push-notifications-js
css html js notification-api push-notifications
Last synced: 4 months ago
JSON representation
A simple JavaScript implementation for browser push notifications using the Notification API. This project demonstrates how to request permission for notifications, send notifications, and manage visibility changes to enhance user engagement.
- Host: GitHub
- URL: https://github.com/teneplaysofficial/push-notifications-js
- Owner: TenEplaysOfficial
- License: mit
- Created: 2024-10-07T13:07:18.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2024-10-08T05:51:12.000Z (over 1 year ago)
- Last Synced: 2025-01-04T19:30:05.826Z (about 1 year ago)
- Topics: css, html, js, notification-api, push-notifications
- Language: JavaScript
- Homepage: https://teneplaysofficial.github.io/push-notifications-js/
- Size: 5.86 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Push Notifications JS
A simple JavaScript implementation for browser push notifications using the Notification API. This project demonstrates how to request permission for notifications, send notifications, and manage visibility changes to enhance user engagement.
## Features
- Request user permission for displaying notifications.
- Send a notification with a customizable message and icon.
- Automatically notify users when they leave the page.
- Track the duration of absence and notify them to return.
## Demo
A live demo of this project can be found [here](https://teneplaysofficial.github.io/push-notifications-js/). (Replace this with a link to your live demo if available.)
## Installation
To get started with this project, clone the repository:
```bash
git clone https://github.com/TenEplaysOfficial/push-notifications-js.git
```
Navigate to the project directory:
```bash
cd push-notifications-js
```
Open the `index.html` file in your web browser.
## Usage
1. Open the project in a web browser.
2. Click the "Notify" button to request permission for notifications.
3. If granted, notifications will be displayed based on the visibility state of the document.
## Code Explanation
- **index.html**: Contains the HTML structure for the notification functionality.
- **style.css**: Provides the styling for the notification button and layout, ensuring a clean and user-friendly interface.
- **script.js**: Implements the logic for managing notifications and visibility changes.
## Contributing
Contributions are welcome! If you have suggestions for improvements or want to add features, feel free to open an issue or submit a pull request.
## License
This project is licensed under the MIT License. See the [LICENSE](LICENSE) file for more details.
*Stay connected! Follow me on [Socials](https://linktr.ee/tenegames).*