Raja0sama

Vibex — Development skill for Claude Code

Development community

Architecture diagrams and checkable docs from your codebase — ERD, C4, API and lifecycle — generated from Prisma, OpenAPI or GraphQL.

How to install Vibex

This entry records only its repository, not the path inside it, so there is no exact command to give. Open Raja0sama/vibex and copy the folder into ~/.claude/skills/, or the file into ~/.claude/agents/.

What Vibex does

Architecture diagrams and checkable docs from your codebase — ERD, C4, API and lifecycle — generated from Prisma, OpenAPI or GraphQL. One HTML file, no server.

Alternatives in Development

  • Developing — Developing Prisma Next skills 47.6k ★
  • Htb Writeups — The most comprehensive Hack The Box writeup collection - 500+ machines, 400+ challenges, interactive knowledge 244 ★
  • Deep Dive Claude Code — 《深入理解 Claude Code 源码》— 系统剖析 Anthropic Claude Code CLI 的架构设计、工程实践与编程哲学 25 chapters, 101 Mermaid diagrams, 467 c 181 ★

README

vibeX

Your architecture diagram is a lie.

vibeX reads the thing that can't lie — your Prisma schema, your OpenAPI document, your GraphQL SDL, or the source itself — and renders the diagram that's actually true. Then it documents the system in claims that fail CI when the code moves underneath them.

**One standalone HTML file. No server. Nothing leaves your network.**

[![ci](https://github.com/Raja0sama/vibex/actions/workflows/ci.yml/badge.svg)](https://github.com/Raja0sama/vibex/actions/workflows/ci.yml) ![node](https://img.shields.io/badge/node-%E2%89%A518-2b6cb0) ![deps](https://img.shields.io/badge/dependencies-0-2f855a) ![license](https://img.shields.io/badge/license-MIT-718096)


The diagram you have right now

  • a whiteboard photo in a Slack thread
  • a Confluence page last touched in 2023
  • a Miro board nobody can find
  • a Mermaid block that stopped rendering
  • the one guy who knows

→ **one command, run against the schema that actually ships.**

cd ~ && npx skills add Raja0sama/vibex    # install the skill, then just ask
npx @vibex/vibex demo out                # or look first — installs nothing

[![vibeX: four diagrams and a checkable document, from one command](https://img.youtube.com/vi/SovgqAX7oSY/hqdefault.jpg)](https://www.youtube.com/watch?v=SovgqAX7oSY)

**[Watch the demo](https://www.youtube.com/watch?v=SovgqAX7oSY)**

Why "vibeX"

**vibe** — how code gets written now. Fast, AI-assisted, more of it than anyone can hold in their head. **X** — the crossings. Which table joins which. Which service calls which. What happens after approval.

**You vibed it into existence. vibeX shows you what you actually built.**

The mark is the same idea: two edges crossing. Everything interesting in a system is a line between two things, not the things themselves.

Four diagrams. One source o