Basic Requirements of the Project

To implement the stopwatch application, you do not need to have exceptional web development skills. Even if you are a beginner in web technologies such as HTML, CSS and JS you can build your own stopwatch application. The following are the pre-requisites for stopwatch application.

Basic Requirements

You need to have the basic requirement of

• Working laptop with internet connection
• Install VScode in your machine
• Connect your GitHub account to VScode (Optional)

Tech Stack

You do not need to be proficient in the following technologies, but it is good to know the basics.

• HTML: It is used to structure the web application.
• CSS: It is used for styling the web application.
• JavaScript: It is used for implementing the logic behind the web application.
• React JS: This is a popular framework for frontend development.
• Git: It is used for uploading/hosting the codes.
• Vercel: It is used for deploying web applications.

Input and Output

Input

The application starts with the user triggering through buttons. There will be three buttons displayed in the web page: Start, Stop and Reset. Once the user presses the start button the timer runs until either the stop or reset button is pressed.

Output

Once the user presses the start button and hits the stop button to terminate the timer, it will display the end time in hours, minutes, seconds and milliseconds format (Eg:- 00:03:00:00). There are two important things in the output,

• If the user hit the reset button, the output will be shown as 00:00:00:00
• If the user hits the start button, the timer runs and will show the increase in milliseconds, seconds, minutes and hour till they hit the stop button.

In the next lesson, we will look into the necessary Javascript concepts behind the calculation of seconds, minutes and hours.

See you in the next lesson!