Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/khaled-alselwady/countdown-timer
⏲️ Countdown Timer is a web app that lets you create, manage, and track multiple customizable timers. Easily start, pause, resume, and delete timers with a user-friendly interface. ⏳
https://github.com/khaled-alselwady/countdown-timer
angular cli component css design-system html javascipt model modules standalone-components templates typescript website
Last synced: about 7 hours ago
JSON representation
⏲️ Countdown Timer is a web app that lets you create, manage, and track multiple customizable timers. Easily start, pause, resume, and delete timers with a user-friendly interface. ⏳
- Host: GitHub
- URL: https://github.com/khaled-alselwady/countdown-timer
- Owner: khaled-alselwady
- Created: 2024-08-10T16:57:29.000Z (3 months ago)
- Default Branch: master
- Last Pushed: 2024-08-22T21:09:38.000Z (3 months ago)
- Last Synced: 2024-09-06T02:07:41.775Z (2 months ago)
- Topics: angular, cli, component, css, design-system, html, javascipt, model, modules, standalone-components, templates, typescript, website
- Language: TypeScript
- Homepage:
- Size: 313 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Countdown Timer
**Countdown Timer** is a flexible web application that allows users to manage multiple countdown timers with features to start, pause, resume, and delete individual timers. It provides an intuitive interface for setting up and tracking tasks with customizable time durations and titles.
## Features
- **Timer Management**: Create, start, pause, resume, and delete multiple timers.
- **Customizable Timers**: Set hours, minutes, and titles for each timer.
- **Dynamic Updates**: Real-time countdown updates for active timers.
- **User Interface**: User-friendly interface for managing timers.
- **State Management**: Efficient state management for each timer’s status.
- **Angular Components**: Modular design using Angular components for scalability.## Setting Up
To get started with this repository:
1. Clone the repository to your local machine.
- `git clone https://github.com/dev-khaled-yousef/countdown-timer.git`2. Install dependencies using npm.
- `npm install`
This will install all necessary packages and dependencies required for the Angular project.3. Start the development server.
- `npm start`
This command will compile the application and open it in your default web browser. If it doesn't open automatically, you can navigate to [http://localhost:4200/](http://localhost:4200/) in your browser.## Screenshots
Here are some screenshots of the application:
### Main Interface
![Main Interface](public/screenshots/main-interface.png)### Timer Management
![Timer Management](public/screenshots/timers-list.png)## Usage
- **Create New Timer**: Enter the hours, minutes, and title of the task, then click "Start" to create a new timer and begin the countdown.
- **Pause Timer**: Click the "Pause" button to halt the countdown.
- **Resume Timer**: Click the "Resume" button to continue the countdown from where it left off.
- **Delete Timer**: Click the "Delete" button to remove a timer from the list.Feel free to contribute to the project by opening issues or submitting pull requests. For any queries, contact us at `[email protected]`.