nuxt-kinde-social-card

Nuxt Kinde

Kinde integration for Nuxt.

✨ Release Notes

Quick Setup

Add @nuxtjs/kinde dependency to your project

# Using pnpmpnpm add -D @nuxtjs/kinde# Using yarnyarn add --dev @nuxtjs/kinde# Using npmnpm install --save-dev @nuxtjs/kinde

Add @nuxtjs/kinde to the modules section of nuxt.config.ts

export default defineNuxtConfig({  modules: ['@nuxtjs/kinde'],  kinde: {    // This is true by default and adds 'auth-logged-in' and 'auth-logged-out'    // middleware to your Nuxt application.    //     // middleware: false,    //   }})

Add the following configuration to your .env file replacing the values in < > with your Kinde credentials.

NUXT_KINDE_AUTH_DOMAIN="https://<your_kinde_subdomain>.kinde.com"NUXT_KINDE_CLIENT_ID="<your_kinde_client_id>"NUXT_KINDE_CLIENT_SECRET="<your_kinde_client_secret>"NUXT_KINDE_REDIRECT_URL="http://localhost:3000/api/callback"NUXT_KINDE_LOGOUT_REDIRECT_URL="http://localhost:3000"NUXT_KINDE_POST_LOGIN_REDIRECT_URL="http://localhost:3000/dashboard"

You can alternatively set any of these values in your nuxt.config file:

export default defineNuxtConfig({  kinde: {    authDomain: 'https://<your_kinde_subdomain>.kinde.com',    clientId: '<your_kinde_client_id>',    // You probably don't want to set any of the following directly in your config    // as they either shouldn't be committed to version control, or are dependent    // on your environment.    //     // clientSecret: '<your_kinde_client_secret>',    // redirectURL: 'http://localhost:3000/api/callback',    // logoutRedirectURL: 'http://localhost:3000',    // postLoginRedirectURL: 'http://localhost:3000/dashboard',  }})

That's it! You can now use Nuxt Kinde in your Nuxt app ✨

Development

# Install dependenciesnpm install# Generate type stubsnpm run dev:prepare# Develop with the playgroundnpm run dev# Build the playgroundnpm run dev:build# Run ESLintnpm run lint# Run Vitestnpm run testnpm run test:watch# Release new versionnpm run release