More Premium Hugo Themes Premium Nuxt Themes

Kirby Nuxt Starterkit

Kirby's sample site – ported to Nuxt and Kirby Query Language

Kirby Nuxt Starterkit

Kirby's sample site – ported to Nuxt and Kirby Query Language

Github Stars Github Stars: 57
Last Commit Last Commit: Apr 21, 2025 -
First Commit Created: Dec 18, 2023 -
default image

Overview:

The Kirby Nuxt Starter Kit is a port of the Kirby Starter Kit to Nuxt 3. It allows users to fetch content using the nuxt-kql module from Kirby Headless Starter, which is a headless instance of the Kirby CMS. The kit provides several key features such as Kirby Query Language integration, component-based Kirby Blocks, global site data similar to Kirby’s $site, pre-defined query collections, SSR generated SEO metadata, and pre-configured VSCode settings.

Features:

  • Kirby Query Language with nuxt-kql: Allows users to fetch content using the Kirby Query Language integrated with the nuxt-kql module.
  • Component-based Kirby Blocks: Enables the creation of reusable blocks using components.
  • Global site data similar to Kirby’s $site: Provides global site data that is similar to Kirby’s $site variable.
  • Collections for pre-defined queries: Allows users to create collections for pre-defined queries.
  • SSR generated SEO metadata: Generates SEO metadata during server-side rendering.
  • Prettier & ESLint: Includes pre-configured Prettier and ESLint settings.
  • Pre-configured VSCode settings: Provides pre-configured VSCode settings for easy development.
  • And much more!: Offers several other features to enhance development with the Kirby Nuxt Starter Kit.

Installation:

To install and use the Kirby Nuxt Starter Kit, follow these steps:

  1. Enable Corepack using the command corepack enable.
  2. Install dependencies using pnpm install.
  3. Adapt the relevant environment variables for your project.
  4. For development, start the development server using pnpm run dev and visit localhost:3000.
  5. For production, build the application using pnpm run build. Refer to the deployment documentation for further instructions.

Summary:

The Kirby Nuxt Starter Kit is a powerful tool that allows developers to combine the flexibility of the Kirby CMS with the benefits of Nuxt 3. With its integration of the Kirby Query Language, component-based Kirby Blocks, and pre-defined query collections, it provides a seamless experience for fetching content. Additionally, the kit offers features like SSR generated SEO metadata, pre-configured VSCode settings, and Prettier & ESLint for enhanced development. Overall, the Kirby Nuxt Starter Kit is a valuable resource for building websites or applications with the Kirby CMS and Nuxt 3.