본문으로 건너뛰기
cccskills
무료GitHub에 공개

my-ccv

Manage Claude Code Viewer (CCV): preview in-progress CCV changes on ccv-preview, register HTML artifacts, download files, or schedule jobs via CCV local API. Use when user asks for CCV preview, ccv-preview, browser visual QA, UI/UX validation, CCV artifacts, CCV file download, or CCV scheduler jobs. Treat preview/プレビュー as the CCV app preview service first; use artifacts only when the user explicitly asks for artifact/dashboard/report HTML. Do NOT use for generic web app previews outside CCV, production deployment, Cloudflare config, or Anthropic remote triggers.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

Ynakatsuka/dotfiles
연동 도구Cloudflare
설치 방법 보기

포함된 파일(4)

  • SKILL.md5.4 KB
  • references/download.md2.6 KB
  • references/preview.md7.1 KB
  • references/schedule.md4.1 KB

SKILL.md(원문)

설치하기 전에 에이전트에게 전달되는 지시 내용을 확인할 수 있습니다.

CCV — Claude Code Viewer Management

CCV (Claude Code Viewer) の preview 環境、アーティファクト登録、ファイルダウンロード、リモートエージェントのスケジュール管理を行う統合スキル。

CCV Server

全ワークフロー共通。API を呼ぶ前に base URL を一度だけ定義する（ポートは CCV_PORT 環境変数で上書き可、デフォルト 3434）:

BASE_URL="http://localhost:${CCV_PORT:-3434}"

Argument Routing

Route based on $ARGUMENTS:

  1. preview ..., ccv-preview ..., プレビュー ..., ブラウザ確認 ..., visual/UX QA for CCV: → Read references/preview.md and follow the CCV App Preview workflow
  2. schedule ...: → Read references/schedule.md and follow the Schedule workflow
  3. download ... or dl ...: → Read references/download.md and follow the File Download workflow
  4. artifact ... or explicit dashboard/report/HTML artifact creation: → Artifact workflow (below)
  5. no argument or other: → Artifact workflow (below)

Preview First Rule

  • 「preview」「プレビュー」だけなら、まず CCV app preview service (ccv-preview) と解釈する
  • HTML artifact preview と解釈するのは、ユーザーが artifact、dashboard、report、HTML、アーティファクト登録 を明示した場合だけ
  • CCV 以外の一般的な Web アプリ preview には使わない

Artifact Workflow

CCV ローカル API を使って HTML アーティファクトを作成・登録する。

Step 1: Identify the project

curl -s "${BASE_URL}/api/projects" | jq .
  • meta.projectPath で現在のプロジェクトディレクトリと照合し、対象の id を特定する
  • 現在の作業ディレクトリ (pwd) と一致するプロジェクトを自動選択する
  • 一致しない場合はユーザーに確認する

Step 2: Generate HTML content

ユーザーの要求に応じて HTML を生成する。典型的な用途:

  • 定性評価ダッシュボード: データの可視化、比較表
  • レポート: 分析結果のまとめ
  • HTML モックアップ: UI の静的確認用 HTML

HTML の要件:

  • 単一ファイルで完結する（外部リソースへの依存なし）
  • インラインCSS/JSを使用する
  • <html>, <head>, <body> タグを含む完全なHTML文書にする
  • 日本語コンテンツの場合は <meta charset="utf-8"> を含める

Step 3: Register the artifact

リクエストボディ:

{
  "name": "DISPLAY_NAME",
  "fileName": "FILENAME.html",
  "html": "FULL_HTML_STRING"
}
  • name: ユーザーに表示される名前（日本語可）
  • fileName: 保存時のファイル名（英数字・ハイフン推奨、.html 拡張子必須）
  • html: 完全な HTML 文字列

HTML が大きい場合は必ず一時ファイル経由で送信する。JSON の構築には jq を使い、エスケープ漏れを防ぐ。一時ファイル名は $$-$RANDOM で衝突を避ける:

CCV_JSON="/tmp/ccv-artifact-$$-$RANDOM.json"
jq -n --arg name "$NAME" --arg fileName "$FILENAME" --arg html "$(cat /tmp/artifact.html)" \
  '{name: $name, fileName: $fileName, html: $html}' > "$CCV_JSON"
curl -s -X POST "${BASE_URL}/api/projects/{projectId}/artifacts" \
  -H 'Content-Type: application/json' -d @"$CCV_JSON"
rm -f "$CCV_JSON"

Step 4: Confirm and report

登録成功後、以下を報告する:

  1. アーティファクト ID（レスポンスの id）
  2. HTML 表示 URL: ${BASE_URL}/api/projects/{projectId}/artifacts/{artifactId}/html
  3. 登録内容の概要

Artifact API Reference

