Hands On: Security in Angular Applications Intensive Training
Advanced · 5 half days or flexible as in-house training · In-House
In this hands-on workshop, you'll learn how to systematically secure Angular applications against real-world attack vectors. You'll work with actual attack scenarios, analyze vulnerable code examples, and gain an in-depth understanding of the security mechanisms that Angular and modern browsers provide.
The focus is on the topics that most frequently lead to security incidents in practice: Cross-Site Scripting (XSS), Content Security Policy (CSP), secure token management in the browser, OAuth 2.x and OpenID Connect, as well as the Backend-For-Frontend (BFF) pattern as an architectural answer to the security limitations of SPAs.
By the end of the workshop, you'll not only know what the vulnerabilities are, but how to reliably detect, prevent, and test them in your own Angular projects.
Agenda
Browser Security Fundamentals & Same Origin Policy
- Same Origin Policy and CORS: fundamentals and configuration
- How browsers isolate content and where the limits are
- Dealing with malicious JavaScript in the browser
- Overview of typical attack vectors against Angular applications
- Hands-on: analyzing vulnerabilities in the browser DevTools
Cross-Site Scripting (XSS) in Angular
- How Angular prevents XSS attacks by default – and when it fails
-
Using the
DomSanitizercorrectly: usingbypassSecurityTrust*safely - Typical XSS pitfalls in Angular templates, routing and third-party libraries
- Enabling and configuring Trusted Types in Angular
- Hands-on: attacking and securing a vulnerable Angular app
Content Security Policy (CSP)
- What CSP does – and what it doesn't
-
CSP directives in detail:
script-src,style-src,connect-srcand more - Common mistakes in CSP configurations and how you avoid them
- Implementing a strict CSP with nonces for Angular applications
- Integrating and testing CSP in the Angular build process
- Hands-on: configuring and debugging a CSP policy for an Angular application
Secure Token Management & OAuth 2.x
- Security risks of storing tokens in the browser (localStorage, sessionStorage, cookies)
- OAuth 2.0/2.1 and OpenID Connect: fundamentals and security implications
- The PKCE flow and why it is mandatory for SPAs
- Security recommendations for using OAuth 2.x directly in Angular
- Hands-on: implementing an OAuth 2.x flow securely in Angular
Backend-For-Frontend (BFF) Pattern
- Why SPAs have structural security limits with OAuth
- The BFF pattern as an architectural answer: concept and benefits
- Server-side token handling: cookies vs. bearer tokens
- When is the BFF effort worth it – and when is it not?
- Hands-on: securing an Angular app with a BFF backend
Vulnerability Scanning & Security in the Development Process
-
Static analysis: ESLint security plugins,
npm audit, Snyk - Dynamic analysis: an overview of OWASP ZAP and other tools
- Integrating security tests into CI/CD pipelines
- OWASP Top 10 for Angular developers
- Wrap-up: checklist for secure Angular applications & next steps
What you should know
- Basic Angular knowledge – you should already have developed your own Angular applications
- TypeScript knowledge – confident use of TypeScript is required
- Basic understanding of HTTP – how requests, responses, headers and cookies work
- Development environment: Node.js (current LTS), Angular CLI and an editor (VS Code recommended) should be installed
Prior knowledge of web security is helpful, but not required. All security concepts are introduced in the workshop.
The course “Hands On: Security in Angular Applications” is aimed at Advanced.
What's Included
Request in-house/corporate training
Submit a request and book a preliminary meeting with our advisor.
What our participants say
Kompetenter Trainer, viele nützliche Links und spannender Inhalt.
Attended Angular & Agentic AI Engineering Intensive Training
guter Workshop, um die Grundlagen zu verstehen und einen Einstieg zu finden.
Attended Angular & TypeScript Intensive Training
Sehr gute Schulung vom Super(Web)Dave
Attended Angular & TypeScript Intensive Training
Insgesamt war es eine gute Schulung, die einen Mehrwert gebracht hat! Kurzweilig, guter Trainer, spannendes Thema.
Attended Angular Advanced: Architecture, Quality & Mono-Repositories Intensive Training
Immer gerne wieder. Im nächsten Jahr dann vielleicht der Advanced-Kurs.
Attended Angular & TypeScript Intensive Training
Top Trainer und top Workshop! Fühle mich super motiviert und kann nicht abwarten das Gelernte anzuwenden. Danke!
Attended Angular & TypeScript Intensive Training
Questions and answers
Our public Hands On: Security in Angular Applications remote courses take place from 9:00 AM to 1:00 PM, on-site Hands On: Security in Angular Applications trainings from 9:00 AM to 4:30 PM.
For in-house seminars, individual adjustments are possible.
Yes. At the end of each of our Hands On: Security in Angular Applications seminars, participants receive a signed certificate of attendance.
The certificate includes a verification URL and can be shared on your LinkedIn profile. Learn more about managing certificates on LinkedIn.
Yes, we offer our Hands On: Security in Angular Applications seminars in German and English.
Public dates are held in German, unless explicitly stated otherwise.
In-house seminars can be conducted in the desired language.
All materials and exercises are fully available in English.
Yes. We offer our Hands On: Security in Angular Applications seminars both remotely and on-site. Thanks to our virtual classroom, you can conveniently participate in our workshops from anywhere. Our online presentations are regularly updated, and you have permanent access after the training. Exercises can be accessed and unlocked through an online interface, and we have added additional tasks to prepare you for remote workshops.
We also offer in-house seminars and public trainings on-site. In our schedule overview, you can see the respective venue of the trainings. For in-house trainings, we are happy to discuss the venue details individually with you.
For public Hands On: Security in Angular Applications seminars, we use the online meeting tool Zoom alongside our classroom.
A test link is also included in the preparation to let you try out the technology. The remote workshop is designed so that everyone works from different locations with their own computer.
For in-house seminars, we can conduct the meeting via Zoom or Microsoft Teams.
Other meeting software may be used by arrangement.
For our in-house seminars, we additionally offer code mentoring.
What is code mentoring?
- Ask-Me-Anything sessions: Clarify questions and uncertainties from the course directly with an expert.
- Code review: Submit your own code snippets and have them analyzed and evaluated by experts.
- Advanced topics: Ask in-depth questions about the course topic to expand your knowledge.
For participants of public trainings, we recommend joining our community Discord server.
Your benefits on Discord:
- Diverse channels for questions and discussions – beyond the course topic.
- An engaged community that supports you in learning.
Yes. You can enter your routing ID directly in our order form. Our invoices are sent as ZUGFeRD PDFs right after booking.
If you have provided a routing ID, our team will be notified and we will handle the upload to the portal. If we need additional information, we will contact you after booking.
Just send us an email. If you prefer a more personal contact, Britta is also happy to receive a call from you!