17. IDE·데스크톱·웹·모바일

🎯 이 장의 목표

Claude Code의 여러 채널(CLI·IDE·데스크톱·웹·모바일)의 차이를 안다
같은 세션을 환경 사이에서 옮기는 법(teleport·desktop·remote control)을 안다
각 채널이 로컬 파일시스템을 건드리는지 여부를 구분한다
작업 성격에 맞는 채널을 고른다

하나의 엔진, 여러 표면

1장에서 봤듯, Claude Code는 같은 핵심 엔진을 여러 표면(surface) 으로 제공합니다. CLI가 기준이고, 나머지는 그 도구 집합의 일부를 각자의 방식으로 비춥니다.

flowchart TB
    Engine[Claude Code 핵심 엔진]:::agent
    Engine --> CLI[CLI<br/>터미널·기준 표면]:::tool
    Engine --> IDE[IDE 확장<br/>VS Code·JetBrains]:::tool
    Engine --> Desk[데스크톱 앱<br/>macOS·Windows]:::tool
    Engine --> Web[Web<br/>claude.ai/code]:::result
    Engine --> Mobile[모바일<br/>iOS 앱]:::tool

    classDef agent fill:#80DEEA,stroke:#00ACC1,color:#000
    classDef tool fill:#90CAF9,stroke:#1E88E5,color:#000
    classDef result fill:#A5D6A7,stroke:#43A047,color:#000

채널	로컬 파일 접근	특징
CLI	✅	모든 기능의 기준
VS Code / JetBrains	✅	에디터 안 인터랙티브 diff·선택 영역 공유
데스크톱 앱	✅	GUI·시각적 diff·병렬 세션 (Linux 미지원)
Web	❌	로컬 파일을 건드리지 않는 유일한 채널
모바일(iOS)	❌(원격)	작업 디스패치·원격 제어

📌 핵심

IDE 확장과 데스크톱 앱은 CLI와 같은 settings.json 트리를 읽습니다(10장). 그래서 권한·훅·MCP 설정이 채널 간에 일관되게 적용됩니다.

IDE 확장 (VS Code · JetBrains)

에디터 안에서 Claude Code 패널을 띄우고, 인터랙티브 diff 뷰로 변경을 검토하며, 선택한 코드 영역을 컨텍스트로 공유합니다. VS Code 확장과 JetBrains 플러그인(IntelliJ·PyCharm·WebStorm 등)이 있습니다.

설치: VS Code는 마켓플레이스에서 확장 설치, JetBrains는 마켓플레이스에서 플러그인 설치 후 IDE 재시작.

💡 팁

터미널과 에디터를 오가기 싫은 사람에게 좋습니다. diff를 시각적으로 보며 승인할 수 있어, 검토 흐름이 더 직관적입니다.

데스크톱 앱

터미널·IDE 밖에서 Claude Code를 돌리는 독립 앱(macOS·Windows, Linux 미지원)입니다. 핵심 강점:

시각적 diff 검토: 변경을 한눈에 보고 승인/거부
병렬 세션: 여러 세션을 나란히 실행 (각 세션이 git worktree로 격리되어 서로 영향 없음)
스케줄 작업: 로컬에서 반복 작업 예약 (→ 19장)
클라우드 세션 시작: 무거운 작업을 클라우드로 던지기

설치 후 로그인하고 Code 탭을 열면 시작합니다. (유료 구독 필요.)

📌 핵심

데스크톱 스케줄 작업은 당신의 머신에서 돌아 로컬 파일·도구에 직접 접근합니다. 머신이 꺼지면 안 돌아갑니다 — 클라우드에서 돌리려면 routines를 쓰세요(→ 19장).

Web (클라우드)

브라우저에서 로컬 설치 없이 Claude Code를 돌립니다(claude.ai/code). 긴 작업을 던져놓고 나중에 확인하거나, 로컬에 없는 저장소에서 작업하거나, 여러 작업을 병렬로 돌릴 때 좋습니다. 데스크톱 브라우저와 iOS 앱에서 됩니다.

⚠️ Web은 로컬 파일시스템을 건드리지 않습니다. 클라우드에서 저장소를 클론해 작업하므로, 로컬 파일·로컬 앱·로컬 브라우저가 필요한 작업엔 맞지 않습니다.

세션을 환경 사이에서 옮기기

Claude Code의 강력한 점은 세션이 한 표면에 묶이지 않는다는 것입니다. 맥락이 바뀌면 작업을 환경 간에 이동할 수 있습니다.

flowchart LR
    Phone[📱 모바일/웹]:::tool -->|claude --teleport| Term[💻 터미널]:::tool
    Term -->|/desktop| Desk[🖥️ 데스크톱 앱<br/>시각적 diff 검토]:::result
    Phone2[📱 모바일]:::tool -->|Remote Control| Any[어디서든 이어 작업]:::result
    Phone3[📱 모바일]:::tool -->|Message로 디스패치| DeskSession[데스크톱 세션 생성]:::result

    classDef tool fill:#90CAF9,stroke:#1E88E5,color:#000
    classDef result fill:#A5D6A7,stroke:#43A047,color:#000

방법	무엇
Remote Control	책상을 떠나 폰·브라우저에서 작업 계속
Message(디스패치)	폰에서 작업을 던지면 그게 만드는 데스크톱 세션을 연다
`claude --teleport`	웹·iOS에서 시작한 긴 작업을 터미널로 끌어온다 (claude.ai 구독 필요)
`/desktop`	터미널 세션을 데스크톱 앱으로 넘겨 시각적 diff 검토

💡 팁

모바일·원격 제어와 채널(Telegram 등)을 통한 더 적극적인 원격 워크플로우는 20장에서 깊이 다룹니다.

어떤 채널을 고를까

CODE

파일을 직접 보며 검토하고 싶다       →  데스크톱 앱 / IDE 확장
터미널 워크플로우에 녹이고 싶다       →  CLI (기준 표면)
로컬에 없는 repo·긴 병렬 작업        →  Web (클라우드)
이동 중·다른 기기에서 이어가기        →  모바일 + Remote Control / teleport

📌 정답은 하나가 아닙니다. 많은 사용자가 CLI로 작업하다 /desktop으로 넘겨 diff를 검토하거나, 웹에서 던진 작업을 --teleport로 터미널에 끌어오는 식으로 섞어 씁니다.

이 장에서 배운 것

같은 엔진이 CLI·IDE·데스크톱·Web·모바일로 제공되며, 모두 같은 settings.json을 읽어 설정이 일관된다.
Web만 로컬 파일을 건드리지 않는다(클라우드 클론). 로컬 의존 작업엔 부적합.
데스크톱 앱은 시각적 diff·병렬 세션(worktree 격리)·스케줄·클라우드 세션을 제공한다(Linux 미지원).
세션은 표면에 묶이지 않는다: Remote Control·Message·--teleport·/desktop 으로 환경 간 이동.
작업 성격에 맞는 채널을 고르고, 섞어 쓰는 게 자연스럽다.

✍️ 확인 문제

로컬 파일시스템을 건드리지 않는 유일한 채널은 무엇이고, 어떤 작업에 부적합한가요?
터미널에서 작업하다 변경을 시각적으로 검토하고 싶을 때 쓰는 방법은 무엇인가요?
웹에서 시작한 긴 작업을 터미널로 가져오려면 어떤 명령을 쓰나요?

다음 장: 18. Git/GitHub 워크플로우 — 버전 관리, 되돌리기, GitHub 연동.

← 이전16. Plugins(플러그인)다음 →18. Git/GitHub 워크플로우