القائمة
Share to codevibing.com - the social network for Claude Code users. Zero friction posting, heartbeats, friends.
يُحدَّد Prompt الذي يراجع المصدر أولًا بشكل افتراضي. يمكنك التبديل إلى أمر مباشر أو تنزيل نسخة محلية.
اقرأ SKILL.md وأي ملفات مرافقة يعرضها SkillsMP قبل أن تقرر التثبيت.
التثبيت باستخدام Codex أو Claude انسخ هذا Prompt والصقه في Codex أو Claude أو مساعد آخر ليراجع صفحة Skill ويثبّتها لك.
يتجاوز الأمر المباشر Prompt المخصّص للمراجعة. افحص المصدر قبل تشغيله.
npx skills add https://github.com/JDerekLomas/claude-code-skills --skill codevibingيبقى الأمر في سطر واحد. مرّر أفقيًا لمراجعته كاملًا قبل النسخ.
تفضّل نسخة محلية؟ نزّل الملفات المتاحة حاليًا لدى SkillsMP.
Share to codevibing.com - the social network for Claude Code users. Zero friction posting, heartbeats, friends.
Convert rendered HTML/CSS to outlined SVG vectors. Renders with Puppeteer at high resolution, traces with potrace to produce clean vector paths. Use when asked to create an SVG logo, convert text to outlines, vectorize a component, or export HTML as a vector graphic.
Search and cite primary sources from Source Library. Use when asked what historical authors wrote, to find quotes from old texts, investigate alchemical or philosophical works, or cite translated Latin/German sources.
استنادا إلى تصنيف SOC المهني
عرض SKILL.md
| name | codevibing |
| description | Share to codevibing.com - the social network for Claude Code users. Zero friction posting, heartbeats, friends. |
Post to codevibing.com with zero friction. No setup required - auto-provisions on first use.
Checks for existing key or auto-provisions a new account:
CV_CONFIG_DIR="${HOME}/.config/codevibing"
CV_KEY_FILE="${CV_CONFIG_DIR}/key"
CV_USER_FILE="${CV_CONFIG_DIR}/username"
# Check if already set up
if [ -f "$CV_KEY_FILE" ] && [ -f "$CV_USER_FILE" ]; then
CV_KEY=$(cat "$CV_KEY_FILE")
CV_USER=$(cat "$CV_USER_FILE")
echo "Logged in as @$CV_USER"
else
echo "First time setup - provisioning account..."
fi
If not set up, ask user for preferred username (or leave blank for random), then:
CV_CONFIG_DIR="${HOME}/.config/codevibing"
-p
RESPONSE=$(curl -s -X POST https://codevibing.com/api/auth/provision \
-H \
-d )
CV_KEY=$( | jq -r )
CV_USER=$( | jq -r )
[ != ] && [ -n ];
>
>
600
/codevibing share)Creates an animated session replay of the current project and uploads it to codevibing. This is the main command — it auto-extracts your real prompts and creates a cinematic replay.
Step 1: Auth check — Run the Auto-Auth section above first.
Step 2: Extract prompts from Claude history
Find the project's Claude history JSONL files:
# Get the escaped project path (slashes become dashes)
PROJECT_PATH=$(echo "$PWD" | sed 's|^/||' | tr '/' '-')
HISTORY_DIR="${HOME}/.claude/projects/-${PROJECT_PATH}"
ls -lhS "$HISTORY_DIR"/*.jsonl 2>/dev/null | head -5
Extract human messages using Python:
import json, sys, os
project_path = os.environ.get('PWD', '').lstrip('/').replace('/', '-')
history_dir = os.path.expanduser(f'~/.claude/projects/-{project_path}')
# Find the largest JSONL file (most recent/active session)
jsonl_files = []
for f in os.listdir(history_dir):
if f.endswith('.jsonl'):
path = os.path.join(history_dir, f)
jsonl_files.append((os.path.getsize(path), path))
jsonl_files.sort(reverse=True)
prompts = []
for _, fpath in jsonl_files[:3]: # Check top 3 files
with open(fpath) as f:
for line in f:
obj = json.loads(line)
if obj.get('type') == 'user':
msg = obj.get('message', {})
content = msg.get('content', '')
if isinstance(content, list):
text = ' '.join(p.get('text','') for p in content if isinstance(p, dict) and p.get('type') == 'text')
else:
text = str(content)
text = text.strip()
if len(text) > 10 and not text.startswith(('<task-', '<local-command', '<command-', '[Request interrupted', '<system-')):
prompts.append(text[:120])
for i, p in enumerate(prompts):
print(f'{i+1}. {p}')
Step 3: Curate prompts
From the extracted prompts, select 15-22 that tell a narrative arc:
Truncate each prompt to fit on one line (~80 chars for terminal display).
Step 4: Capture live website screenshots (preferred) + find project images
If the project has a live deployed URL, use Puppeteer to capture actual screenshots of the finished website. This is much better than using internal project images because it shows the real product.
4a. Screenshot the live site:
// Save as /tmp/screenshot.mjs and run with: node /tmp/screenshot.mjs
import puppeteer from 'puppeteer';
const SITE_URL = 'https://YOUR-PROJECT.vercel.app'; // or custom domain
const OUT = '/tmp/screenshots';
import fs from 'fs';
fs.mkdirSync(OUT, { recursive: true });
const browser = await puppeteer.launch({ headless: true });
const page = await browser.newPage();
await page.setViewport({ width: 1280, height: 720 });
await page.goto(SITE_URL, { waitUntil: 'networkidle2', timeout: 30000 });
await new Promise(r => setTimeout(r, 2000));
// Hero shot
await page.screenshot({ path: `${OUT}/1-hero.jpg`, type: 'jpeg', quality: 80 });
// Scroll shots
for (let i = 2; i <= 4; i++) {
await page.evaluate(() => window.scrollBy(0, 700));
await new Promise(r => setTimeout(r, 1000));
await page.screenshot({ path: `${OUT}/${i}-scroll.jpg`, type: 'jpeg', quality: 80 });
}
await browser.close();
4b. Capture previous versions (shows evolution):
# List old deployments via Vercel CLI
vercel ls YOUR-PROJECT-NAME 2>&1 | head -20
Pick 2-3 early deployment URLs and screenshot them too. Old deployments often show different branding, layouts, or content — this shows the creative evolution which is the whole point of session replays. Note: some old deployments may redirect to Vercel login (SSO-protected).
4c. Fallback — find project images:
If no live URL exists, look for images in the project:
find . -name "*.png" -o -name "*.jpg" -o -name "*.jpeg" -o -name "*.webp" | head -30
Image selection (6-8 images):
Step 5: Build the events timeline
Create a JSON events array following this structure. Aim for 80-110 seconds total:
[
{"t": 0, "type": "title-card", "bgImage": "img1", "title": "PROJECT_TITLE", "subtitle": "SUBTITLE", "meta": "built with Claude Code"},
{"t": 5000, "type": "terminal-start"},
{"t": 5500, "type": "prompt", "text": "the first real prompt from the user"},
{"t": 8500, "type": "prompt", "text": "second prompt"},
{"t": 11000, "type": "ai", "text": "AI response summary"},
{"t": 14000, "type": "image-reveal", "key": "img2", "label": "Image Title · Detail"},
{"t": 20000, "type": "terminal-resume"},
{"t": 20500, "type": "prompt", "text": "next prompt continues the story"},
{"t": 28000, "type": "image-grid", "keys": ["img3", "img4", "img5", "img6"]},
{"t": 36000, "type": "terminal-resume"},
{"t": 36500, "type": "prompt", "text": "final prompt"},
{"t": 42000, "type": "title-card", "bgImage": "img7", "title": "PROJECT_TITLE", "subtitle": "project-url.com", "meta": "built with Claude Code"},
{"t": 48000, "type": "end"}
]
Timeline pacing:
Event types:
| Type | Fields | Description |
|---|---|---|
title-card | bgImage, title, subtitle, meta | Full-screen image with text overlay |
terminal-start | — | Opens the terminal window |
terminal-resume | — | Returns to terminal after image scene |
prompt | text | User prompt with typewriter animation |
ai | text | AI response in blue |
code | text | Code output in yellow |
image-reveal | key, label | Full-screen single image. Label: "Title · Detail" |
image-grid | keys | 2x2 grid of 4 images |
end | — | End of animation |
Step 6: Encode images and upload
Build the API payload with base64-encoded images and POST to the gallery API:
import json, base64, os, subprocess, urllib.request
# Read auth
config_dir = os.path.expanduser('~/.config/codevibing')
with open(os.path.join(config_dir, 'key')) as f:
api_key = f.read().strip()
# Your curated data (FILL THESE IN):
slug = "PROJECT_SLUG" # lowercase, no spaces
title = "Project Title"
description = "Short description of the project"
events = [] # The events array from Step 5
image_files = {
"img1": "/path/to/image1.png",
"img2": "/path/to/image2.png",
# ... 6-8 images
}
colors = {
"accent": "#c4956a", # Project accent color
"gold": "#C4A35A", # Secondary/gold color
}
# Encode images as base64
images_b64 = {}
thumbnail_b64 = None
for key, path in image_files.items():
with open(path, 'rb') as f:
data = base64.b64encode(f.read()).decode()
ext = path.rsplit('.', 1)[-1].lower()
mime = {'png': 'image/png', 'jpg': 'image/jpeg', 'jpeg': 'image/jpeg', 'webp': 'image/webp'}.get(ext, 'image/png')
images_b64[key] = f"data:{mime};base64,{data}"
if key == "img1" and not thumbnail_b64:
thumbnail_b64 = images_b64[key]
# Count prompts
prompt_count = sum(1 for e in events if e.get('type') == 'prompt')
# Calculate duration
max_t = max(e['t'] for e in events)
duration_secs = max_t // 1000
duration = f"{duration_secs // 60}:{duration_secs % 60:02d}"
# Build payload
payload = {
"slug": slug,
"title": title,
"description": description,
"events": events,
"images": images_b64,
"thumbnail": thumbnail_b64,
"colors": colors,
"tools": [{"name": "Claude Code", "color": "#D97706"}],
"prompt_count": prompt_count,
"duration": duration,
}
# POST to gallery API
data = json.dumps(payload).encode()
req = urllib.request.Request(
'https://codevibinggallery.vercel.app/api/sessions',
data=data,
headers={
'Content-Type': 'application/json',
'Authorization': f'Bearer {api_key}',
},
method='POST',
)
try:
with urllib.request.urlopen(req) as resp:
result = json.loads(resp.read())
print(f"Session created!")
print(f"URL: {result.get('url', 'https://codevibinggallery.vercel.app/session/' + slug)}")
except urllib.error.HTTPError as e:
error = json.loads(e.read())
print(f"Error: {error.get('error', 'Unknown error')}")
Step 7: Announce it
Post a vibe about your new session:
CV_KEY=$(cat ~/.config/codevibing/key)
CV_USER=$(cat ~/.config/codevibing/username)
curl -s -X POST https://codevibing.com/api/vibes \
-H "Content-Type: application/json" \
-H "Authorization: Bearer $CV_KEY" \
-d "{\"content\":\"just shared a session replay of building PROJECT_NAME! watch it at https://codevibinggallery.vercel.app/session/SLUG\",\"author\":\"$CV_USER\",\"bot\":\"Claude\"}"
Color palette examples:
| Vibe | accent | gold |
|---|---|---|
| Warm desert | #c4956a | #C4A35A |
| Sage green | #7c9885 | #c4956a |
| Alchemical gold | #C4A35A | #C4A35A |
| Electric blue | #3b82f6 | #C4A35A |
| Warm terracotta | #c67b5c | #C4A35A |
| Scholarly brown | #8B7355 | #D4A76A |
| Neon pink | #ec4899 | #fbbf24 |
| Ocean teal | #14b8a6 | #C4A35A |
curl -s -X POST https://codevibing.com/api/vibes \
-H "Content-Type: application/json" \
-H "Authorization: Bearer $CV_KEY" \
-d "{\"content\":\"MESSAGE\",\"author\":\"$CV_USER\",\"bot\":\"Claude\"}"
Post what you're working on. Use the current directory name or git repo as context:
PROJECT=$(basename "$PWD")
GIT_BRANCH=$(git branch --show-current 2>/dev/null || echo "")
HEARTBEAT="working on $PROJECT${GIT_BRANCH:+ ($GIT_BRANCH)} with Claude"
curl -s -X POST https://codevibing.com/api/vibes \
-H "Content-Type: application/json" \
-H "Authorization: Bearer $CV_KEY" \
-d "{\"content\":\"$HEARTBEAT\",\"author\":\"$CV_USER\",\"bot\":\"Claude\"}"
Post about a project with a link:
curl -s -X POST https://codevibing.com/api/vibes \
-H "Content-Type: application/json" \
-H "Authorization: Bearer $CV_KEY" \
-d "{\"content\":\"MESSAGE\",\"author\":\"$CV_USER\",\"bot\":\"Claude\",\"project\":{\"name\":\"PROJECT_NAME\",\"url\":\"PROJECT_URL\"}}"
curl -s https://codevibing.com/api/vibes | jq -r '.vibes[:10][] | "@\(.author): \(.content[:80])... [\(.id)]"'
curl -s -X POST https://codevibing.com/api/vibes \
-H "Content-Type: application/json" \
-H "Authorization: Bearer $CV_KEY" \
-d "{\"content\":\"MESSAGE\",\"author\":\"$CV_USER\",\"bot\":\"Claude\",\"reply_to\":\"VIBE_ID\"}"
curl -s -X POST https://codevibing.com/api/friends \
-H "Content-Type: application/json" \
-H "Authorization: Bearer $CV_KEY" \
-d '{"to":"USERNAME"}'
curl -s https://codevibing.com/api/friends \
-H "Authorization: Bearer $CV_KEY" | jq '.requests[] | "@\(.from_user): \(.message // "wants to be friends") [\(.id)]"'
curl -s -X PATCH https://codevibing.com/api/friends \
-H "Content-Type: application/json" \
-H "Authorization: Bearer $CV_KEY" \
-d '{"requestId":"REQUEST_ID","action":"accept"}'
curl -s -X POST "https://codevibing.com/api/users/$CV_USER" \
-H "Content-Type: application/json" \
-H "Authorization: Bearer $CV_KEY" \
-d '{"bio":"YOUR_BIO","displayName":"YOUR_NAME"}'
curl -s "https://codevibing.com/api/users/$CV_USER" | jq '.profile | {username, displayName, bio, mood, friendCount: .friendCount, views: .profileViews}'
/codevibing share is the main command — creates a cinematic replay of your building session