MethodPathDescription
GET/api/projectsプロジェクト一覧
GET/api/projects/:projectId/artifactsアーティファクト一覧
POST/api/projects/:projectId/artifacts新規作成
PUT/api/projects/:projectId/artifacts/:artifactId更新（name, fileName, html すべて省略可）
DELETE/api/projects/:projectId/artifacts/:artifactId削除
GET/api/projects/:projectId/artifacts/:artifactId/htmlHTML 本体取得

Artifact Error Handling

  • CCV サーバーが起動していない場合: curl: (7) Failed to connect → ユーザーに CCV サーバーの起動を案内する
  • プロジェクトが見つからない場合: 一覧を表示してユーザーに選択を求める

Artifact Notes

  • 既存アーティファクトの更新は PUT を使い、変更したいフィールドのみ送信する
  • list サブコマンド的に使われた場合は GET で一覧を返す
  • レスポンスの id は ULID 形式で自動生成される

리뷰

아직 리뷰가 없습니다. 사용해 본 소감을 남겨 주세요.

댓글

로그인 없이 쓸 수 있습니다. 사용 후기, 질문, 작동하지 않은 환경 등을 편하게 남겨 주세요.

아직 댓글이 없습니다. 첫 댓글을 남겨 보세요.

보내면 바로 공개됩니다. 이메일 주소나 전화번호 같은 개인 정보는 쓰지 마세요. URL은 2개까지입니다.

0 / 1,000자

이 양식은 reCAPTCHA로 보호되며 Google 개인정보처리방침 및 서비스 약관이 적용됩니다.

같은 저장소의 스킬

my-agent

무료

Delegate tasks to an external CLI agent (OpenAI Codex, Google Gemini, or Claude Code) for second opinions or parallel execution. Use when the user explicitly mentions "codex", "gemini", or "claude" or asks to delegate work to one of them (e.g., "codexで実行", "codexに聞いて", "geminiで実行", "Geminiに聞いて", "claudeで実行", "Claudeに聞いて", "run with codex", "ask gemini", "ask claude"). Also use when the user mentions Claude's "fable" model alias for delegation or consultation (e.g., "fableで実行", "fableに相談", "Fableに聞いて", "ask fable"). Do NOT use for general coding tasks that don't mention codex, gemini, claude, or fable.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

Ynakatsuka/dotfiles42026년 10월 20일 업데이트

my-bulk-read

무료

Delegate reading large or multiple files to the `bulk-read` command, which sends the files to a cheaper reader model and returns only its answer. Use when a question needs the content of a file over about 350 lines or of several files at once, when a PreToolUse guard denied an unbounded read, or when the user says "bulk read", "一括読み込み", or "まとめて読んで". Do NOT use for files you are about to edit, for subtle correctness reasoning such as concurrency bugs, or for short files that fit a bounded read.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

Ynakatsuka/dotfiles42026년 10월 20일 업데이트

my-code-write

무료

Delegate writing predictable code to the `code-write` command, which has a cheaper writer model write the target file directly so the generated code never enters your context. Use for tests, scaffolding, fixtures, boilerplate, or a new file that copies an existing pattern, and when the user says "code write", "生成を委譲", or "雛形を書かせて". Do NOT use for design decisions, changes to public contracts or shared modules, edits inside an existing file that needs judgment, or logic with subtle correctness requirements.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

Ynakatsuka/dotfiles42026년 10월 20일 업데이트

my-diagnose

무료

Disciplined diagnosis workflow for hard, intermittent, or multi-component bugs and performance regressions: inspect logs and existing evidence, build a feedback loop, test falsifiable hypotheses, instrument gaps, and verify the outcome. Use when the root cause is unclear, reproduction is unreliable, several causes or components are plausible, or performance has regressed. Do NOT use for obvious single-cause errors, straightforward configuration or syntax fixes, planned feature work, or broad architecture review. Diagnosis-only requests stop after reporting the root cause and evidence; apply a fix only when the user requested one.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

Ynakatsuka/dotfiles42026년 10월 20일 업데이트

my-epic

무료

Manual-only orchestrator for medium-to-large software development. Turns a broad goal into PR-sized and operational nodes with verification gates, then coordinates approved execution across follow-up prompts. Activate only when the user explicitly invokes my-epic; once activated, keep orchestrating that epic for the rest of the session. Do NOT use for an uninvoked planning or implementation request, a single small bug fix, one obvious PR, pure code review, ordinary SDD work that fits in one spec/PR, or implementing an epic during the same first call that created it.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

Ynakatsuka/dotfiles42026년 10월 20일 업데이트

my-handoff

무료

Hand off a task with only the context needed to continue in a fresh session. Use for "handoff", "引き継ぎ", "別セッションへ渡す", or "別マシンで続ける". The orca subcommand launches an independent Orca workspace or terminal tab; without it, produce a paste-ready prompt backed by a verified remote branch or PR. Do not launch sessions for capability questions or design requests.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

Ynakatsuka/dotfiles42026년 10월 20일 업데이트

Ynakatsuka의 스킬 모두 보기

이 스킬의 문제 신고