Agentic Engineering: From Vibe Coding to Professional AI-Assisted Workflows
Alexander Thalhammer
Experienced software developer and architect with 20 years of experience in planning and implementing web-based business applications. Certified professional trainer according to ISO/IEC 17024, 9 years teaching assistant at the University of Graz.
In this 2-day workshop, advanced Angular developers learn how to use AI not just occasionally to generate code, but as a traceable part of professional Angular development. The storyline is deliberately practical: first, we make an Angular workspace AI-ready, then we build repeatable Agentic Engineering workflows, use those workflows for fast UX and component prototypes, and finally apply them to real Brownfield refactoring.
By the end of the workshop, you will be able to:
- set up your Angular workspace AI-ready and secure it with the right guardrails
- use agentic workflows to create, improve, and review production code
- analyze and modernize legacy components in traceable steps
Highlights
✅ Fully online: 2 days, 4 compact half-day blocks
✅ For advanced Angular developers with production project experience
✅ Proven and latest best practices for Angular v21/v22 apps
✅ Agentic Engineering with Codex, Claude Code, Gemini, Cursor, JetBrains & MCPs
✅ approx. 50% hands-on: live coding, exercises, and pair programming with the trainer
✅ Enterprise-ready guardrails: secrets, mandatory reviews, and quality gates
✅ Sample repo, slides, exercise materials, and case study as a blueprint for your own projects
Agentic Engineering Workshop Agenda:
Part 1: Agentic Engineering: AI-ready Setup for Angular Projects
- Project setup: Angular strict mode, ESLint, Git, Prettier, package manager, Nx/monorepo variants, and reproducible local execution
- Highlight: Our Angular Best Practices Rules & Style Guide for AI and teams: custom rules based on the official Angular best practices, extended with additional refinements, special rules, and project guardrails for AI tools
- Security & quality gates: secrets handling, permissions, prompt leaks, mandatory reviews, CI baseline, and central lint/type checks
- Project knowledge for AI: README, AGENTS.md, ADRs, and .aiignore
- Codex: CLI, IDE extensions vs. app, modes, worktrees, and safe local execution
- Claude Code: CLI, IDE extensions vs. app, Plan Mode, checkpoints, and diff review
- Tooling setup: VS Code, JetBrains, Cursor, model choice, Angular CLI MCP, and concrete MCPs (Chrome DevTools, Figma, GitHub, Playwright)
- Outcome: an AI-ready Angular workspace with clear guardrails, tooling setup, and project knowledge for agents
Part 2: Agentic Engineering: Foundations, Skills, and Controlled Workflows
- Mental model and model choice: LLMs, context windows, tool calls, reasoning, costs, and limits
- Heuristics: when fast models are enough and when frontier models are worth using
- Spec-first and plan-first: goal, context, constraints, acceptance criteria, and Definition of Done
- Context work: reading the repository, finding relevant files, understanding error patterns, and making assumptions visible
- Skills, rules, and memory: reusable instructions, project guardrails, and team conventions
- Controlled workflows: ask, plan, edit, review, debug, refactor, diff review, test run, and PR preparation
- E2E tests as a verification layer in the agent workflow: Playwright or Cypress, regression tests, user flows, and automated checks of agent output
- Human-in-the-loop and typical mistakes: checkpoints, escalation, hallucinations, overengineering, and missing verification
- Sub-agents, evaluation & costs: slicing tasks, parallelizing work, detecting errors, token tracking, and stop criteria
- Outcome: a repeatable Agentic Engineering workflow for planning, implementation, review, and cost control
Part 3: Vibe Coding with Angular: From UX Prototypes to Production-Oriented Components
- Understanding Vibe Coding: fast exploration with AI, clear boundaries, and the transition to engineering discipline
- From idea to prototype: user flow, screens, states, dummy data, microcopy, and clickable UI variants
- Tool comparison: v0, Bolt, Lovable, and Angular-specific paths with Codex, Claude Code, Cursor, or JetBrains
- UX, UI, and Figma workflows: prompting, Figma MCP, Code Connect, design feedback, and review loops
- Component libraries: Angular Material, PrimeNG, Spartan/UI, ZardUI: AI-friendly APIs, design tokens, and the path toward your own design system
- From prototype to component: scope, API, data flow, loading/error/empty states, accessibility, Storybook, and targeted tests
- Outcome: a fast prototype that is deliberately evolved toward a maintainable Angular component
Part 4: Agentic Refactoring: From Grown Components and Legacy Codebases to Modern Angular Projects
- Brownfield start and refactoring plan: finding hotspots, prioritizing findings by risk/business value, characterization tests, feature flags, and small PRs
- Working on legacy components: unclear responsibilities, oversized files, tight coupling, and areas that are hard to test
- Reducing technical debt instead of creating AI slop: reducing complexity, clarifying responsibilities, and keeping changes deliberately small
- Angular modernization: standalone components instead of NgModules, new control flow with @if/@for/@switch, and modern dependency injection with inject()
- Signals & state: signal(), computed(), effect(), linkedSignal, resource(), interop with toSignal/toObservable
- Signal-based component API: input(), model(), output(), viewChild(), contentChild()
- Zoneless Angular: default since v21, provideZonelessChangeDetection, OnPush checks, and typical migration risks
- State modernization: reviewing RxJS patterns, assessing NgRx to Signal Stores, and simplifying data flow step by step
- ng update and agentic patch work: schematics, codemods, breaking changes, diff review, test run, and PR preparation
- Outcome: a traceable refactoring workflow that is repeatable in teams even for real legacy codebases
Upcoming events
Reviews
I also appreciated the concrete examples of how to implement DDD in folder and files structures.
Individual In-House Company Workshops
All of our workshops are also available remotely or in-house at any time.
Contact us for an appointment
FAQs on our workshops
How do your workshops and courses work?
Our seminars around Angular are a mixture of lecture, live coding and actual exercises. Together we implement what we have learned during the workshop directly on a example project. This mixture guarantees that the course never gets boring and “hands-on” is required instead of gray theory.
Who is the Angular hands-on training designed for?
Our Angular hands-on workshop is aimed at anyone who wants to develop applications with Angular in the future or is already doing so and now wants to better understand the background, context and building blocks of the framework.
Participants should have basic knowledge of web development (basic knowledge of HTML and JavaScript).
For advanced Angular developers we offer advanced seminars and intensive trainings on specific use cases.
Where do the Angular workshops take place?
Our trainings take place as public workshops in seminar rooms at central hotels in Germany, Austria and Switzerland. In-House company workshops take place at your office or conference room.
All courses are also available as remote workshops, where we meet online in a virtual classroom and do the training via video calls, screen sharing and live coding.
Who are the trainers?
Our workshops are held by experienced trainers and software architects. In recent years, we have provided Angular training to well-known companies – including well-known banks, insurance companies, industrial groups. Trainers include well-known conference speakers, authors of books and professional articles, bloggers, Google Developer Experts and university lecturers.
At what times are the training sessions held?
Especially for dedicated company trainings, we are happy to accommodate you. Typical times are 9:00AM to 4:30PM / 5:00PM. Some of our English-language workshops are timed so that you can also attend at US friendly times.
Can we also book online training courses?
Absolutely. In fact, since the pandemic, this has been our main business model and we have had very good experience with it. We use a combination of screen sharing, interactive online whiteboards, and are happy to connect to your computer for support during the exercises if you wish. As with our on-site training, we use a combination of short presentations, discussions, live coding and hands-on labs.
Since there is no travel involved, you also save time and money. We can also respond more flexibly to your scheduling needs.
Can we adapt the training for our purposes?
Yes, very much so. In fact, that’s one of the benefits of dedicated corporate training. You are welcome to weight, shorten or add to our agenda proposals. As a rule, we also coordinate with your trainer about 2 weeks before the training. If you wish, we can also arrange it earlier.
Why Angular?
Among other things, Angular’s wide distribution speaks for itself, but also the fact that Google, an Internet giant that also uses the framework very intensively, is behind it. Google alone has over 2600 solutions based on it. Due to the wide distribution, there is a large community and thus a lot of know-how on the market as well as (free and commercial) products that are adapted to Angular. In addition, Angular provides much of what you need for large applications out of the box: test automation, form management, routing, etc. In this respect, you get a stack whose components are coordinated and work together in the long term.
How do you compensate for different prior knowledge?
The good news up front is that participants with different levels of prior knowledge are the rule, not the exception, in adult education. That’s why you’ll find optional fade-in hints and bonus exercises on our exercise sheets, for those who are a little faster. Of course, we also provide personal support for the exercises.
How many participants are recommended?
If you book a company training with us, we leave this decision to you in principle. However, experience shows that there should not be more than 15 participants, especially since a seminar lives very much from questions, discussions and practical exercises.
What software do we need?
Please install the following software packages on your computer:
– NodeJS in current version (we test with current LTS version).
– Angular CLI (npm i -g @angular/cli)
– Git
– Visual Studio (free) or WebStorm/IntelliJ (commercial)
Selected happy customers
