Beyond the Horizon: How Angular is Embracing AI for Next-Gen Apps

Author: Simona Cotin, Sr. Engineering Manager AngularWe hope you enjoyed watching the Angular + AI Developer event on YouTube where we were able to announce the new Web Codegen Scorer tool. This post goes more into details on how the tool came about an…


This content originally appeared on Angular Blog - Medium and was authored by Angular

Introducing Web Codegen Scorer

Author: Simona Cotin, Sr. Engineering Manager Angular

We hope you enjoyed watching the Angular + AI Developer event on YouTube where we were able to announce the new Web Codegen Scorer tool. This post goes more into details on how the tool came about and the story for Angular and generative AI in general.

As developers like you embed artificial intelligence in their workflows, what does that mean for the framework? What does that mean for the future of development? While we can’t predict the future, this post shares more about what the Angular team is thinking about what’s next.

Introducing Web Codegen Scorer for the developer community

At the AI developer event, you learned about our plans around critical AI technologies and how Angular is reshaping itself to meet the needs of the developer community of today and the burgeoning community of tomorrow. Angular of the future is a framework for builders across the spectrum — it’s for people who want to create apps by primarily using AI-powered tools (including vibe coding) as well as experienced developers who want to have a coding agent work as a partner in the development of tools. No matter the tool, we want Angular to fit into your story and make sure that LLMs produce excellent code quality for your Angular applications. Which is why we created the Web Codegen Scorer which we’re now sharing with you:

A dashboard for the ‘Web Codegen Scorer’ showing a total score of 97 for an ‘Angular — Single file setup’ using the gemini-2.5-pro model. The screen breaks down performance into categories like Build, Runtime, Security, and Accessibility, with most results being successful.

Web Codegen Scorer focuses on web code generation and a comprehensive quality evaluation. For the Angular team, it solved several problems. First, it allowed us to create the fine-tuned prompts you can find on angular.dev/ai to optimize LLMs for the current state of the framework. Second, it helps the Angular team to better integrate application features and syntax as the framework evolves, by making it easy to analyze and debug the specific common ways in which LLMs fail and iterate on mitigating those problems. For example, it allows LLMs to be better equipped to handle Signal forms on day zero. To make the tool more powerful, we improved the scoring mechanism by collaborating with AI, security and accessibility experts here at Google.

One of Angular’s long held beliefs is that to help you succeed, we should work to move the industry forward. With that we reached out to the SolidJS team and collaborated on seeing how Web Codegen Scorer might improve their code generation story. Dev from the SolidJS core team shared some preliminary results with us and we’re excited to see that this tool helped the team identify some ways it could improve their system prompts and context for even better generated applications and AI-assisted engineering tasks.

A dashboard for the ‘Web Codegen Scorer’ shows a total score of 97 for a ‘Solid.js (Example)’ test using the gemini-2.5-pro model. The screen provides breakdowns for performance, Build, Runtime, Security, and Accessibility, along with token usage details.

We’re excited about the positive impact this tool could have for the SolidJS team as well as other framework authors. By open sourcing the tool, we encourage you to contribute: Framework and library authors can build their own evals and improve code generation for their communities. Anyone can contribute improvements or ideas to the tool, to help improve code generation in Angular and other frameworks. The AI future has to include the freedom to choose the tools that help you build the apps your users will love.

The Angular MCP Server is ready for you to try

When you use an agentic development process, it’s essential that your agent has access to the right tools. With the Angular MCP server that is part of Angular v20.2, you can have your coding agents use our built in tools to enhance your development sessions. For the future, we’re working on some new experimental features for the MCP server:

  • Modernization tools to help migrate your application syntax to newer, more modern Angular code. For example, consider the work it requires to update from the decorator-based inputs to the new signal-based inputs. We imagine a world where agents and code generation tools can be empowered by agentic behaviors and our schematics.
  • Addressing stale knowledge in LLMs with retrieval augmented generation (RAG). A local RAG engine gives an AI assistant a searchable, curated database of official, best-practice Angular code samples and direct access to our latest documentation. This means your AI tools will have access to up-to-date information as the source of truth from day zero.

The industry continues to shift quickly and new tools and standards will emerge. Our goal is to stay up-to-date and ensure that AI Angular experience benefits you, the developer community.

Expanding Angular Support in AI products

The Angular team believes that you should have a choice of framework in web development, even when you’re using AI to create the first version of your application, before you start iterating. That’s why the team reached out to partners in Google to help improve multi-framework support in AI powered tools.

Today, two of those integrations are ready for you to try:

  • Angular support is available in Gemini Canvas. To try it out, on the Gemini Web App select “Tools” and “Canvas” and make sure to include something in your prompt that you want to create an Angular app.
