This project was created so I could research how to render a horizontal navigation bar for use with routing in Angular using Angular Material components.
I had previously figured out how to do this using Angular plus Bootstrap in a similar project.
The biggest obstacle I faced was that all the examples of navigation in Angular Material used vertially oriented, sidebar navigation (fixed or fly out).
I could not find a single example on the Angular Material website on how to create a horizontally oriented navigation bar.
- Angular CLI - to create the project.
- Angular - to drive the application
- Angular Material - for pre-styled widgets
- SCSS (mostly colors) because the whole point of using a canned set of SCSS/CSS such as Angular Material or Bootstrap is to avoid getting "tangled in the weeds" of home-brew custom SCSS/CSS.
- Upgraded to Angular 7 and Angular Material 7 on February 14, 2019.
- Upgraded to Angular 8 and Angular Material 8 in June 2019
- Upgraded to Angular 9 and Angular Material 9 in March 2020
- Upgraded to Angular 10 and Angular Material 10 in September 2020
- Upgraded to Angular 11 and Angular Material 11 in March 2021
- Upgraded to Angular 12 and Angular Material 12 in May/August 2021
- Upgraded to Angular 13 and Angular Material 13 in December 2021 and February 2022
- Upgraded to Angular 13.3.3 and Angular Material 13.3.3 in April 2022
- Upgraded to Angular 13.3.9 and Angular Material 13.3.7 in May 2022
- Upgraded to Angular 14.0.1 and Angular Material 14.0.1 in June 2022
- Upgraded to Angular 14.0.4 and Angular Material 14.0.4 in July 2022
- Upgraded to Angular 14.2.9 and Angular Material 14.2.6 in November 2022
- Upgraded to Angular 14.2.10 and Angular Material 14.2.7 in November 2022
- Upgraded to Angular 15.0.1 and Angular Material 15.0.0 in November 2022 which also required removing @angular/flex-layout because it is no longer being upgraded with each new release of Angular.
- Upgraded to Angular 15.2.6 in April 2023
- Upgraded to Angular 15.2.8 on April 26, 2023
- Upgraded to Angular 16.1.3 on July 2, 2023
- Upgraded to Angular 16.2.1 on August 20, 2023
- Upgraded to Angular 16.2.3 on September 1, 2023