Waiting for Angular to build is boring. I'm using ng build --watch to trigger a build whenever I save a file, but it's hard to know when it's done. I don't like staring at the timestamp waiting for it to change:
I compare the time in the window with the actual time in the bottom corner of my screen, but if I'm making small changes, the minute is the same. If I'm distracted, I may look away briefly and miss when the build has finished and find I'm staring at it waiting for it to change, but it just doesn't.
I'm a big fan of Boggle, with the exception of the timer. When I'm busy writing words or looking at dice, I don't want to be wasting time glancing at the falling sand. Sometimes we all forget to look, and find that we missed the end, and the timer stopped at some unknown point in the past. I'm sure you all know how infuriating this is. Whenever I play, I set a timer on my phone to beep when the three minutes is up. We can all concentrate, and we get to play with less frustration.
Being as smart as you are, I'm sure you've deduced by now that I wanted the Angular build process to beep when it had finished. The initial problem was that the process wasn't finishing, because the --watch flag keeps it running. Had it been a single process, I could have put it in a batch file with an echo ^G afterwards. (Those who didn't spend their teenage years on an Amstrad PC1512 may not know that Ctrl+G is ASCII 7, i.e. BEL (a beep)). You can type echo Ctrl+g into a command prompt to make a beep, which is more pleasing than it should be.
However, there's no post-build hook in Angular (that I could find), so I needed something else. Twelve years ago I discovered C#'s FileSystemWatcher for a project I was working on. It's the only time I've used it, but now was the time to bring it out again. I think of it often, but it sits there in a drawer, waiting for a special occasion, next to my bowtie. A FileSystemWatcher keeps an eye on a file or directory, and if a file changes, it fires an event. My plan was to get this dude to camp out with his binoculars looking at the Angular output directory and if anything happens, send me an E in morse code.
So in a new console app, I lovingly sculpted a new watcher:
When it fires, it makes just the right kind of beep.
I ran it, saved an Angular file, and it beeped when it finished. Several times, in fact, as several files changed. I wanted just the one, so I used a short timer to catch the changes:
This timer delays the beep for 0.3 seconds, and doesn't let any other file changes trigger a new beep in the interim. As an aside, when you're playing Boggle, and you see the word TIMER, it's Levidrome is REMIT, so you can write that immediately. Obviously there's TIME too, whose Levidrome is EMIT, so you've got four words from one without thinking about it.
So now I'm happily coding in Angular in Visual Studio, pressing Ctrl+Shift+S, clicking on the browser window containing the app, hovering my finger over the F5 key, and then staring out of the window until I hear the beep, when I tap the F5 key immediately. Problem solved; happy Simon.