Screenshot of a development environment showing an Angular app preview named “Image Time Machine.” The app allows users to upload an image, select a style (e.g., ‘Golden 20s,’ ’80s Neon’), and click “Time Travel!” to transform the photo using Gemini Nano Banana. An AI conversation pane on the left describes the app’s features.
  • Google AI Studio has also added Angular support. To use it, head to the Build Tab, click the Advanced Settings icon on the side of the chat box and select “Angular (Typescript)” from the system instructions template menu.
Screenshot of an application’s main screen with the title “Build apps with Gemini.” Below the title is a prompt input field reading: “Start building with Gemini, try ‘Build me an AI photo editing app using Nano Banana’.” A gear icon (settings) is highlighted with a red arrow next to the input field, followed by an Add button and an Upload button. Three suggested actions are visible below: “Start from a template,” “Dynamic text game using Gemini,” and “Gemini powered code review tool.”
Step 1: Google AI Studio — Select the Advanced Settings Icon
Screenshot of an “Advanced settings” panel showing the selected AI model as “Gemini 2.5 Pro” and the System instructions template set to “Angular (TypeScript).” A description indicates the configuration is for working with Angular components, services, and modules.
Step 2: Google AI Studio — Select the Angular (TypeScript)

Thinking Beyond the Horizon

LLMs became a critical part of many developer workflows. Angular’s goal is to help developers build web applications and we think that Angular of today is well set up for the future — as an opinionated framework, there are stronger conventions around application structure and patterns, and building blocks such as services and dependency injection help build a consistent and predictable application architecture, discoverable by LLMs.

However, we’ve also asked ourselves: What might an AI-first framework might look like?

This goes beyond vibe coding — AI agents should be able to handle changes in large codebases, where context windows become important. There should be less room for LLMs to introduce antipatterns, performance bugs or to break the security model. The authoring experience of the framework should be optimized for both humans and LLMs, leading to higher productivity in writing and generating code.

For the last few weeks, we’ve been doing some experiments, using the evaluation tool to make assessments of various hypotheses related to the authoring format and the application structure. We are in the middle of the research and we’ll be sharing the results as soon as possible. Please rest assured that when we start incorporating those learnings into Angular, we’re taking you along this journey in a way that prioritizes your needs and ensures you have a smooth experience.

This the beginning of something special

As cliché as it may sound, we believe that it’s still early days in what developers will be able to achieve not only with AI but with Angular and AI. We are so grateful that millions of developers call Angular their framework of choice. Our goal is to be champions for them by ensuring that the tools they love have a well-lit path for using Angular. Building scalable, robust, AI-powered applications has never been more achievable than it is now with the recent advances in Angular. Continue to dream big and build the next wave of applications with Angular, powered by AI.

Create applications your users will love 🩷


Beyond the Horizon: How Angular is Embracing AI for Next-Gen Apps was originally published in Angular Blog on Medium, where people are continuing the conversation by highlighting and responding to this story.


This content originally appeared on Angular Blog - Medium and was authored by Angular


Print Share Comment Cite Upload Translate Updates
APA

Angular | Sciencx (2025-09-16T16:01:49+00:00) Beyond the Horizon: How Angular is Embracing AI for Next-Gen Apps. Retrieved from https://www.scien.cx/2025/09/16/beyond-the-horizon-how-angular-is-embracing-ai-for-next-gen-apps/

MLA
" » Beyond the Horizon: How Angular is Embracing AI for Next-Gen Apps." Angular | Sciencx - Tuesday September 16, 2025, https://www.scien.cx/2025/09/16/beyond-the-horizon-how-angular-is-embracing-ai-for-next-gen-apps/
HARVARD
Angular | Sciencx Tuesday September 16, 2025 » Beyond the Horizon: How Angular is Embracing AI for Next-Gen Apps., viewed ,<https://www.scien.cx/2025/09/16/beyond-the-horizon-how-angular-is-embracing-ai-for-next-gen-apps/>
VANCOUVER
Angular | Sciencx - » Beyond the Horizon: How Angular is Embracing AI for Next-Gen Apps. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2025/09/16/beyond-the-horizon-how-angular-is-embracing-ai-for-next-gen-apps/
CHICAGO
" » Beyond the Horizon: How Angular is Embracing AI for Next-Gen Apps." Angular | Sciencx - Accessed . https://www.scien.cx/2025/09/16/beyond-the-horizon-how-angular-is-embracing-ai-for-next-gen-apps/
IEEE
" » Beyond the Horizon: How Angular is Embracing AI for Next-Gen Apps." Angular | Sciencx [Online]. Available: https://www.scien.cx/2025/09/16/beyond-the-horizon-how-angular-is-embracing-ai-for-next-gen-apps/. [Accessed: ]
rf:citation
» Beyond the Horizon: How Angular is Embracing AI for Next-Gen Apps | Angular | Sciencx | https://www.scien.cx/2025/09/16/beyond-the-horizon-how-angular-is-embracing-ai-for-next-gen-apps/ |

Please log in to upload a file.




There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.