​
1. Prerequisites

First, you need to set up a Corbado project.

To get started with the integration, install the Corbado web-js package.

npm install @corbado/web-js

Further information on web-js can be found here

​
2. Add web-js to Vue.js code

App.vue
<template>
    <div id="corbado-auth"></div>
</template>

<script setup>
    import Corbado from "@corbado/web-js";
    import { onMounted } from "vue";

    onMounted(async () => {
        await Corbado.load({
            projectId: "your-project-id"
        });

        const authElement = document.getElementById("corbado-auth"); //Element where you want to render CorbadoAuth UI

        Corbado.mountAuthUI(authElement, {
            onLoggedIn: () => {
                //post login actions can be performed here.
                //router.push("/profile");
            }
        });
    });
</script>

​
3. Read the blog post

To find a step-by-step tutorial on how to integrate passkeys into Vue.js, please check out our blog post:

Corbado Logo
FlutterAngular