The Hyper Flexible Clock is a timer/stopwatch hybrid that focuses on flexibility and simplicity. Built with Vue 3 and Astro (previously Vue 2 and Nuxt.js), it is also a showcase of my capabilities on the front-end development.
- Start, pause, and stop buttons
- Ability to add, remove, and run multiple timers
- Changable time and title
- Switching betwwen counting up (as a stopwatch) and counting down (as a timer)
- A nice and responsive interface (works on mobile, tablet, computer, etc)
- To start the timer, press the start button.
- To stop the timer momentarily, press the pause button.
- To stop and reset the timer, press the stop button.
- Switch between counting up and counting down by pressing the Count Up/Down button.
- Click the title to change the title of the timer. (default is Timer)
- Click the time to change the time of the timer. (default is 00:00:00).
- To add a timer, click the dotted box.
- To remove a timer, click the Remove button.
| Command | Action |
|---|---|
npm install |
Installs dependencies |
npm run dev |
Starts local dev server at localhost:3000 |
npm run build |
Build your production site to ./dist/ |
npm run preview |
Preview your build locally, before deploying |
npm run astro ... |
Run CLI commands like astro add, astro check |
npm run astro --help |
Get help using the Astro CLI |
This project is licensed under the terms of MIT license.