Stopwatch

K8 Task Timer is a Stopwatch that is used for calculating the time that students need to do their tasks.
Explore the docs »

View Demo · Report Bug · Request Feature

Table of Contents

1. About The Project
   • Built With
2. Getting Started
   • Installation
3. Usage
4. Roadmap
5. Contributing
6. License
7. Contact
8. Acknowledgments

About The Project

Mini Project Web Development Course

This project is a mini project as an assignment for the Web Development course. In this project, we implement the use of Node JS and Postgre SQL for Backend and use Vue JS and Vuetify for Frontend. This Stopwatch has some features, those are:

• You can create a new Stopwatch for the new task and also you can give it a name of the Stopwatch according to the task.
• You can start and pause the Stopwatch.
• You can stop and delete the Stopwatch and the history will be included in the Rekap page.
• You can view the Stopwatch history on the Rekap page.
• You can delete one or delete all the Stopwatch history.
• If one task is running and you want to start another task or new task, then the running stopwatch will be paused and the other will be start.
• And also this Stopwatch can run when the tab is closed.

This project is still running and needs some improvements and also the addition of some features. I hope this project can help your task.

(back to top)

Built With

• HTML
• CSS
• Node JS
• PostgreSQL
• Vue JS
• Vuetify

(back to top)

Getting Started

This will give instructions on setting up your project locally. To get a local copy up and running follow these simple example steps.

Installation

1. Clone the repo

   https://github.com/3BD4-Webdev-Kelompok8/NodeJS-Postgre-Stopwatch.git

2. Create .env file and put this

    DB_HOST= {your host }
    DB_USER= {your db user }
    DB_PASSWORD= {your db password }
    DB_DATABASE= {your db database }
    PORT= {your host port }
    DATABASE_PORT= { your db port }

3. Open two terminals to the project folder, then:

   cd server
   nodemon server

   cd client
   npm run serve

(back to top)

Usage

To use this application, there are some features, those are:

1. Use the Create button to create the Stopwatch and you can give it a name according to the task.
2. Use the Start button to start the Stopwatch.
3. Use the Pause button to pause the Stopwatch.
4. Use the Delete button to delete the Stopwatch.
5. Use the Stop button to stop the Stopwatch and display will show the total elapsed time.
6. Rekap page will show your Stopwatch history.

(back to top)

Roadmap

1. Analysis
2. Collect and define requirement
3. Development HTML and CSS
4. Add Javascript for Stopwatch function
5. Add local storage to keep Stopwatch running in the background
6. Use Postgre SQL for the database and Node JS for Backend (Server)
7. Use Vue JS for Frontend (Client)

See the open issues for a full list of proposed features (and known issues).

(back to top)

Contributing

Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.

If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement". Don't forget to give the project a star! Thanks again!

1. Fork the Project
2. Create your Feature Branch (git checkout -b /3BD4-Webdev-Kelompok8/NodeJS-Postgre-Stopwatch)
3. Commit your Changes (git commit -m 'Add some NodeJS-Postgre-Stopwatch')
4. Push to the Branch (git push origin /3BD4-Webdev-Kelompok8/NodeJS-Postgre-Stopwatch)
5. Open a Pull Request

(back to top)

License

Distributed under the MIT License. See LICENSE.txt for more information.

(back to top)

Contact

Project Link: [https://github.com/3BD4-Webdev-Kelompok8/NodeJS-Postgre-Stopwatch)

Project Group: Group 8 - D4 3B - WebDev 2021

Members:

• Azzam Badruz Zaman - 191524037
• Fachri Dhia Fauzan - 191524041
• Herlana - 191524045
• Putri Syalwa Abdillah - 191524054
• Sabar Muhamad Itikap - 191524058
• Wafi Khoerun - 191524064

(back to top)

Acknowledgments

• Readme Template

(back to top)