Jump to page content

Modernising legacy web apps: Angular 8 to Angular 21

Code windows

I understand how easy it is for platform upgrades to slip down the priority list, especially when a system is still “working well enough”. However, as dependencies age, support is dropped, and the gap between current and legacy versions grows, this is where technical debt builds up.

What starts as a straightforward upgrade can eventually become a larger modernisation effort, driven not by choice, but by necessity.

In this case, we were brought in to take an Angular 8 application and bring it up to a supported, modern state on Angular 21.

Angular itself wasn’t the hard part. The pain was the legacy third-party packages, some abandoned or with no upgrade path. That meant going through each one and deciding whether to replace it, upgrade it, or remove it entirely.

In a few places, newer native Angular capabilities and Bootstrap 5.3.8 meant we could drop packages altogether and simplify the application.

The biggest area to be careful with was authentication and authorisation. Small changes here can introduce subtle issues that are difficult to trace.

We took a clean approach, starting with a new Angular 21 project, then migrating things across incrementally. Starting with assets, then components, then more complex areas like routing.

The longest part was resolving structural differences and tidying things up as we went.

Once it was running, there were a range of smaller issues, API calls, routing quirks, styling differences, and a surprising number of stuck loading spinners caused by change detection behaviour.

The result is cleaner code, better performance, and a fully supported platform again.

If you have an application stuck on an older Angular version, it’s a slog, but it might be worth it, get in touch with us if you need a team to help.