Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/sahejadkadivar/alarm-clock
The project is an alarm clock website developed using HTML, CSS, and Vanilla JavaScript.
https://github.com/sahejadkadivar/alarm-clock
Last synced: 12 days ago
JSON representation
The project is an alarm clock website developed using HTML, CSS, and Vanilla JavaScript.
- Host: GitHub
- URL: https://github.com/sahejadkadivar/alarm-clock
- Owner: sahejadkadivar
- Created: 2024-02-17T06:23:07.000Z (11 months ago)
- Default Branch: main
- Last Pushed: 2024-02-17T06:58:37.000Z (11 months ago)
- Last Synced: 2024-11-07T06:37:07.038Z (2 months ago)
- Language: JavaScript
- Homepage: https://sahejadkadivar.github.io/Alarm-clock/
- Size: 465 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Alarm clock
The project is an alarm clock website developed using HTML, CSS, and Vanilla JavaScript. It features a responsive design, adapting to different screen sizes. The website includes a header with a color-changing effect, a section displaying the current time in a 12-hour format, an option to set alarms with one-second precision, and a list of set alarms with stop and delete buttons.
Users can interact with the alarm functionality by setting alarms, stopping them, and deleting them. The alarm plays a sound and displays an alert when the set time matches the current time. The webpage also logs updates in the console for confirmation.
This project is suitable for anyone looking for a simple and interactive alarm clock. It provides a visually appealing interface with responsive design, making it accessible across various devices. Users can easily set and manage alarms with the provided features.
## Features
- 12-hour format
- No need of internet after download the file
- precision of 1 second in setting alarm
- Responsive design
- Play alarm tone
- button to stop alarm
- button to delete alarm
# Technologies Used
### Frontend:
[![Frontend](https://skillicons.dev/icons?i=html,css,js)](https://skillicons.dev)
* HTML
* CSS
* JavaScript
## How to use alarm clock### Download the code in your system
### Open the application:
- Open the **`index.html`** file in your web browser.
### Set your alarm:
- Set your desired alarm time using the provided controls. and click on "set alarm" to set the alarm.
### Alarm sound and notification:
- When the set time is reached, the alarm will play sound i.e. alarm tone and alert notification will shown on the page.
### How to stop the alarm
- To stop the alarm you have to click on stop button in alarm list
### Delete alarm
- You can delete alarm which is no more useful by pressing "delete" button.
## Dependencies
This project relies on standard web technologies without the need for additional libraries or frameworks. The key dependencies are as follows:
- **HTML:** Defines the structure and content of the web page.
- **CSS:** Enhances the visual presentation of the user interface through styling.
- **JavaScript:** Utilizes Vanilla JavaScript to implement the logic and interactivity of the alarm clock.
The project remains lightweight and self-contained by avoiding external libraries or frameworks, making it easy to use and deploy.
## Demo
link for trial is:
[https://github.com/sahejadkadivar](https://sahejadkadivar.github.io/Alarm-clock/)## Authors
- [sahejadkadivar](https://github.com/sahejadkadivar)