🚀 Upgrade Angular and Angular Material from v18 to v19

[desoga10]

Description

Upgrade the project from Angular 18.0.3 to Angular 19 to take advantage of the latest features, performance improvements, and bug fixes.

Current Version

"@angular/animations": "^18.0.3",
"@angular/cdk": "^18.0.3",
"@angular/common": "^18.0.3",
"@angular/compiler": "^18.0.3",
"@angular/core": "^18.0.3",
"@angular/forms": "^18.0.3",
"@angular/material": "^18.0.3",
"@angular/platform-browser": "^18.0.3",
"@angular/platform-browser-dynamic": "^18.0.3",
"@angular/router": "^18.0.3"

Target Version

Angular 19

Why Upgrade?

Benefits:

• ✅ Latest features and APIs
• ✅ Performance improvements
• ✅ Security patches
• ✅ Better TypeScript support
• ✅ Improved build times
• ✅ Bug fixes
• ✅ Up-to-date with ecosystem

Staying Current:

• Easier to upgrade incrementally than jumping multiple versions
• Better community support for latest version
• Future-proofing the codebase

Upgrade Process (Using Angular CLI)

Check for breaking changes**

# Visit Angular Update Guide
# https://update.angular.io/?v=18.0-19.0

Update zone.js if needed

npm install zone.js@~0.14.0

# Build production
ng build 

# Serve locally to verify
ng serve

Fix any deprecation warnings**

# Check for deprecation warnings in console
# Address them before they become breaking changes

Expected Changes

What might break:

• Deprecated APIs removed
• Breaking changes in Angular Material components
• TypeScript version requirements
• Build configuration changes

Common migration tasks:

• Update Angular Material imports (if changed)
• Fix type errors from stricter TypeScript

Testing Checklist

After upgrade, verify:

• Application builds successfully
• Dev server runs without errors
• Production build works
• All pages load correctly
• Forms work (validation, submission)
• Invoice creation/editing works
• Currency converter works
• Authentication works
• No console errors or warnings
• Material components display correctly
• Responsive design intact

Rollback Plan

If upgrade causes critical issues:

# Revert to previous version
git checkout -- package.json package-lock.json
npm install

# Or restore from backup
git checkout <previous-commit>

Files to Review After Upgrade

• package.json - Verify all versions updated
• package-lock.json - Ensure lock file updated
• angular.json - Check for config changes
• tsconfig.json - TypeScript config may need updates
• Component files - Check for deprecation warnings

Documentation to Update

After successful upgrade:

• Update README.md with new Angular version
• Update CONTRIBUTING.md if setup changes
• Update any version references in docs
• Note any breaking changes for contributors

Communication Plan

Before upgrade:

📢 Heads up!

Planning to upgrade Angular.ng from Angular 18 to 19 this week.

This will bring latest features and performance improvements.

After upgrade:

✅ Angular 19 Upgrade Complete!

Successfully upgraded to Angular 19. 

Changes:
- All Angular packages now on v19
- [List any breaking changes]
- [List any new features we can now use]

Contributors: Please pull latest changes and run npm install

Helpful Resources

• Angular Update Guide
• Angular v19 Release Notes
• Angular Material v19 Changelog
• Angular Blog

Pre-Upgrade Checklist

• Read Angular v19 release notes
• Check Angular Update Guide for breaking changes
• Create a backup branch
• Close or merge active PRs (or coordinate with contributors)
• Announce upgrade plan in Discord
• Ensure CI/CD passes on current version

Priority

High - Keeping framework up-to-date is important for security and performance

Notes

Best Practices:

• Do this in a separate branch (upgrade/angular-19)
• Thoroughly test before merging to dev
• Update dependencies one major version at a time
• Don't skip versions (always go 18→19, not 18→20)

Timing:

• Do this when you have time to test thoroughly
• Avoid doing right before a major release
• Coordinate with active contributors
• Consider doing on a weekend for less disruption

Champion Needed

Looking for someone to lead this upgrade! Should be:

• Familiar with Angular
• Available to fix issues
• Can thoroughly test the application
• Willing to help contributors update their PRs