Example Passkeys Sveltekit

Overview

This article provides a sample implementation of the Corbado web component within a web page built with SvelteKit. The purpose is to demonstrate passkey authentication. The live demo can be accessed on passkeys.eu and passkeys.fr. The article also explains the file structure, prerequisites, and installation steps.

Features

• Passkey authentication: The implementation showcases passkey authentication using the Corbado web component.
• SvelteKit integration: The web component is integrated into a web page built with SvelteKit, providing a seamless user experience.
• Reusable files: The src/lib folder contains reusable files such as assets, components, and sections that are used throughout the application.
• Page routing: The routes folder contains the pages for the application, allowing for easy navigation.
• Server-side API routes: The routes/api folder contains the server-side API routes for the application, enabling communication with the backend.

Installation

To install and run the project, follow these steps:

1. Make sure you have Node.js and pnpm installed.
2. Run the following command to install pnpm: pnpm install.
3. Create an .env file in the root folder of the project.
4. Configure the necessary environment variables using the values obtained from the prerequisites.
5. Run the project locally using the command: npm run dev. This will start the SvelteKit app on localhost:5173 by default.

Summary

This article demonstrates the integration of the Corbado web component into a SvelteKit project for showcasing passkey authentication. It provides a step-by-step guide on installing and running the project, along with an explanation of the file structure and key features. By following the provided instructions, developers can easily implement passkey authentication in their SvelteKit projects.