gitwtfhub

wtf is content?

nuxt/content — explained in plain English

Analysis updated 2026-05-18

3,637TypeScriptAudience · developerComplexity · 2/5LicenseSetup · easy

TL;DR

A Nuxt module that turns Markdown, YAML, CSV, or JSON files in your project into a queryable content layer for your website, no database needed.

Mindmap

mindmap
  root((repo))
    What it does
      File based CMS
      MDC markdown
    Tech stack
      Nuxt
      Vue
      TypeScript
      SQLite
    Use cases
      Blogs and docs
      Marketing sites
    Audience
      Developers
      Content writers

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

Why would anyone build with this?

REASON 1

Build a blog or documentation site where writers edit Markdown files directly.

REASON 2

Add interactive Vue components inside Markdown content using MDC syntax.

REASON 3

Query and filter site content with a structured query builder instead of a database.

What's in the stack?

NuxtVueTypeScriptSQLite

How it stacks up

nuxt/contentcsfrequency/react-firebase-hooksjameskerr/react-arborist
Stars3,6373,6373,636
LanguageTypeScriptTypeScriptTypeScript
Setup difficultyeasyeasyeasy
Complexity2/52/52/5
Audiencedeveloperdeveloperdeveloper

Figures from each repo's GitHub metadata at analysis time.

How do you spin it up?

Difficulty · easy Time to first run · 30min

Requires an existing Nuxt 3 project.

Free to use, modify, and distribute, even commercially, as long as you include the original copyright and license notice.

Wtf does this do

Nuxt Content is a module for Nuxt, a framework for building websites with Vue. It lets you store your website's text and data as plain files in a folder called content, rather than in a database. Those files can be Markdown, YAML, CSV, or JSON. When your site builds or a visitor loads a page, the module reads those files and makes their contents available to your page templates. The main appeal is that non-technical writers can edit content by editing text files, and developers can use the same files in their code without setting up a separate content management system. Nuxt Content acts as the layer between the two. It builds an internal SQLite database from your content files and gives developers a query builder to search, filter, and retrieve content in a structured way. Markdown files get some extra capabilities through a syntax called MDC. This lets you drop Vue components directly into the middle of a Markdown document, so a content author can add interactive elements like cards, tabs, or video embeds just by writing a short tag in their text file. Other features include automatic code syntax highlighting powered by Shiki, navigation tree generation from your content structure, and support for serverless and edge deployment environments like Cloudflare Workers. Development includes fast hot reloading so changes to content files appear instantly in the browser. The module is open source under the MIT license and is maintained by the Nuxt team.

Yoink these prompts

Prompt 1
Help me set up Nuxt Content in an existing Nuxt 3 project.
Prompt 2
Show me how to embed a Vue component inside a Markdown file using MDC syntax.
Prompt 3
Explain how to write a query to fetch and filter my content collection.

Frequently asked questions

wtf is content?

A Nuxt module that turns Markdown, YAML, CSV, or JSON files in your project into a queryable content layer for your website, no database needed.

What language is content written in?

Mainly TypeScript. The stack also includes Nuxt, Vue, TypeScript.

What license does content use?

Free to use, modify, and distribute, even commercially, as long as you include the original copyright and license notice.

How hard is content to set up?

Setup difficulty is rated easy, with roughly 30min to a first successful run.

Who is content for?

Mainly developer.

View the repo → Decode another repo

This repo across BitVibe Labs

Don't trust strangers blindly. Verify against the repo.