Your application still runs on AngularJS, and a full rewrite would stop the roadmap for months. An incremental migration moves it to modern Angular one piece at a time, while it stays in service.
Why AngularJS has to go
Google ended long-term support for AngularJS on December 31, 2021. There are no more official security fixes, and fewer libraries, tools and engineers work with it every year.
The good news: you do not have to stop and rewrite. Angular ships an upgrade package that runs AngularJS and Angular side by side in one application, so you can move one piece at a time and keep releasing features while you do.
The migration, step by step
1. Assess the application
List every module, component, directive, service and third-party library, and note which ones have tests. Find the patterns that make a hybrid application hard, such as heavy use of $scope, deep two-way binding, or libraries with no Angular equivalent.
2. Prepare the AngularJS code
Move the code toward the shape Angular expects before you add Angular: component-style directives (the .component() API, available since AngularJS 1.5), TypeScript, and a modern module bundler. Each change ships on its own and makes the next step smaller.
3. Run both frameworks in one application
Bootstrap a hybrid application with Angular's upgrade package (@angular/upgrade/static, often called ngUpgrade). AngularJS and Angular then run side by side in the same page, so the application keeps working while parts of it move.
4. Migrate piece by piece
Move shared services first, then the leaf components, then whole routes. While both frameworks run, downgrade new Angular components for use in AngularJS templates, and upgrade AngularJS services for use in Angular code. Add tests to each piece as it moves.
5. Keep shipping features
Build new features in Angular from the start instead of freezing the roadmap. Users keep getting releases during the migration, and every new feature is one less thing to migrate later.
6. Remove AngularJS
When the last route has moved, remove the upgrade module and the AngularJS dependency. Then upgrade Angular itself to the current version in supported steps, so the application does not fall behind again.
Common questions
Can AngularJS and Angular run in the same application?
Yes. Angular's upgrade package runs both frameworks side by side in one application. That is what makes an incremental migration possible: the application keeps working, and users keep getting releases, while it moves one piece at a time.
Should we migrate to Angular or rewrite in another framework?
Decide from evidence about your own code. Angular provides official tools for running AngularJS and Angular in one application, so the move can happen step by step while the application stays in service. Another framework can also replace the application route by route, but your team has to build and maintain the connection between the old and new screens.
How long does an AngularJS migration take?
It depends on the size of the application, its test coverage, and how much of it already follows component patterns. Review the code first, and plan the migration in milestones from what you find.
Originally published at briebug.com. Briebug's senior US-based engineers rescue stalled software projects and migrate AngularJS applications to modern Angular. If you want a migration plan for your own application, see AngularJS to Angular migration services.
