During exams, I often ask my TAs to take attendance. We then count the number of students in the exam room and compare it against the count in the attendance sheet to make sure that we didn’t miss anyone. In these cases, a simple counter app can be very useful. It is too easy to lose count when you are counting a large number of things, especially when you are under pressure and have to do it quickly. Moreover, students or other TAs may distract you while you are counting.
In this tutorial, we will create a simple counter app. The app will have two buttons, one to increment the counter and the other to decrement it. The counter will be displayed in the middle of the screen. This is useful for counting things like students in an exam room, items in a store, or anything else that you need to keep track of.
We will build this application first as a Vanilla TypeScript app and then as a React app. Let’s get started!