nuxt-tables

Community

Reusable table patterns for Nuxt apps

Authoromakei
Version1.0.0
Installs0

System Documentation

What problem does it solve?

Creating consistent, scalable data tables in Nuxt apps often leads to duplicated code and inconsistent column definitions. This skill provides a column-builder pattern and a reusable DataTable surface to streamline table creation across pages and components.

Core Features & Use Cases

  • Column Builder Pattern: centralizes column definitions and reuses them across tables.
  • DataTable Usage: a generic, configurable table component powered by TanStack Vue Table that handles sorting, actions, and row interactions.
  • Row Actions & Navigation: define per-row actions such as view/edit/delete, with optional navigation or function handlers.
  • Using Column Builder: compose and customize table columns for different views without rewriting configuration.
  • Complex Cell Renderers & Conditional Rendering: supports custom cell renderers and conditional content.

Quick Start

Define your data model, create a column builder using the provided postsColumnBuilder, and render it with the DataTable component.

Dependency Matrix

Required Modules

None required

Components

references

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: nuxt-tables
Download link: https://github.com/omakei/adonisjs-architecture-skill/archive/main.zip#nuxt-tables

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.