Posts

Showing posts from 2022

Retro Review: It Came Upon the Midnight Clear

Image
It Came Upon the Midnight Clear  is an old made-for-TV movie that I saw in syndication when I was a kid. I seem to recall it being on more than once, either multiple times during the same holiday season, or in consecutive years. I loved this movie, but looking back on it, all I remembered was that it starred Mickey Rooney as a grandfather hanging around with his grandson during the Christmas season, and the ending of the film. It doesn't appear to have gotten a home release past the VHS format, and is long out of print. I was happy to find it on YouTube recently, and watched it for the first time in ages. Even though I had fond memories of it, I had little  memory of it -- what was it about the film that I liked way back then? It was strange watching it again, as nothing was coming back to me as I did so. I'd have expected some "Oh, now I remember this part" moments, but that never happened, and by the end, I was curious as to why I had enjoyed the film so much as a

Brother Mark McBride, T.O.R., Remembered

Image
I recently learned of the passing of Brother Mark McBride, T.O.R.. Brother Mark was the principal of my high school, and someone I thought of as a friend. Though I hadn’t kept in touch with him, he was someone who’d cross my mind from time to time. He was a kind man, very down-to-earth, and very unlike a principal or other authority figure. On the first day of my sophomore year of high school, I arrived late and had to ask one of the faculty where I should be. I was new there that year. I didn’t know anyone, didn’t know the building, didn’t know the first-day routine. I was told that sophomores should be in the auditorium (the different grades were in different areas), and somehow found my way there. The crowd was sparse and I took a seat. A Franciscan friar was on the stage, speaking into a microphone. This was Brother Mark. The first impression he made upon me was when he said something that elicited a smattering of tepid applause — he reacted to this by saying, very dryly, “You may

How to Detect Route Changes in Angular

In a current project at work, we need to be able to tell what the current route is in an Angular app regardless of which component is currently active. The code below does the trick. It's probably better suited for ngOnInit() than the constructor, but this still illustrates how to do it. In this example, we're just logging the URL to the console (this was just sample code I gave to one of the developers): export class AppComponent {   constructor ( private _router : Router ) {     this . _router . events . subscribe (( event : Event ) => {       if ( event instanceof NavigationEnd )         console . log ( "CURRENT URL: " , event . url );     });   } }

How to Specify an Angular FormControl as Non-Nullable and Also Include Validation with Typed Forms

I recently upgraded a project to Angular 14. It's been a long running project, created using Angular 4 (I think), and even though I've been upgrading the version of Angular as new versions are released, I only recently learned that the  tsconfig.json  settings were the same as they'd been when the project was created, so I took the opportunity to bring those up to the current standards as well. Unfortunately, with the stricter template type-checking in place, some of my existing code no longer compiled. I figured that this would be a great time to switch over to the new Typed Forms introduced in Angular 14. One thing that threw me off a bit was how I could create a FormControl that doesn't allow nulls, but that also includes validation. The official docs mention supplying the nonNullable  option, but I was confused as to how I could also include my regular validation functions as there didn't seem to be an overload that supported that. But by digging a little deeper

Configuring Your Angular Application to Use an External Configuration File

Image
Normally, developers use the environment.ts  and environment.prod.ts  files (and maybe even other permutations) to configure their Angular applications for different environments. With a deployment system such as Octopus , symbols can be placed in these files to replace values with environment-specific ones. But what if you want to build an Angular application for use by someone outside of such an environment? I ran into this problem recently when working on an application I have up on GitHub. I wanted to be able to provide a release that someone could easily configure without having to do a find/replace inside a JavaScript file. As long as the application is not offline, you can add a configuration file which gets distributed with your application and have the app read from it during initialization. First, create a new configuration file. In my case, I added config.json  under my src  folder: In this file, I currently just have a single configuration option: the URL to my API. {   &qu

The Most Destructive Keystrokes In Software Development Are The Ones Used For Copy/Paste

Image
Okay, so maybe the title of this post is a little over-dramatic. But the fact remains: copy/paste "coding" leads to problems, and is probably my least favorite bad coding practice (or the bane of my development experience! ). I think we've all been there: we don't know how to code something, so we do a quick search, either via search engine or in our existing codebase, to find an example, and then we copy and paste that example into the code we're currently working with. And sometimes, that's where it ends -- we've found our solution, and we move on with the rest of our coding. But often, just pasting that code in and moving along can have some unintended repercussions. Here's what can happen. A Lack of Understanding Sure, you've got code that works -- but do you know how  it works? Developers spend more time maintaining  code than initially developing it, and if you don't know how or why something works, it can make maintaining the code -- or

When Extending the TypeScript Date Object Doesn't Play Nice with zone.js

Image
I recently ran into an issue while upgrading an application from Angular 4 to Angular 13. It's been a monster of a project, made more complex by the fact that the app originally did not use the Angular CLI. One of the developers had introduced some extensions to TypeScript's Date object, to add additional methods to it, 2 of which were static. It's debatable whether or not this is a good approach, and you'll find many opinions online from those that don't like this approach. It's not one I'm comfortable with myself. But all was working fine until the upgrade. Once everything had been upgraded to Angular 13 and the latest version of TypeScript however, many of the unit tests that reference these methods (particularly one of the static ones we used frequently) began failing, saying that the method didn't exist. I verified everything was being imported correctly. It was working fine in another, up-to-date app, and I even set up a quick, working example in a

Resolving the Webpack Polyfills Breaking Change When Upgrading an Angular App

While working on upgrading an Angular application, which is several versions behind, to the latest version, I encountered the following error during build: BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default. This is no longer the case. Verify if you need this module and configure a polyfill for it. If you want to include a polyfill, you need to: - add a fallback 'resolve.fallback: { "util": require.resolve("util/") }' - install 'util' If you don't want to include a polyfill, you can use an empty module like this: resolve.fallback: { "util": false } This was happening because one of the developers imported isNullOrUndefined  from util  in two components. I did some Googling, and found a few issues on GitHub, which included some various workarounds, and strangely enough, became heated  -- people were expressing hostility  over this issue, and the factors around it. But amidst all the chaos, one p