Back to Skills

content-hub

majiayu000
Updated 2 days ago
14 views
58
9
58
View on GitHub
Metadesign

About

Content Hub is a browser-based asset gallery for managing marketing assets with visual grid browsing, filtering/search, and brand context sidebar. It provides asset preview/edit actions and generation capabilities while maintaining R2-ready manifests for future cloud sync. Use this skill when browsing assets, managing content libraries, or generating new assets with brand context.

Quick Install

Claude Code

Recommended
Plugin CommandRecommended
/plugin add https://github.com/majiayu000/claude-skill-registry
Git CloneAlternative
git clone https://github.com/majiayu000/claude-skill-registry.git ~/.claude/skills/content-hub

Copy and paste this command in Claude Code to install this skill

Documentation

Content Hub

Visual asset gallery for ClaudeKit Marketing.

Quick Start

# Open gallery
node .claude/skills/content-hub/scripts/server.cjs --open

# Rescan assets
node .claude/skills/content-hub/scripts/server.cjs --scan

# Stop server
node .claude/skills/content-hub/scripts/server.cjs --stop

Or use command: /write:hub

Features

  • Gallery Grid: Thumbnails of assets/ folder
  • Filter/Search: By type (banners, designs, etc.) and keywords
  • Brand Sidebar: Displays user's colors and voice from docs/brand-guidelines.md
  • Actions: Preview, Edit in Claude, Copy path, Generate new
  • R2 Ready: Manifest schema supports Cloudflare R2 sync (UI disabled)

API Routes

RoutePurpose
/hubGallery HTML
/api/assetsAsset list JSON
/api/brandBrand context JSON
/api/scanTrigger rescan
/file/*Serve local files

Manifest Schema

Assets stored in .assets/manifest.json with R2 fields:

{
  "id": "abc123",
  "path": "banners/hero.png",
  "category": "banner",
  "r2": {
    "status": "local",  // local|pending|synced|error
    "bucket": null,
    "url": null
  }
}

Scripts

ScriptPurpose
scripts/server.cjsHTTP server entry
scripts/lib/scanner.cjsScan assets directory
scripts/lib/router.cjsHTTP routing
scripts/lib/brand-context.cjsExtract brand guidelines

Integration

Command: /write:hub

Related Skills: brand-guidelines, ai-multimodal, design

Agents: content-creator, ui-ux-designer

GitHub Repository

majiayu000/claude-skill-registry
Path: skills/content-hub

Related Skills

content-collections

Meta

This skill provides a production-tested setup for Content Collections, a TypeScript-first tool that transforms Markdown/MDX files into type-safe data collections with Zod validation. Use it when building blogs, documentation sites, or content-heavy Vite + React applications to ensure type safety and automatic content validation. It covers everything from Vite plugin configuration and MDX compilation to deployment optimization and schema validation.

View skill

creating-opencode-plugins

Meta

This skill provides the structure and API specifications for creating OpenCode plugins that hook into 25+ event types like commands, files, and LSP operations. It offers implementation patterns for JavaScript/TypeScript modules that intercept and extend the AI assistant's lifecycle. Use it when you need to build event-driven plugins for monitoring, custom handling, or extending OpenCode's capabilities.

View skill

langchain

Meta

LangChain is a framework for building LLM applications using agents, chains, and RAG pipelines. It supports multiple LLM providers, offers 500+ integrations, and includes features like tool calling and memory management. Use it for rapid prototyping and deploying production systems like chatbots, autonomous agents, and question-answering services.

View skill

cloudflare-turnstile

Meta

This skill provides comprehensive guidance for implementing Cloudflare Turnstile as a CAPTCHA-alternative bot protection system. It covers integration for forms, login pages, API endpoints, and frameworks like React/Next.js/Hono, while handling invisible challenges that maintain user experience. Use it when migrating from reCAPTCHA, debugging error codes, or implementing token validation and E2E tests.

View skill