Q&A

Get Up and Running with Modern Angular

• By David Ramel
• 09/10/2024

The Angular web-dev framework might seem an odd choice for a Microsoft-centric developer to consider, seeing as it's championed by arch-rival Google, but a closer look reveals many advantages.

First there's the framework's tight ties to Microsoft's TypeScript programming language, which brings the option of using types in JavaScript in order to catch errors early in the development process and lead to more robust and maintainable code. Angular is actually built with TypeScript, so if you're already familiar with that language, you'll find Angular's syntax and structure intuitive and familiar.

Angular also works well with other Microsoft dev tooling, including Visual Studio and Visual Studio Code, for which there are templates and extensions. Add in Azure integration and .NET interoperability, and one begins to envision why Angular is an increasingly popular option for Microsoft-centric developers.

To complete that vision, web-dev expert Allen Conway will be presenting a session at the huge, multi-conference Live! 360 developer event in Orlando this November titled "Getting Up and Running with Modern Angular."

"Angular is a full-featured and tenured client-side framework for creating robust web applications," he said. "With its original inception over a decade ago, the ecosystem and adoption is extensive, however you may not have journeyed down the Angular path to this point. With concepts rooted in MVC development, bridging the gap with similar experience will help you become accustomed to this familiar paradigm of code implementation and flow."

In a 75-minute introductory-level session on Nov. 20, Conway, a Microsoft MVP and Azure App Modernization Consultant at Xebia, will be sharing his insights on why Angular is such a powerful framework being put to more and more uses in the .NET/Azure/Microsoft ecosystem.

"We'll look at the basics of creating a project, building components for the view, routing for navigation, and services to interact with our server data, in just a short amount of time," he said. "The framework is flexible yet powerful and you'll see how easy it is to get started. In this session learn why Angular is such a powerful framework to subsidize the existing landscape of your back-end services and code to create a rich, responsive front-end application."

Specifically, attendees are promised to learn:

• Fundamentals of the Angular framework and why you would use it for modern web development, as well as how it fits in front of your existing back-end implementation
• How to create and run an Angular application using the CLI (Command Line Interface)
• Fundamentals of modern Angular applications by building standalone components and apps, views, and services

We caught up with Conway to get a preview of his session and to learn more about the Angular framework and its relevance to modern web development.

VisualStudioMagazine: What are the core principles of the Angular framework that make it suitable for modern web development?
Conway: Angular is a complete framework offering everything a developer needs to build robust and modern enterprise web applications. It's rooted in a component-based architecture and includes routing, DI, security, http, data binding, reactive programming, AOT, SSR, unit testing, and a host of other features so you can focus on developing code rather than building a modern framework from scratch.

Why else do you believe Angular is still a relevant and powerful framework for web development today with all the different options available?
Angular keeps at the tip of the spear in modern web client development starting with two releases per year with new features keeping parity or advancing past similar frameworks or libraries in the open-source community. These updates focus on performance enhancement, additions, improvements, and incorporate community feedback helping to shape the future of Angular.

With its TypeScript adoption that also receives frequent updates and enhancements, you'll get a one-two punch of a modern web client stack that leverages the best of browser capabilities. Add to this the deep and rich ecosystem of complementary open-source libraries and developer experience in the global community, Angular is at the forefront now more than ever.

What are the common challenges developers face when starting with Angular, and how can they overcome them?
The most common changes I see in Angular are the following and how to overcome each of them:

• Learning Angular: Angular is rooted in a component-based architecture and leverages TypeScript, HTML, and CSS for development. This stack and Angular's framework might be new and present challenges to those that haven't used it previously. The best way to learn Angular is by using it first-hand, getting educated about its features and usages from conferences, industry veterans, blog posts, videos, and tutorials.
• Migrating from older version of Angular to current versions: Migrating from an old Angular version (i.e. Angular 8) to a current version (i.e. Angular 18) can pose some challenges as updates to the framework and associated libraries have breaking changes. The best way to mitigate this is to upgrade 1 version at a time, getting the next version stable and running before repeating the process to upgrade to the next version until getting to the latest version. The best practice is to always try and remain current so framework updates are easier to manage.
• SEO and Performance: If you need additional performance and the upmost in Search Engine optimization, Angular offers Server-Side Rendering (SSR) capabilities to reduce the time to first meaningful paint as well as assist with SEO leaning on the server for rendering the application.

Can you explain how Angular's MVC (Model-View-Controller) architecture enhances web application development?
While Angular is rooted in a modern component-based design, it has concepts similar to traditional Model-View-Controller (MVC) development. This is valuable for any ASP.NET web developers or web developers from a similar background as the data flow and Angular artifacts (model classes, view templates, and component controllers in addition to concepts like Dependency Injection) will have a familiar feel and help bridge the gap to accelerate usage and understanding of Angular.

As a Microsoft MVP and Azure App Modernization Consultant, how has your experience shaped your perspective on using Angular for modern web development?
I've used Angular helping several Fortune 100 clients in various business domains create robust and capable enterprise modern web applications using Angular. It's vast capabilities and easy to understand programming flow make it a joy to use and highly productive as well. New engineers always seem to be able to get up to speed quickly and adopt Angular's coding style which helps as you don't have to spend enormous amounts of time wrapping your head around something overly complex.

In your opinion, what are the most critical skills or concepts a developer should master to become proficient in Angular?
Understanding Angular's core offering and the component-based architecture are key to making a successful modern web application. Preventing pitfalls like adding in unnecessary libraries or over architecting the application is sound advice as recreating the wheel of what Angular offers isn't productive. Understanding all the tools Angular offers and using them to their fullest will help anyone use Angular proficiently.

What key takeaways should attendees expect from the "Getting Up and Running with Modern Angular" session?
Attendees can expect to get a comprehensive overview of Angular and its features all while seeing code examples on an easy to digest backdrop of a modern Angular application. This will help them decide if Angular is a good choice for their application development needs and provide numerous data points to help support that decision making process. Existing Angular devs can see Angular today and what newer features exist they may have missed making sure they are current on the framework.

What advice would you give to developers who are new to Angular and looking to get started or prepare for your session?
Whether you are new to Angular or have used it in the past, come take a look at Angular today to see all its features and capabilities. If you are evaluating multiple front-end options (i.e. Angular, Blazor, React, etc.) this will give you a great insight to help you make sound decisions on your team to start using Angular today!

Note: Those wishing to attend the conference can save hundreds of dollars by registering early, according to the event's pricing page. "Save $400 when you register by the Super Early Bird deadline of Sept. 27!" said the organizer of the event, which is presented by the parent company of Visual Studio Magazine.