๐ŸŒ Translation: Translated from Korean.

Remote Control Claude Code via Slack (1/5): Your Local Dev Environment, Anywhere

TL;DR



  • Problem: Want to use Claude Code for development outside home, but need local environment (DB, web server, tests)
  • Limitations of Existing Solutions: Web agents only access GitHub, can’t reach local environments
  • Solution: Remote control local dev environment via Slack + tmux + Claude Code
  • Result: Develop from anywhere, manage multiple projects simultaneously

1. Wanting to Code at a Cafรฉ…

Sunday afternoon, I opened my laptop at a cafรฉ. A new feature idea came to mind and I wanted to work on it right away.

The Problem: This feature required a local development environment.

  • PostgreSQL database connection
  • Redis cache server
  • Test execution (Jest + DB fixtures)
  • Verification on local web server

What About Web Agents (Cursor, Bolt, etc.)?

Many recent AI development tools support “direct GitHub code modification from the web”:

  • Cursor: Direct GitHub repository modifications
  • Bolt: Code and commit directly from the web

But local environments are inaccessible:

  • โŒ Can’t connect to local DB
  • โŒ Can’t run local web server
  • โŒ Can’t access environment-specific config files (.env.local)
  • โŒ Can’t run tests (DB dependencies)

Conclusion: Need to remotely control the local development environment.

Multiple Projects Need Simultaneous Work

Even just personal projects, there are 3:

  • blog: WordPress automation blog
  • api: Backend API server
  • docs: Documentation site

Each project has:

  • Different DB connections
  • Different environment variables
  • Different test configurations

Not just working on one project, but wanted to work across multiple projects simultaneously.

2. Why Slack Instead of a Dedicated Platform?

Initially thought “Should I build a dedicated remote development app?”

Problems with a Dedicated Platform

Development Resources:

  • Web app (React + backend)
  • iOS native app
  • Android native app
  • Testing and deployment for each

Maintenance:

  • Bug fixes
  • Security updates
  • OS-specific responses (iOS 17, Android 14…)

Estimated Time Investment: Hundreds of hours

“This isn’t right. There must be a simpler way.”

Why I Chose Slack

Already Using on Team:

  • Development team communication tool
  • Already installed on all devices
  • No additional app installation needed

Multi-Device Native Apps:

  • iOS, Android, web, desktop all supported
  • Slack handles maintenance
  • I just need to build the Bot

Interactive UI:

  • Buttons (y/n responses)
  • File upload/download
  • Real-time message updates
  • Mentions, threads, etc.

Simple Integration with Socket Mode:

  • No webhook server needed
  • Run Bot locally
  • Real-time communication via WebSocket

Channels = Projects

Leveraging Slack’s channel system:

#project-blog    โ†’ /Users/idongho/proj/blog
#project-api     โ†’ /Users/idongho/proj/api
#project-docs    โ†’ /Users/idongho/proj/docs

Commands in each channel execute Claude Code in the corresponding project directory.

Advantages:

  • Manage multiple projects simultaneously
  • Independent work queue per channel
  • Can be used with team members (future)

3. Core Architecture

3.1 System Structure

Slack channel message
    โ†“ (Socket Mode WebSocket)
Slack Bot (Node.js + TypeScript)
    โ†“
4-stage message processing pipeline
    โ†“
Work queue (FIFO, per channel)
    โ†“
tmux session (independent per project)
    โ†“
Claude Code CLI
    โ†“ (5-second polling)
Real-time progress โ†’ Slack message updates

3.2 4-Stage Message Processing Pipeline

Initially planned to “only support /ask commands”, but found it inconvenient in practice.

Currently evolved into a 4-stage pipeline:

Stage Pattern Example Description
1 Slack native /remind, /invite Handled by Slack
2 Bot meta commands /setup, /status, /help Bot configuration
3 DSL commands `build` Commands wrapped in backticks
4 Plain text “Run the tests” Execute Claude Code

Key Point: In Stage 4, just speak naturally without commands!

# Now you can write like this
"Analyze the project structure"
"Find performance bottlenecks"
"Run tests and report results"

Only Slack mentions are filtered; everything else is passed directly to Claude Code.

3.3 Role of Each Component

Slack (UI Platform):



  • Receive user input
  • Display progress
  • Interactive buttons (y/n)
  • File downloads

tmux (Session Management):

  • Claude Code is an interactive CLI (waits for user input)
  • Sessions persist even if SSH disconnects
  • Independent sessions per project

Work Queue (Sequential Processing):

  • Only 1 task executes per channel
  • FIFO guarantee (in order)
  • Prevent concurrent execution

Polling (Real-time Updates):

  • Check Claude Code output every 5 seconds
  • Auto-update Slack messages
  • Completion/error notifications

4. 5-Minute Setup Guide

4.1 Prerequisites (1 minute)

# 1. Install tmux
brew install tmux  # macOS
apt-get install tmux  # Ubuntu

# 2. Install Claude Code CLI
# (See Anthropic official docs: https://claude.ai/code)

# 3. Install Node.js 20+
node --version  # v20.0.0 or higher

4.2 Create Slack App and Configure Bot (2 minutes)

Step 1: Create App

  1. Go to https://api.slack.com/apps โ†’ Click “Create New App”
  2. Select “From an app manifest”
  3. Choose workspace
  4. Paste the following manifest:
