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 Nuxt.js code

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

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

  const router = useRouter();

  onMounted(() => {
    if (Corbado.isAuthenticated) {
      router.push("/profile");
    }
    const authElement = document.getElementById("corbado-auth");
    Corbado.mountAuthUI(authElement, {
      onLoggedIn: () => {
        router.push("/profile");
      },
      isDevMode: true,
    });
  });
</script>

If you need access to user data on the server, also take a look at our Corbado Node.js SDK.

3. Read the blog post

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

Corbado Logo