Skip to content

A CI/CD tool that automatically captures code changes, generates mobile-optimized HTML diffs, uploads them to cloud storage, and sends notification links - designed for developers coding on mobile devices via SSH with Claude Code.

License

Notifications You must be signed in to change notification settings

mylukin/ccanywhere

Folders and files

NameName
Last commit message
Last commit date

Latest commit

ย 

History

66 Commits
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 

Repository files navigation

CCanywhere

npm version License: MIT

English | ็ฎ€ไฝ“ไธญๆ–‡

Mobile-friendly CI/CD tool for viewing code diffs when developing via SSH with Claude Code. Automatically captures changes, generates HTML diffs, uploads to cloud storage, and sends notifications.

๐ŸŽฏ Why CCanywhere?

Problem: Can't view code diffs on mobile devices when using Claude Code via SSH.

Solution: Auto-capture changes โ†’ Generate mobile HTML diffs โ†’ Upload to cloud โ†’ Send notification links.

โœจ Features

  • ๐Ÿ“ฑ Mobile-optimized diff viewing
  • ๐Ÿ”— Claude Code hook integration
  • โ˜๏ธ Cloud storage (R2, S3, OSS)
  • ๐Ÿ“ฌ Multi-channel notifications (Telegram, DingTalk, WeChat Work, Email)
  • ๐Ÿงช Playwright testing support
  • ๐Ÿš€ Deployment webhooks

๐Ÿš€ Quick Start

Install

# Global install (recommended)
npm install -g ccanywhere
ccanywhere init

# Or project-specific
npm install -D ccanywhere

Configure

Create ccanywhere.config.json:

{
  "artifacts": {
    "baseUrl": "https://artifacts.example.com",
    "storage": {
      "provider": "r2",
      "r2": {
        "accountId": "YOUR_ACCOUNT_ID",
        "accessKeyId": "YOUR_ACCESS_KEY",
        "secretAccessKey": "YOUR_SECRET_KEY",
        "bucket": "my-bucket"
      }
    }
  },
  "notifications": {
    "channels": ["telegram"],
    "telegram": {
      "botToken": "YOUR_BOT_TOKEN",
      "chatId": "YOUR_CHAT_ID"
    }
  }
}

Test & Run

# Test configuration
ccanywhere test --all

# Run pipeline
ccanywhere run

๐Ÿ“– Commands

ccanywhere init          # Initialize configuration
ccanywhere run           # Run build pipeline
ccanywhere test          # Test configuration
ccanywhere register      # Manage Claude Code hooks
ccanywhere cleanup       # Clean old artifacts
ccanywhere info          # Show configuration info

Test Options

ccanywhere test --all              # Test everything
ccanywhere test --notifications    # Test notifications only
ccanywhere test --deployment       # Test deployment only
ccanywhere test --notifications --send --title "Test" --message "Hello"

Claude Code Integration

ccanywhere register         # Register Stop hook
ccanywhere register --status  # Check hook status
ccanywhere register --remove  # Remove hooks

โš™๏ธ Configuration

Configuration Hierarchy

  1. Environment variables (highest priority)
  2. Project config (ccanywhere.config.json)
  3. User config (~/.claude/ccanywhere.config.json)
  4. Defaults

User Configuration

Store common settings in ~/.claude/ccanywhere.config.json:

{
  "notifications": {
    "channels": ["telegram"],
    "telegram": {
      "botToken": "YOUR_BOT_TOKEN",
      "chatId": "YOUR_CHAT_ID"
    }
  }
}

Environment Variables

Set system environment variables to override configuration:

# Storage
export STORAGE_PROVIDER=r2
export R2_ACCOUNT_ID=your-account-id
export R2_ACCESS_KEY_ID=your-key
export R2_SECRET_ACCESS_KEY=your-secret
export R2_BUCKET=my-bucket

# Notifications
export BOT_TOKEN_TELEGRAM=your-token
export CHAT_ID_TELEGRAM=your-chat-id

# Optional
export DEPLOYMENT_WEBHOOK_URL=https://deploy.example.com/webhook

๐Ÿ“ฌ Notifications

Telegram

  1. Create bot via @BotFather
  2. Get bot token
  3. Add bot to chat and get chat ID

Email

{
  "email": {
    "to": "admin@example.com",
    "smtp": {
      "host": "smtp.gmail.com",
      "port": 587,
      "user": "your-email@gmail.com",
      "pass": "your-app-password"
    }
  }
}

DingTalk / WeChat Work

{
  "dingtalk": "https://oapi.dingtalk.com/robot/send?access_token=TOKEN",
  "wecom": "https://qyapi.weixin.qq.com/cgi-bin/webhook/send?key=KEY"
}

๐Ÿงช Playwright Testing

# Install Playwright
npm install -D @playwright/test
npx playwright install

# Configure in ccanywhere.config.json
{
  "test": {
    "enabled": true,
    "configFile": "./playwright.config.ts"
  }
}

๐Ÿ“ Storage Structure

Files are organized as: {folder}/{project-name}/{filename}

  • GitHub repo: https://github.com/owner/repo
  • Storage path: diffs/owner/repo/diff-123.html

๐Ÿš€ Deployment

{
  "deployment": "https://deploy.example.com/webhook"
}

Webhook receives:

  • ref: Git commit hash
  • branch: Current branch
  • trigger: "ccanywhere"
  • timestamp: Unix timestamp

๐Ÿ”ง Development

# Setup
git clone https://github.com/mylukin/ccanywhere.git
cd ccanywhere
npm install

# Development
npm run dev

# Test
npm test

# Build
npm run build

# Lint & Format
npm run lint
npm run format

๐Ÿ“ License

MIT

๐Ÿ†˜ Support


Made with โค๏ธ for developers who code anywhere ๐Ÿ“ฑ๐Ÿ’ป๐ŸŒ

About

A CI/CD tool that automatically captures code changes, generates mobile-optimized HTML diffs, uploads them to cloud storage, and sends notification links - designed for developers coding on mobile devices via SSH with Claude Code.

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Contributors 2

  •  
  •