display_information:
  name: Remote Claude
features:
  bot_user:
    display_name: Remote Claude
oauth_config:
  scopes:
    bot:
      - app_mentions:read
      - channels:history
      - channels:read
      - chat:write
      - commands
      - files:write
settings:
  event_subscriptions:
    bot_events:
      - app_mention
      - message.channels
  socket_mode_enabled: true
  1. Click “Create”

Step 2: Issue Bot Token

  1. Left menu โ†’ Click “OAuth & Permissions”
  2. Copy “Bot User OAuth Token” (xoxb-...)
  3. Save in a secure location

Step 3: Create App-Level Token

  1. Left menu โ†’ Click “Basic Information”
  2. “App-Level Tokens” section โ†’ Click “Generate Token and Scopes”
  3. Token Name: socket-token (any name)
  4. Add scope: connections:write
  5. Click “Generate”
  6. Copy token (xapp-...)
  7. Save in a secure location

Step 4: Install to Workspace

  1. Left menu โ†’ Click “Install App”
  2. Click “Install to Workspace”
  3. Approve permissions

Done! Your Slack Bot is now ready.

Troubleshooting:

  • Bot Token not showing? โ†’ Run “Install to Workspace” first
  • App-Level Token permission error? โ†’ Check connections:write scope
  • Detailed configuration covered in Day 2: Complete Slack Bot Setup Guide

4.3 Install remote-claude (1 minute)

# Clone from GitHub
git clone https://github.com/dh1789/remote-claude.git
cd remote-claude

# Install and build
npm install
npm run build

Reference: GitHub Repository

4.4 Configure Environment Variables (30 seconds)

Create .env file:

# Slack tokens (values copied from 4.2)
SLACK_BOT_TOKEN=xoxb-your-bot-token
SLACK_APP_TOKEN=xapp-your-app-token

4.5 Run (30 seconds)

# Background execution (production)
npm install -g pm2
pm2 start dist/index.js --name remote-claude

# Check logs
pm2 logs remote-claude

# Or foreground (for testing)
npm start

Success Message:

โœ… Slack Bot connected
โœ… Listening for messages...

5. Running Your First Command

5.1 Invite Bot to Channel

  1. Create channel in Slack: #my-blog
  2. In channel, enter /invite @Remote Claude
  3. Bot is added to channel

5.2 Connect Project

/setup my-blog /Users/idongho/proj/blog

โœ… Connected channel #my-blog to project /Users/idongho/proj/blog

5.3 Execute Directly with Plain Text

Now just speak naturally without commands:

Analyze the project structure

After 5 seconds:

๐Ÿ”„ Task started

๐Ÿ“‚ Analyzing project structure...

blog/
โ”œโ”€โ”€ packages/
โ”‚   โ”œโ”€โ”€ cli/          # CLI tool
โ”‚   โ”œโ”€โ”€ core/         # Core logic
โ”‚   โ””โ”€โ”€ shared/       # Shared types
โ”œโ”€โ”€ content/          # Markdown content
โ””โ”€โ”€ README.md

โœ… Completed (8 seconds)

5.4 Register and Execute Snippets

Save frequently used commands as snippets:

/snippet add test "npm run build && npm test"

โœ… Snippet 'test' saved

Execute:

/run test

๐Ÿ”„ Executing: npm run build && npm test

> build
โœ” TypeScript compiled (3.2s)

> test
โœ” 42 tests passed (8.5s)

โœ… Completed

5.5 Interactive Responses

When Claude Code requests confirmation:

โš ๏ธ Confirmation needed:

"Would you like to modify src/server.ts?"

Response: y or n

Just enter y or n:

y

โœ… Modification complete

5.6 Command Comparison

Method Example When to Use
Plain text “Run the tests” Ad-hoc requests
/run /run build-test Repetitive tasks
/snippet /snippet add … Snippet management
/download /download logs/app.log File inspection
/state /state Status check

6. After Many Trials and Errors

Initially only supported “/ask commands”. After using it:

  • Typing /ask "..." every time was inconvenient
  • Difficult to enter quotes on smartphone
  • Multiple command systems needed

Evolved to 4-stage pipeline:

  1. Slack native โ†’ Pass through
  2. Bot meta commands โ†’ Configuration
  3. DSL commands โ†’ Conciseness
  4. Plain text โ†’ Naturalness

Smartphone Optimization:

  • Interactive buttons (y/n)
  • Auto-convert Korean keyboard typos (/ใ„ดใ……ใ…์…˜ โ†’ /state)
  • Auto-split messages (3500 char limit)
  • Simplified file downloads

Current State: Refined to be convenient even on smartphones!

Detailed trials and solutions will be shared in Day 5: Smartphone Optimization.

๐Ÿ“š Series Contents

  1. Introduction + Quick Start โ† Current post
  2. Complete Slack Bot Setup Guide (Coming soon)
  3. Managing Multiple Projects Simultaneously (Coming soon)
  4. Maximizing Productivity: Snippets and Interactivity (Coming soon)
  5. Smartphone Optimization and Lessons Learned (Coming soon)

References

Project

Official Documentation

Related Posts

Next Steps:

Was this post helpful?

Day 2 will cover detailed configuration guides including Slack Bot permissions, Event Subscriptions, and Slash Commands registration. If you have questions or suggestions, please leave a comment! ๐Ÿ™Œ