Fast and safe: AI in your Angular codebase
Ship an AI feature, let agents write Angular under rules, and keep both secure, in three days, on an enterprise-shaped codebase.
Adil Ben Moussa
Frontend architect · Angular, React, Swift · Tétouan, Morocco
- Twenty years of software in the Netherlands as programmer, team lead and software architect, now based in Tétouan. Angular since AngularJS, in healthcare, education, digital media and banking products used every day by thousands of professionals.
- Ships the same architecture in three stacks, enterprise Angular for clients, React Native for a school platform, SwiftUI for an App Store app first shipped in 2010, with AI coding agents inside all of them.
What you take home
You leave with two things: an Angular feature powered by an LLM that you built yourself, with streaming, tool calls, error and cost handling; and a working AI-assisted workflow for your existing codebase: agent setup, rules, architecture checks the agent must pass, and a review discipline your team can adopt on Monday.
One realistic enterprise application carried through all three days: a multi-module Angular app with legacy parts, real forms and a real backend, so every exercise lands in code that looks like yours.
Try the demo codebase
Every exercise runs on Atlas Bank, an imaginary Moroccan bank built with Angular and Nx. Click through the live app, then read the code and the rules file the agents work from.
Who it is for
- Angular developers with at least one year of production experience
- Tech leads and architects who must decide what their team may and may not do with AI
- Teams in nearshore centres and product companies working on large, long-lived Angular apps
Prerequisites
- Comfortable with components, services, signals or RxJS, and the Angular CLI
- Laptop with Node (current LTS), Angular CLI, Git and an IDE
- An AI coding agent installed (GitHub Copilot, ChatGPT and Codex, Claude Code or Cursor); API keys for the exercises are provided
Agenda
- 01
AI-assisted workflow in an enterprise Angular codebase
Track 1 · agents in your codebase- Layered guidance for the agent: the official and skills, plus the 40-line diff where your repo deliberately differs, and why 400-line generic instruction files fail
- Architecture as an executable contract, two flavours: Nx (tags + dependency matrix) and for plain Angular CLI projects; public-API-only imports
- One repo, several agents: keep , and , , and on the same rules with a shared , the open format (Angular's official skills use it), servers and lint that every tool must pass; thin tool-specific files, one source of truth
- Where agents fail in Angular code: the fifteen judgement rules (defensive code, computed vs effect, self-subscribing services, service-imports-component, magic literals, analogue-first…) walked against a real agent diff, then which ones become ESLint bans
- 02
Modernising legacy Angular with agents
Track 1 · agents in your codebase- Migrating to , and the new : the agent proposes the plan, the room reviews it against demote-don't-delete, three-tier state and an per decision-changing behaviour
- Generating tests, then hardening them: sociable tests, fakes only at system boundaries, harnesses queried by label, and the question 'what could I delete and stay green?'
- Review discipline: diff size, one commit per task bottom-up, PR body explains every first use, when to stop the agent
- 03
Building an AI feature in Angular
Track 2 · AI inside your product- responses into the UI with signals
- from the front end: letting the model act on your app
- Error states, latency, cost control and rate limits: the production part nobody demos
- 04
Agentic UI
Track 2 · AI inside your product- Components an agent can drive: the / / family and what is stable today
- Dynamic UI generated at runtime: where it is worth it and where it is not
- 05
Security: AI as the attacker, AI as the reviewer
Both tracks- Where the standard lives: the for web applications and the OWASP Top 10 for LLM applications, mapped to what a frontend team actually controls, so the team knows where to look when the list changes, not what it said the year of the workshop
- through your own UI: a model reading user content, a tool call it should not make, and the data boundary in the browser
- The flaws agents write at scale: , authorisation checks that only exist in the client, secrets in the bundle, dependencies nobody asked for, found live in an agent diff on Atlas Bank
- AI as the reviewer: frontier models now find real vulnerabilities in frontend code; a security scan on every agent diff before a human reads it, what it catches, what it cannot see, and where it sits in the pipeline
- What never leaves the client, auditability, and how to explain all of it to your security team
- 06
Team adoption
Both tracks- The eight-part AI policy your team writes in the room: installed skills, repo rule docs, bans, boundary tool, PR shape, review bot + self-review skill, edit hooks, command deny-list
- What it costs and what each tier buys: free tiers, the entry per-seat plans, the premium per-seat plans, team and enterprise seats, local models for data-sensitive teams, current prices checked the week of the workshop, never from memory, and how a 40-line rule doc and a 300-line diff limit cut the token bill
- Measuring whether AI actually helped: lead time, defects found in review, review load per PR
Dates & formats
No public dates yet. The first editions run in-house with teams in Tangier and Casablanca. Request one for your team, or subscribe below to hear about the first public date.
Request in-house workshopFAQ
Is this an introduction to Angular?+
No. It assumes you already build Angular apps for a living. If your team needs foundations first, ask about an in-house 'Modern Angular' day before this workshop.
Which AI tools do you use?+
The workshop is tool-agnostic: the patterns work with Copilot, ChatGPT and Codex, Claude Code and Cursor. Exercises are run with whichever agent your team already uses.
Remote or on-site?+
Both. In-house workshops are on-site at your office, in Morocco or in the Gulf when a team invites us (Riyadh, Doha, Dubai). Public dates are remote or in Casablanca / Tangier. Remote half-days in your time zone are available for teams that prefer it, six half-days in total.
Which language?+
Spoken language is your choice: Arabic or English. Slides, code and all materials are in English so they stay useful after the workshop.
Our company won't pay for the expensive AI plans. Is the workshop still useful?+
Yes, and that case is covered on purpose. Every exercise runs on an entry per-seat plan or a free tier, and one segment is about what the premium tiers actually buy, when a team needs them, and how rules and diff limits keep the token bill down. Local models are shown for teams that cannot send code to a cloud.
We use different AI tools in the same team. Which one do you assume?+
None. The setup is built so Copilot, ChatGPT and Codex, Claude Code, Cursor and Gemini CLI read the same rules and pass the same checks. Everyone brings the agent they already have and the room compares the diffs.
Do we get the material?+
Yes: the full repository, the slides and the exercise solutions, plus the rules and instruction files you can drop into your own repos.