Svelte Passkey Example App

This is a sample implementation of the Corbado UI component and Node SDK being integrated into a web application built with Sveltekit.

Please see the full blog post to understand the detailed steps needed to integrate passkeys into Svelte apps.

File structure

• src/routes/+page.svelte: component for the sign up / login screen
• src/routes/profile/+page.server.ts: Used to load user information on the server side
• src/routes/profile/+page.svelte: component for the user profile information that is shown after successful authentication
• src/routes/+layout.server.ts: file to switch SSR off (we're working on SSR support already)
• .env: add Corbado project ID and project secret as environment variables that you can obtain from the Corbado developer panel

Setup

Prerequisites

Please follow the steps in Getting started to create and configure a project in the Corbado developer panel.

You need to have Node and npm installed to run it.

Usage

Run

npm i

to install all dependencies.

Finally, you can run the project locally with

npm run dev