Product Analysis: Cacao Kit Frontend

Overview

Cacao Kit Frontend is a feature-rich Nuxt 3 starter kit that fetches content from the Cacao Kit backend, a headless Kirby CMS instance. It offers a block-first approach, where Kirby’s page structure can be used as the source of truth for rendering pages. It also provides internationalization support and integrates with Kirby Query Language (KQL). The starter kit allows for server-side rendering or pre-rendering of content using Nuxt’s static generation.

Features

• Internationalization with @leanera/nuxt-i18n
• Block-first approach: Kirby blocks define what to render for each page
• Catch-all route: All pages are rendered by the catch-all route by default, but Nuxt pages can also be created
• Source of truth: Utilizes Kirby’s page structure as the source of truth for rendering
• Kirby Query Language (KQL): Allows querying the content using KQL
• Global site data: Similar to Kirby’s $site
• SSR generated SEO data: Generates SEO data for server-side rendered pages
• Prettier & ESLint: Pre-configured code formatting and linting
• Pre-configured VSCode settings: Convenient settings for Visual Studio Code

Installation

To install Cacao Kit Frontend, follow these steps:

1. Enable Corepack using corepack enable.
2. Install dependencies using pnpm install.
3. Adapt the relevant environment variables.
4. Start the development server using pnpm run dev.
5. Visit localhost:3000 to view the application.

Summary

Cacao Kit Frontend is a feature-rich Nuxt 3 starter kit that integrates with the Cacao Kit backend. It offers a block-first approach for rendering pages and supports internationalization. With its use of Kirby Query Language (KQL) and global site data, it provides a flexible and efficient solution for building a Nuxt-based frontend on top of Kirby CMS. Its pre-configured settings and code formatting make development easier and more streamlined.