jotx

Developer-first knowledge management. Git-native. AI-friendly. Beautiful.

Block-based notes with dynamic graph visualization. One slash, infinite possibilities.

✨ What is jotx?

jotx is a Notion-like block editor built for developers. Create beautiful, structured documents without leaving your IDE. Your notes are stored as clean, readable text files—perfect for version control and AI collaboration.

Why jotx?

• � Dynamic Graph View — Real-time visualization of document connections with D3.js
• 🧠 Real-Time Node Manager — Live tracking of all blocks and their relationships
• �🚀 Slash Commands — Type / to insert any block type instantly
• 📁 Git-Native — Plain text files that diff beautifully
• 🤖 AI-Ready — LLMs can read and generate jotx files directly
• 🎨 Rich Blocks — Code, math, diagrams, charts, tables, and more
• ⚡ Fast — Built on Tiptap with VS Code's native performance

🔗 Dynamic Graph View

The killer feature. See your knowledge base come alive with interactive graph visualization:

• 📊 Workspace Graph — Bird's eye view of ALL documents and their connections
• 🎯 Local Graph — Focus on a single document's immediate relationships
• ⚡ Real-Time Updates — Graph updates instantly as you edit, add links, or create documents
• 🖱️ Interactive — Click nodes to open documents, drag to rearrange, zoom and pan
• 🎨 D3.js Powered — Smooth force-directed layouts with physics simulation
• 🔍 Block-Level Links — Link to specific blocks, not just documents

How It Works

1. Click the network icon in the document header → Opens local graph
2. Right-click any .jot file → "Open in Graph View" → Opens workspace graph
3. Use /jotxlink to create internal links between documents

The Node Manager tracks every block in real-time, enabling powerful features like:

• Backlinks (see what links TO your document)
• Orphan detection (find unlinked documents)
• Connection strength analysis

🎯 Slash Commands Reference

Type / anywhere to open the command menu. Here are all available blocks:

📂 File Format

jotx uses a simple, readable text format:

hdef jotx MyDocument

  title "My First Note"
  type root

  def heading intro
    text "Welcome to jotx"
    level 1

  def paragraph p1
    text "Your notes, your way."

File extensions:

• .jot — Standard jotx documents

🚀 Getting Started

1. Install the jotx extension from VS Code Marketplace
2. Open Command Palette (Cmd+Shift+P / Ctrl+Shift+P)
3. Run jotx: Create New Note
4. Start typing / to explore block types!

Pro tip: Run jotx: Open Help Files to get interactive tutorials.

🎨 Features

✨ New in v2.4.84

• 📝 Spell Check — Built-in spell checking with red wavy underlines

  • Right-click misspelled words for suggestions
  • Toggle on/off in VS Code settings (jotx.spellCheck.enabled)
  • English dictionary (offline, no external API)

• ➕ Quick Insert — 6-dot block handle has "Insert below" action for fast block creation

• 📊 GridCard Layout Selector — Hover over GridCard blocks to change layout (1×2 to 3×3)

• 🔗 Improved Graph View — JotxLink nodes now correctly connect to target documents

30+ Rich Block Types

• Headings, lists, code — All the basics
• Syntax highlighting — For 50+ programming languages
• LaTeX math — Powered by KaTeX
• Mermaid diagrams — Flowcharts, sequence, class, and more
• Chart.js — Bar, pie, radar visualizations
• GridCards — Dashboard-style navigation blocks with layout selection

Knowledge Graph

• Workspace graph — All documents and connections at a glance
• Local graph — Focus on a single document's relationships
• Real-time — Updates live as you edit
• Interactive — Click, drag, zoom, pan

Real-Time Node Manager

• Block tracking — Every block has a unique ID
• Link indexing — Instant backlinks and forward links
• Orphan detection — Find unconnected documents

Export Options

• Markdown — Convert to standard .md files
• DOCX — Microsoft Word documents
• PDF — Print-ready documents

⚙️ Settings

📖 Documentation

• JOTX_FOR_HUMANS.jot — Comprehensive user guide with live examples
• JOTX_FOR_AI.jot — Reference guide for AI/LLM integration
• templates/ — Ready-to-use document templates
• examples/ — Sample files demonstrating all features

Access these via jotx: Open Help Files command.

🛠 Development

# Clone the repository
git clone https://github.com/jotx-labs/jotx.git

# Install dependencies
npm install

# Build all packages
npm run build

# Create VSIX
cd packages/vscode-extension && npm run package

📦 Packages

🤝 Contributing

Contributions are welcome! Please read our contributing guidelines before submitting PRs.

📄 License

Apache-2.0

Made with ❤️ by jotx-labs