Web Authentication APIs

Maximiliano Firtman

Maximiliano Firtman

Independent Consultant
5 hours, 4 minutes CC
Web Authentication APIs

Course Description

Improve login for your web apps! Tour the many authentication options available in modern web browsers. Go from basic password forms to federated logins with Google. Then, use the latest WebAuthn API and Passkeys, enabling the use of FaceID and other biometrics to remove passwords from web apps altogether!

This course and others like it are available as part of our Frontend Masters video subscription.


Course Details

Published: February 15, 2023

Learn Straight from the Experts Who Shape the Modern Web

Your Path to Senior Developer and Beyond
  • 200+ In-depth courses
  • 18 Learning Paths
  • Industry Leading Experts
  • Live Interactive Workshops
Get Unlimited Access Now

Table of Contents


Section Duration: 17 minutes
  • Introduction
    Maximiliano Firtman begins the course by sharing his extensive experience building progressive web applications and working with authentication systems. The course website contains links to the slides, instructions for downloading and installing the course repository, and notes for each topic covered throughout the course.
  • Authentication Concepts
    Max explains authentication, or authn verifies a user's or service's identity. Some authentication techniques include passing credentials, two-factor or multi-factor authentication, JSON web tokens, one-time passwords, and public key cryptography.
  • Implementation Overview
    Max highlights three authentication implementation options: Custom Authentication, Identity Providers, and Identity as a Service (IDaaS).

Web Authentication Strategies

Section Duration: 28 minutes

Classic Login Flow

Section Duration: 1 hour, 16 minutes

Credential Management

Section Duration: 24 minutes
  • Credential Management API
    Max introduces the Credential Management API, which can leverage to add auto-login capabilities to the application. Credentials can be saved and retrieved directly from the browser's password manager. This can also apply to federated credentials like "Sign in with Google".
  • Saving Credentials
    Max uses the Credential Management API to store the email and password in the browser's password manager. This will make auto-login possible since once the credentials are saved, they can be requested automatically. The preventSilentAccess method is used when users explicitly log out to ensure they aren't automatically logged back in.
  • Retrieving Credentials
    Max uses the Credential Management API to retrieve user credentials stored in the browser's password manager. If the API is not available or if the password manager is disabled, an exception will be thrown and can be handled using try/catch.

Federated Login

Section Duration: 50 minutes


Section Duration: 1 hour, 45 minutes

Wrapping Up

Section Duration: 1 minute

Learn Straight from the Experts Who Shape the Modern Web

  • In-depth Courses
  • Industry Leading Experts
  • Learning Paths
  • Live Interactive Workshops
Get Unlimited Access Now