Update Angular 7 to 10

Zach Olson
3 min readSep 26, 2020

AngularJS to Angular and more … my personal journey ❤️☕️

👋😷 Hope everyone is doing well

I know it’s been a while since my last post, almost a year! My journey with Angular 7 took a pause, but Angular did not. They are already up to version 10 😮

If you forgot how this journey began feel free to time travel to the first post.

Today’s story will be short and sweet 🍬. I am taking my Angular 7 project and updating it to 10.

You might think moving an application across major versions to be scary. Depending on the size of the application this is very true. Some logic could breaks things due to deprecation. You’ll also need to test the functionality of your app before deploying it to production. I would recommend updating in steps.

  1. Update to the next major version after your current version
    (ex. update 7.x to 8.x)
  2. Test your app's functionality to ensure everything is working
  3. Repeat step 1 until you get to your desired version (ex. update 8.x to 9.x)

Luckily for us, our application is still rather small. Stephen Fluin wrote a great tool that I followed to update this application.

I followed my updating steps, chose an Angular Version from, and to. Chose the application complexity as Basic. The only dependency I had to check was that I am using Angular Material.

Then I followed the steps provided after clicking the Show me how to update! button. Built the application, verified everything worked as expected, and repeated Step 1.

🤔 ng update & npm outdated

--

--

Zach Olson

Experienced Web Designer and Information Architect, Visionary Entrepreneur and Investor