👨‍🏫 The Mastering Nuxt 3 course is now completed!

Discover the course
kql

Nuxt 3 module for Kirby's Query Language API

nuxt-kql

nuxt-kql

npm version

Nuxt 3 module for Kirby's Query Language API.

Features

  • 🔒 Protect your Kirby credentials when sending queries
  • 🪢 Supports token-based authentication with Kirby Headless Starter (recommended)
  • 🤹 No CORS issues!
  • 🍱 Handle request just like with the useFetch composable
  • 🗃 Cached query responses
  • 🦾 Strongly typed

Setup

📖 Read the documentation

# pnpm
pnpm add -D nuxt-kql
# npm
npm i -D nuxt-kql

Basic Usage

📖 Read the documentation

Add nuxt-kql to your Nuxt config:

// `nuxt.config.ts`
export default defineNuxtConfig({
modules: ['nuxt-kql']
})

And send queries in your template:

<script setup lang="ts">
const { data, pending, refresh, error } = await useKql({
query: 'site',
})
</script>
<template>
<div>
<h1>{{ data?.result?.title }}</h1>
<pre>{{ JSON.stringify(data?.result, undefined, 2) }}</pre>
</div>
</template>

💻 Development

  1. Clone this repository
  2. Enable Corepack using corepack enable
  3. Install dependencies using pnpm install
  4. Run pnpm run dev:prepare
  5. Start development server using pnpm run dev

License

MIT License © 2022-2023 Johann Schopplich