tutorial time
Here's a fun project you can build in no time at all: a stopwatch.
First, let's set up the HTML: after you <link> off to the stylesheet and connect to the <script>, the <body> only needs one thing: a <button>.
I'll let you style it how you want, but as long-time readers might imagine, I went with lots of box-shadow. Anyway, on to the JavaScript!
Above, we add a click listener to that <button>, which triggers a function, below.
When a user clicks, there are two possibilities: either we haven't started looping yet, or we're about to stop that loop (with clearInterval()). And the loop itself isn't too complex: just increment a global variable every tenth of a second.
To make that number human-readable, we need to separate out the whole minutes and whole seconds (using division, modulo, and Math.floor()) from the remaining tenths.
Then we use a ternary operator to determine the need for a leading zero (to get 01:02.3 instead of 1:2.3). Feed that back into the <button>, and you've good a stopwatch. Now do it again, but time yourself this time!
tl;dr: x++ is a shortcut for x = x + 1; % gives you the remainder after division; the ? : construction is a cool tool when defining variables
project: timeStopper
