In this workshop, you discover best practices for building secure frontend applications. We investigate how to use and configure security mechanisms available in modern browsers. We explore what security measures are built into Angular and React, along with common mistakes that circumvent these protections. Additionally, we discuss scenarios that address frequent questions, including secure data storage in the browser and the use of OAuth 2.0 and OpenID Connect.

This course offers practical and immediately applicable security advice for architects and developers. Throughout the course, Philippe is available to answer any questions, including concrete scenarios applying to your own applications.
Concretely, we will cover the following topics:

• The security model of the web
• Configuring modern security headers
• XSS in modern frontend applications
• CSP as a defense against XSS
• CSP deployment strategies for SPAs
• Countering advanced XSS with Trusted Types
• Using OAuth 2.0 and OpenID Connect in SPAs
• Securing OAuth 2.0 tokens in JS frontends

This workshop consists of a mixture of lectures, demos, interactive quizzes, and hands-on labs. The lectures provide in-depth knowledge of attacks and defenses. The hands-on labs are conducted in a custom-built competitive training environment, allowing participants to gain hands-on experience with offensive and defensive technologies.

Who should attend?

This security training specifically targets modern web developers. Anyone involved in building single-page applications (e.g., Angular, React) or managing development teams should be here. This training course is not just any training course. It is packed with in-depth and up-to-date content. We do not merely brush over a threat and defense but focus on the underlying cause and consequences. Why do we have this problem? Which mitigations are often used? Why are some ineffective? Which one is the current best practice? These are the questions that will be answered throughout the training.

Prerequisites

To participate in this training, you should have development experience with single-page applications and the underlying APIs. Familiarity with the basics of security (e.g., simple XSS attacks) is helpful, but not required. The training will talk about Angular and React specifically, but also applies to other frameworks, such as EmberJS or Vue.js.

Computer Setup

To participate in the lab sessions, participants need an internet-accessible laptop with a modern browser installed (E.g., Chrome, Firefox).