Using AI with Angular — 2025 update
It’s 2025, and AI is almost everywhere at this point. To me, the AI landscape was changing too rapidly to write anything about it before today, because what is the point of writing something if it isn’t true anymore two weeks later?
Also, our experience with AI depends on so many variables these days that it can be difficult to know how to use it. For instance, should we use an AI-driven IDE or use AI as a plugin in our current IDE? Or should we ask AI on the web, independently of our code editor?
I’ll cover these topics and give you some tips & tricks that have been serving me well lately, but remember that everyone’s experience will be different: Behaviors we see today might be completely different two weeks or two months from now, so my goal is to focus on what seems to be here to stay.
Also, AI features vary widely by geography: Gemini in the US is more advanced than Gemini in Europe, for instance, even when working exclusively in English. That’s most likely because of the lack of privacy regulations in the US, and Google testing more advanced versions closer to home.
Enter MCP (Model Context Protocol)
No matter your IDE or AI provider (Gemini, ChatGPT, Claude), MCP has emerged as the open standard for LLMs to interact with.
What is MCP? It’s a protocol that exposes a server to the LLM. Instead of the LLM probing the internet or relying on its internal biases, the MCP server acts as a trusted partner, providing the LLM with accurate information.
An MCP server exposes tools with specific purposes, and it’s no surprise that in the case of Angular, the very first tools exposed by the Angular MCP server were “get best practices” and “search documentation” to ensure the LLM would not return older syntax and APIs.
In the current state of things, the Angular MCP server exposes the following tools, which an LLM can trigger to get assistance:
In other words, MCP is a guardian that keeps the LLM on track and with accurate context, instead of having to sort through the craziness of the internet.
Another critical feature of MCP servers is that they can run on your machine, allowing them to access your file system, OS version, etc. This is a lot of helpful context for troubleshooting an issue, for instance. You won’t need to prompt for all the information or copy-paste your code into a browser, as the MCP server will handle that soon enough.
How does the LLM know about the Angular MCP server?
We have to tell it all about it. The steps for MCP support are listed at https://angular.dev/ai/mcp. For most IDEs, it consists of a config file (mcp.json) where we add this JSON syntax:
{
"mcpServers": {
"angular-cli": {
"command": "npx",
"args": ["-y", "@angular/cli", "mcp"]
}
}
}
You can also try ng mcp, which, in my experience, returns the above JSON and does nothing else. Remember that the Angular MCP server is CLI-based and is still in its infancy. Ultimately, that server will be able to get errors from your “ng serve” command or the browser console and get that info for the LLM agent to fix. Most likely in 2026!
For now, if we want agentic features, which means having a small team of AIs doing work for us, our best bet is to use an IDE explicitly designed for that purpose.
Enter Google Antigravity
Antigravity was released in public preview on November 18th, 2025. It’s an AI-driven fork of VS Code designed as a “Mission Control” center where you orchestrate autonomous agents to do the work for you.
In other words, you prompt Anitgravity to do something, an AI agent creates a plan for it, then another agent writes the code according to the plan, and another agent tests the result. It’s mostly all automatic.
As a result, the first thing I did with Antigravity was ask if it knew about the Angular MCP server, which it didn’t, then asked how to configure it, followed the steps, up to the point when it could tell me about it:
Then I wanted to challenge Antigravity on one of the tasks the Angular MCP is supposed to help with: migrating a project to Zoneless.
Though it couldn’t read the files directly, the agent’s answer clearly showed that the agent used the MCP server and got some accurate Angular knowledge out of it:
One of the main problems with AI these days is that it acts with full confidence. When an agent says, “I’m done, everything is migrated to Zoneless”, it seems that the agent knows what it’s talking about, but it’s not.
So I asked Antigravity: Can you run tests in the browser to check your migration work?
It told me to install a Chrome extension, and then some magic happened, the browser opened, and an AI agent started clicking around and testing the UI “manually” for a few minutes:
The tests failed because using “onPush” wasn’t enough; the code had to be 100% “onPush” friendly, so Antigravity revised its plan to use Signals everywhere… of course!
And then I still had to babysit my agent, to make sure: Did you rerun the tests to double-check your work? It said no, then did something stupid, running the unit tests only, not the browser tests, so when I asked about the browser tests, it answered:
So it had actually run the tests, done screenshot validation, and everything, which was perfect, but somehow didn’t answer correctly the first time around.
And that’s the main issue with AI these days: Sometimes it seems incredibly knowledgeable and thorough, only to fail like a beginner on the following simple question… Which means you have to double-check everything, always.
Yet, it seems the future is all about MCP giving the LLM true “agentic” capability, meaning the AI can do things such as interacting with a browser, reading your file system, and running tasks within the limits of what the MCP server allows.
Conclusion
If you haven’t caught the AI train yet, starting with using the Angular MCP server, or any MCP server, seems like a good idea to get started. This is because MCP gives enough guardrails and actionability to make the LLM smarter and truly useful.
That said, AI will still do outdated or stupid things, as shown in my examples above. The key is to keep asking the agent to double-check its work or question its output: “Why did you use standalone: true in your components when it’s already the default value?”
To which it will answer, “we’re using Angular 21, where standalone is already the default, so I’ll remove those declarations from all components”. Thanks, but why not do it right in the first place? Maybe it’s for us human beings to feel smart and in control, who knows?
You can give Google Antigravity a go to see where all of this is going. If you have any questions or any other tools you’re using, please let me know in the comments. I’m always happy playing with new toys.
My name is Alain Chautard. I am a Google Developer Expert in Angular and a consultant and trainer at Angular Training, where I help web development teams learn and become proficient with Angular / React / JavaScript.
If you need any help learning web technologies, feel free to get in touch!
If you enjoyed this article, please clap for it or share it. Your help is always appreciated. You can also subscribe to my articles and Weekly Angular Newsletter to receive helpful weekly tips and updates about Angular.
Using AI with Angular — 2025 update was originally published in Angular Training on Medium, where people are continuing the conversation by highlighting and responding to this story.
