Passkey quickstart guide

Passlock abstracts much of the complexity associated with passkeys. You should be able to add passkey authentication to your web app in less than 30 minutes.

Prerequisites

Passlock is framework agnostic. For this guide we won’t assume any particular framework. We’ll focus on the Passlock libraries. We assume you understand your chosen framework.

Most modern browsers now suport passkeys, so support should not be an issue. The underlying WebAuthn APIs require client side Javascript, so if you need to support browsers that have Javascript disabled you’ll need to fallback to another mechanism.

We assume your frontend uses a bundler with tree shaking support (Vite, Webpack etc.)

Your backend can be coded in pretty much any language and framework. We offer a framework agnostic JS/TS server library, which is what we’ll use in this guide. If you’re not using a JS backend, dont worry - we’ll also show you how to verify passkeys using REST calls.

Installation

The only library you need to use is the Passlock client library. Install this in your frontend project.

npm

npm i @passlock/client

pnpm

pnpm add @passlock/client

yarn

yarn add @passlock/client

If you’re running a JS/TS backend we recommend installing the server library:

npm

npm i @passlock/node

pnpm

pnpm add @passlock/node

yarn

yarn add @passlock/node

Setup

Create a free Passlock cloud account, then head over to the development tenancy settings:

Take a note of the Tenancy ID and API Key. You’ll need the Tenancy ID in your frontend and backend, the API Key is only required for the backend.

Note

Passlock offers multiple, isolated environments, which we refer to as tenancies. We’re using the development tenancy here