AI/Claude

Claude Code GUI로 사용해보기 - Gooey(구이) 설치 및 사용방법[(구)Claudia(클로디아)

안녕하세요! 갓대희 입니다. :- )

오늘은 Claude Code GUI로 사용할 수 있게 해 주는 "Gooey(구이) ((구)Claudia)"에 대해 써보려고 한다.

🚀 Claude Code를 GUI로 써보기
터미널에서 벗어나 시각적으로 Claude Code를 관리하는 오픈소스 데스크톱 앱. 세션 관리, 커스텀 에이전트, 사용량 추적까지 가능한 도구이다.

솔직히 Claude Code 터미널 인터페이스를 보고 CLI가 아니라 "GUI로 쓸 수는 없을까?" 생각해본 적 있을 것이다.

CLI명령어에 익숙하지 않으신분들이 많기 때문에 GUI를 찾게되는 분드이 많을 것 같다. 이를 가능하게 해 주는 것이 Gooey(구이)이다. 구이에 대해 알아보자.

** 참고 **
원래는 클로디아(Claudia)라는 이름으로 유명하다.
8월 15일경 release내용을 살펴보니 Claudia에서 Gooey로 이름이 바뀌었는데, 브랜드 전환이 진행 중 인 것으로 추정된다.

** 하기 내용은 다 나의 개인적인 뇌피셜이다. **
초기에 만들어진 홍보/소개용 웹페이지(예: claudia.so, claudiacode.com)나 커뮤니티 글, 영상 등은 여전히 Claudia
라는 명칭을 사용 중이라 혼용이 발생하고 있어 헷갈리긴 하다.
Claude/Anthropic과의 연상을 강하게 만들어 상표, 브랜드 혼동을주게 되어 바꾸려는게 아닐까?

그리고 GUI의 발음에서 온 언어유희로 Gooey(Claude Code용 GUI ?? )라는 네이밍을 선택한게 아닐까라는 추정도 해보았다.

Gooey란?

Gooey는 Claude Code의 터미널 인터페이스를 GUI로 변환해주는 데스크톱 앱이다.

Tauri 2 + React + Rust로 만들어져서 네이티브 앱처럼 빠르고 안정적이다. 원래 Claudia(클로디아)라는 이름이었는데, 최근에 Gooey로 리브랜딩중인것으로 보인다.

현재 (2028.08.28(목)) 기준의 공식 문서들도 참고해보자.

https://claudia.so/

https://github.com/getAsterisk/gooey

Gooey 핵심 기능

시각적 프로젝트 브라우저 : ~/.claude/projects/ 의 모든 프로젝트를 시각적으로 관리
세션 타임라인 & 포크 : 체크포인트, 브랜칭, 원클릭 복원 기능
커스텀 AI 에이전트 : 특화된 프롬프트로 나만의 AI 어시스턴트 제작
CLAUDE.md 에디터 : 실시간 미리보기와 구문 강조 지원
사용량 분석 대시보드 : 토큰 소비량과 비용을 실시간 추적
MCP 서버 관리 : Model Context Protocol 서버 통합 관리

설치 전 준비사항

💡 중요한 전제조건
Claudia는 Claude Code CLI가 반드시 설치되어 있어야 작동한다.
Gooey GUI를 빌드하려면 Rust가 반드시 필요하다. Gooey가 Tauri 프레임워크 기반이기 때문이다.

일단 기본적으로 필요한 도구들부터 설치해야 한다. 운영체제별로 조금씩 다르니 본인 환경에 맞는 걸로 진행하면 된다.

필수 설치 목록

# 1. Claude Code
npm install -g @anthropic-ai/claude-code

# 2. Node.js 20+
curl -fsSL https://deb.nodesource.com/setup_20.x | sudo -E bash -
sudo apt install -y nodejs

# 3. Rust (Gooey GUI 빌드용만 필요)
curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs | sh

# 4. Bun (Gooey GUI 빌드용만 필요)
curl -fsSL https://bun.sh/install | bash

# 5. Git (소스 클론용)
sudo apt install git

ex) 클로드 코드, 노드, git은 대부부 설치되어 있을 것이다. Gooey 앱 빌드를 위해 위 3~4번만 진행하면된다.

ex) rust 설치

ex) bun 설치

macOS 환경 설정

// Xcode Command Line Tools 설치

xcode-select --install

# Homebrew로 추가 의존성 설치 (선택사항)
brew install pkg-config

Windows 환경 설정

// Windows 전용 설정

# 1. Microsoft C++ Build Tools 설치
# 2. WebView2 설치 (Windows 11에서는 보통 기본 설치됨)
# 3. 나머지는 동일

Gooey 설치하기 (구 Claudia)

현재 Gooey(구 Claudia)는 사전 빌드된 설치 파일을 제공하지 않는 것으로 보인다(제가 못찾은거라면 댓글로 알려주시면 꼭 갱신 하도록 하겠습니다!!). 소스코드에서 직접 빌드해야 하는데, 생각보다 어렵지 않다. 다만 처음 할 때 몇 가지 주의해야 할 부분이 있다.

// 본인이 관리하는 workspace폴더로 이동 이후 1단계부터 시작

// 1단계: 소스코드 클론

git clone https://github.com/getAsterisk/gooey.git
cd gooey

// 2단계: 의존성 설치

bun install

ex) 안되는 사례는 대부분 환경변수의 문제일 수 있다. 환경 변수는 본인의 pc에 맞게 설정해줘야한다.

ex) windows 환경에서 다음 오류가 발생하는 경우

error: failed to run custom build command for `gooey v0.1.0 (C:\work\gooey\src-tauri)`

Caused by:
  process didn't exit successfully: `C:\work\gooey\src-tauri\target\release\build\gooey-4f35a44423eac31d\build-script-build` (exit code: 1)
  --- stdout
  cargo:rerun-if-env-changed=TAURI_CONFIG
  cargo:rustc-check-cfg=cfg(desktop)
  cargo:rustc-cfg=desktop
  cargo:rustc-check-cfg=cfg(mobile)
  cargo:rerun-if-changed=C:\work\gooey\src-tauri\tauri.conf.json
  cargo:rustc-env=TAURI_ANDROID_PACKAGE_NAME_APP_NAME=so
  cargo:rustc-env=TAURI_ANDROID_PACKAGE_NAME_PREFIX=gooey_asterisk
  cargo:rustc-check-cfg=cfg(dev)
  cargo:PERMISSION_FILES_PATH=C:\work\gooey\src-tauri\target\release\build\gooey-e365353015613675\out\app-manifest\__app__-permission-files
  cargo:rerun-if-changed=capabilities
  cargo:rerun-if-env-changed=REMOVE_UNUSED_COMMANDS
  cargo:rustc-env=TAURI_ENV_TARGET_TRIPLE=x86_64-pc-windows-msvc
  package.metadata does not exist
  `icons/icon.ico` not found; required for generating a Windows Resource file during tauri-build
warning: build failed, waiting for other jobs to finish...
failed to build app: failed to build app
       Error failed to build app: failed to build app
error: script "tauri" exited with code 1

- 해당 경우는 src-tauri/icons/폴더에 icon.ico 파일이 없어서 발생하는 에러이다. 나의 경우 icon.png파일을 활용해서 icon.ico파일을 만들어 버렸다.

ex) 생성 예시

dedur@goddaehee MINGW64 /c/work/gooey (main)
$ ls -la src-tauri/icons/
total 217
drwxr-xr-x 1 dedur 197609      0 Aug 29 07:28  ./
drwxr-xr-x 1 dedur 197609      0 Aug 29 07:44  ../
-rw-r--r-- 1 dedur 197609   2858 Aug 29 07:28  128x128.png
-rw-r--r-- 1 dedur 197609   6261 Aug 29 07:28 '128x128@2x.png'
-rw-r--r-- 1 dedur 197609    647 Aug 29 07:28  32x32.png
-rw-r--r-- 1 dedur 197609 163632 Aug 29 07:28  icon.icns
-rw-r--r-- 1 dedur 197609  33181 Aug 29 07:28  icon.png

dedur@goddaehee MINGW64 /c/work/gooey (main)
$ bunx @tauri-apps/cli icon src-tauri/icons/icon.png
Resolving dependencies
Resolved, downloaded and extracted [28]
Saved lockfile
        Appx Creating StoreLogo.png
        Appx Creating Square30x30Logo.png
        Appx Creating Square44x44Logo.png
        Appx Creating Square71x71Logo.png
        Appx Creating Square89x89Logo.png
        Appx Creating Square107x107Logo.png
        Appx Creating Square142x142Logo.png
        Appx Creating Square150x150Logo.png
        Appx Creating Square284x284Logo.png
        Appx Creating Square310x310Logo.png
        ICNS Creating icon.icns
         ICO Creating icon.ico
         PNG Creating 32x32.png
         PNG Creating 64x64.png
         PNG Creating 128x128.png
         PNG Creating 128x128@2x.png
         PNG Creating icon.png
         PNG Creating mipmap-hdpi/ic_launcher_foreground.png
         PNG Creating mipmap-hdpi/ic_launcher_round.png
         PNG Creating mipmap-hdpi/ic_launcher.png
         PNG Creating mipmap-mdpi/ic_launcher_foreground.png
         PNG Creating mipmap-mdpi/ic_launcher_round.png
         PNG Creating mipmap-mdpi/ic_launcher.png
         PNG Creating mipmap-xhdpi/ic_launcher_foreground.png
         PNG Creating mipmap-xhdpi/ic_launcher_round.png
         PNG Creating mipmap-xhdpi/ic_launcher.png
         PNG Creating mipmap-xxhdpi/ic_launcher_foreground.png
         PNG Creating mipmap-xxhdpi/ic_launcher_round.png
         PNG Creating mipmap-xxhdpi/ic_launcher.png
         PNG Creating mipmap-xxxhdpi/ic_launcher_foreground.png
         PNG Creating mipmap-xxxhdpi/ic_launcher_round.png
         PNG Creating mipmap-xxxhdpi/ic_launcher.png
         iOS Creating AppIcon-20x20@2x-1.png
         iOS Creating AppIcon-20x20@1x.png
         iOS Creating AppIcon-20x20@2x.png
         iOS Creating AppIcon-20x20@3x.png
         iOS Creating AppIcon-29x29@2x-1.png
         iOS Creating AppIcon-29x29@1x.png
         iOS Creating AppIcon-29x29@2x.png
         iOS Creating AppIcon-29x29@3x.png
         iOS Creating AppIcon-40x40@2x-1.png
         iOS Creating AppIcon-40x40@1x.png
         iOS Creating AppIcon-40x40@2x.png
         iOS Creating AppIcon-40x40@3x.png
         iOS Creating AppIcon-60x60@2x.png
         iOS Creating AppIcon-60x60@3x.png
         iOS Creating AppIcon-76x76@1x.png
         iOS Creating AppIcon-76x76@2x.png
         iOS Creating AppIcon-83.5x83.5@2x.png
         iOS Creating AppIcon-512@2x.png

고생했던 경험
처음에 npm으로 설치하려다가 의존성 충돌 때문에 한참 헤맸다. Tauri 프로젝트는 웬만하면 bun 쓰는 게 정답인 것 같다. yarn으로도 해봤는데 빌드 시간이 엄청 오래 걸렸다.

// 3단계: 개발 모드로 실행 (첫 테스트용)

bun run tauri dev

개발 모드로 실행하면 프런트엔드 빌드하고 Rust 컴파일하는 시간이 좀 걸린다.

첫 실행은 5-10분 정도 소요될 수 있으니 인내심을 갖고 기다리자.

성공 확인
앱 창이 뜨고 "Welcome to Gooey" 화면이 보이면 설치 성공이다. ~/.claude 디렉토리를 자동으로 감지해서 프로젝트 목록을 표시해준다.

프로덕션 빌드 만들기

개발 모드가 아닌 독립 실행 파일을 만들고 싶다면 다음 명령어로 빌드하면 된다.

// 프로덕션 빌드

bun run tauri build

# 빌드 결과물 위치:
# Linux: src-tauri/target/release/gooey
# macOS: src-tauri/target/release/gooey
# Windows: src-tauri/target/release/gooey.exe

ex) mac

빌드후 다음과 같이 생성되면, Gooey를 Applications로 이동시켜 앞으로 다른 앱 처럼 사용 가능하다.

ex) windows는 직접 바로가기를 생성하자. 생성된 파일 위치는 알려 준다.

첫 실행 및 초기 설정

위에서 Gooey앱을 빌드하였고, 클릭하면 Gooey가 실행된다. Gooey를 처음 실행하면 환영 화면이 나타나고, ~/.claude 디렉토리를 자동으로 스캔해서 기존 Claude Code 프로젝트들을 찾는다.

만약 Claude Code를 한 번도 사용한 적이 없다면 빈 프로젝트 목록이 보일 것이다.

첫 실행 시 보이는 주요 섹션들

자세한 내용은 하기 별도 섹션에서 살펴보자. 간단히 요약하자면..

1. Claude Code Projects : 기존 Claude Code 프로젝트 관리

2. Claude Code Agents : 커스텀 AI 에이전트 생성 및 관리

3. Usage Dashboard : 사용량 및 비용 추적 대시보드

4. Settings : 설정 및 환경 구성

1. 프로젝트 관리하기

1) Projects 탭에서는 기존 Claude Code 프로젝트들을 시각적으로 관리할 수 있다.

기존 터미널방식 : `claude` 명령어로 들어가던 걸 이제 클릭 한 번으로 할 수 있다.

// 새 프로젝트 생성 (터미널 방식)

cd your-project-directory
claude

터미널로 한 번 프로젝트를 초기화하면, Claudia에서 자동으로 감지해서 프로젝트 카드가 나타난다.

각 프로젝트 카드에는 다음 정보들이 표시된다.

프로젝트 이름 : 디렉토리 이름 기반
마지막 활성 세션 : 언제 마지막으로 사용했는지
세션 개수 : 총 몇 개의 대화 세션이 있는지
파일 개수 : 프로젝트에 포함된 파일 수

2) 예시

ex) ~/work/testprj 폴더 생성 > Gooey에서 "Open Project" 클릭 및 해당 신규 프로젝트 폴더 (testprj) 선택

ex) 이 상태에서 "New session"을 클릭하면 기존 CLI방식이랑 동일하게 시작 가능하다.

ex) 슬래시 명령어, Custom 명령어 모두 다 Clode Code cli 방식과 동일하게 새용 가능하다.

ex) 커스텀 명령어도 새용해보자.

# 1) 랭킹 컴포넌트 코드 분석
/sc:analyze BunnyRanking.tsx --focus quality

- 이전 슈퍼클로드에서 사용 했던 명령어

2025.08.11 - [AI/Claude] - Claude Code + SuperClaude 조합 : SuperClaude 설치 방법 (/sc: 커맨드로 개발 효율성 올리기)

- gui 방식으로 결과가 어떻게 나올지 해보자.

- cli 모다 확실히 예쁘긴 한것 같다. (cli만의 감성도 물론 좋다.)

- 각각의 대화마다 토큰 사용량이 표현도 된다.

ex) 좌측 하단에서 model을 변경하는것도 가능하다. (나의 경우 아직 max 플랜이 아니기 때문에 Opus모델은 별 의미가 없다. 사용불가 )

ex) "추론 모드(Reasoning Mode)"를 선택할 수 있는 옵션 메뉴도 있다.

3) 이미 다른 글에서도 많이 얘기한 내용이지만, `/init` 명령어를 실행하면 Claude가 프로젝트를 스캔해서 CLAUDE.md 파일을 자동 생성해준다. 이 파일이 Claude가 프로젝트를 이해하는 핵심 자료가 된다.

자동 생성되는 CLAUDE.md 예시

# E-commerce Dashboard

React + TypeScript + Tailwind 기반의 관리자 대시보드

## 기술 스택
- Frontend: React 18, TypeScript, Tailwind CSS
- State: Zustand
- Build: Vite
- Testing: Vitest, React Testing Library

## 폴더 구조
- `/src/components`: 재사용 가능한 UI 컴포넌트
- `/src/pages`: 페이지별 컴포넌트
- `/src/stores`: Zustand 스토어
- `/src/utils`: 유틸리티 함수

## 개발 가이드라인
- 모든 컴포넌트는 함수형으로 작성
- Props 인터페이스 필수 정의
- 에러 바운더리 활용

💡 CLAUDE.md 최적화 팁
자동 생성된 CLAUDE.md를 그대로 쓰지 말고, 팀의 실제 코딩 컨벤션과 주의사항을 추가로 작성하자. "절대 하지 말아야 할 것들"을 명시하는 게 특히 중요하다.

세션 타임라인 & 포크 기능

프로젝트를 클릭하면 세션 타임라인이 나타나는데, Claude와의 모든 대화 내역을 시각적으로 볼 수 있다.

ex) 기존 클로드 코드로 봤을때 : /resume

- 확실히 gui 방식이 더 이쁘긴 하다. ( 그리고 불필요한 세션들은 .... 앞으로 정리하는 습관을 들이도록 해야 겠다. /clear 를 자주 사용하지 않는티가 너무 났다.)

세션 타임라인의 기능들
• 체크포인트 생성: 중요한 시점에 저장점 만들기
• 원클릭 복원 : 이전 상태로 즉시 되돌리기
• 브랜치 생성 : 여러 방향으로 실험해보기
• 변경사항 diff : 체크포인트 간 코드 차이 시각화

세션 포크 기능
체크포인트에서 "포크"를 만들 수도 있다. A 방법으로 구현하다가 막히면 이전 체크포인트로 돌아가서 B 방법을 시도해볼 수 있다. 원본은 그대로 두고 말이다. Git의 브랜치와 비슷한 개념인데, AI 세션에 적용한 게 정말 아이디어가 좋은 것 같다.

2. 커스텀 AI 에이전트 만들기

특정 작업에 특화된 AI 에이전트를 만들어서 재사용할 수 있다.

예를 들어, 코드 리뷰 전용 에이전트, 문서화 전용 에이전트, 디버깅 전용 에이전트 등을 만들 수 있다.

에이전트 생성 단계별 가이드

에이전트 설정 단계별 프로세스

기본 정보 설정 : 에이전트 이름, 아이콘, 설명 입력
모델 선택: Claude 4.0 Sonnet, Opus 등 사용할 모델 선택
시스템 프롬프트 작성: 에이전트의 역할과 행동 방식 정의
보안 설정: 파일 접근 권한, 네트워크 제한 등 설정
테스트 및 배포: 에이전트 작동 확인 후 저장

ex) 커스 텀 에이전트 예시

코드 리뷰 전문가 ( Code Review Master )

이름: Code Review Master
아이콘: 🔍 (search 검색하여 등록 하자.)
모델: Claude 4.0 Sonnet

시스템 프롬프트:
당신은 10년 경력의 시니어 개발자입니다. 코드 리뷰를 할 때:

1. **심각도별 분류**: Critical > Major > Minor 순으로 분류
2. **핵심만 집중**: 버그, 보안 취약점, 성능 이슈만 집중적으로 검토
3. **구체적인 제안**: "여기가 문제다"가 아니라 "이렇게 수정하세요" 형태
4. **코드 스니펫 제공**: 수정 전/후 코드를 반드시 포함

절대 변수명이나 주석 같은 사소한 스타일 이슈는 언급하지 마세요.
실제 동작에 영향을 주는 문제만 찾아주세요.

ex) 상기 코드 리뷰 에이전트를 하나 만들어 보자.

- Create Agent 클릭

- 다음과 같이 항목을 채워 넣자.

- 저장된 리스트에서 확인 가능하며 Run 하여 실행 가능

- 대상 프로젝트 선택

- 이후 원하는 태스트를 입력하여 실행한다.

ex) 테스트 코드 자동 생성기(Test Generator Pro)

이름: Test Generator Pro  
아이콘: 🧪
모델: Claude 4.0 Sonnet

시스템 프롬프트:
테스트 코드 생성 전문가입니다. 다음 원칙을 지켜주세요:

**React/TypeScript 프로젝트:**
- React Testing Library + Vitest 사용
- 사용자 관점에서 테스트 작성 (구현 디테일 X)
- Happy path + Error case + Edge case 모두 포함
- Mock은 최소한만 사용

**Python 프로젝트:**
- pytest + pytest-mock 사용
- AAA 패턴 (Arrange, Act, Assert) 준수
- 파라미터화 테스트 적극 활용

**공통 요구사항:**
- 테스트 커버리지 90% 이상 달성 목표
- 실행 가능한 완전한 테스트 파일 생성
- 설명 주석 포함

ex) React 컴포넌트 생성기 에이전트 예시

이름: React Component Builder
아이콘: ⚛️
모델: Claude 4.0 Sonnet

시스템 프롬프트:
당신은 React 컴포넌트 생성 전문가입니다.
다음 규칙에 따라 컴포넌트를 생성해주세요:

1. TypeScript + 함수형 컴포넌트만 사용
2. Tailwind CSS를 이용한 스타일링
3. props 인터페이스 정의 필수
4. Storybook 스토리 파일 함께 생성
5. 적절한 JSDoc 주석 추가
6. 테스트 파일(.test.tsx) 기본 구조 제공

파일 구조: ComponentName.tsx, ComponentName.stories.tsx, ComponentName.test.tsx
간결하고 재사용 가능한 컴포넌트를 만들어주세요.

고급 기능 활용하기

MCP 서버 관리

MCP(Model Context Protocol) 서버를 통해 Claude에게 추가 기능을 부여할 수 있다. Claudia에서는 이를 GUI로 쉽게 관리할 수 있다.

ex) 파일 검색 MCP

// Gooey MCP 설정에서 추가

{
 "name": "File Search Pro",
 "type": "stdio", 
 "command": "npx",
 "args": ["-y", "mcp-file-search"],
 "description": "Advanced semantic file search",
 "allowedPaths": ["./src", "./docs", "./tests"],
 "networkAccess": false
}

ex) Git 관리 MCP

// Git 연동 MCP 설정

{
 "name": "Smart Git Manager",
 "type": "stdio",
 "command": "npx", 
 "args": ["-y", "mcp-git-manager"],
 "description": "Intelligent git workflow automation",
 "allowedPaths": [".git", "./"],
 "allowedCommands": ["git"]
}

💡 Git MCP 꿀팁
"변경사항 정리해서 의미있는 커밋 메시지로 커밋해줘"라고 하면 변경 내용을 분석해서 적절한 커밋 메시지를 만들어준다. 더 이상 "fix bug", "update code" 같은 무의미한 메시지 안 써도 된다.

사용량 분석 대시보드 활용

Usage Analytics 탭에서는 Claude API 사용량을 자세히 볼 수 있다. 프로젝트별, 모델별, 시간별로 분석등이 가능하다.

주요 분석 메트릭

토큰 소비량 (입력/출력 토큰 구분)
API 호출 횟수 및 빈도
모델별 사용 비율 및 비용 분석
프로젝트별 예상 월간 비용
에이전트별 성능 및 효율성 분석
시간대별 사용 패턴 추적

ex) 하기 통계 그래프 모양의 아이콘 클릭

ex) 내 한달간 운영한 클로드 코드 비용 대시보드

ex) 모델별 사용량

ex) 타임 라인등을 볼 수 있다.

팀 협업 활용법

혼자 쓸 때도 좋지만, 팀에서 함께 쓸 때 Gooey의 진가가 발휘된다. 우리 팀에서 실제로 도입한 협업 패턴들을 공유해보겠다.

공통 에이전트 라이브러리 구축

팀 전체가 동일한 에이전트를 사용할 수 있도록 에이전트 설정을 공유했다. Git으로 .gooey 폴더를 버전 관리하는 방식이다.

// 팀 공용 에이전트 설정 구조

project-root/
├── .gooey/
│   ├── agents/
│   │   ├── code-reviewer.json
│   │   ├── test-generator.json  
│   │   ├── doc-writer.json
│   │   └── refactor-helper.json
│   └── config.json
└── CLAUDE.md

팀 협업 워크플로우

코드 작성: 개발자가 기본 로직 구현
자동 리뷰: Code Review Master 에이전트로 1차 검토
테스트 생성: Test Generator Pro로 테스트 코드 자동 생성
문서화: Doc Writer로 API 문서 및 주석 생성
PR 생성: 정리된 내용으로 Pull Request 작성
팀 리뷰: 사람이 최종 검토 후 머지

코드 표준화 에이전트

Style Enforcer

이름: Team Style Enforcer
아이콘: 🎨
모델: Claude 4.0 Sonnet

시스템 프롬프트:
우리 팀의 코딩 표준을 강제하는 에이전트입니다.

**React 컴포넌트 표준:**
- 함수명: PascalCase (UserProfile)
- 파일명: PascalCase.tsx (UserProfile.tsx)
- Props 인터페이스명: ComponentNameProps
- 상수: UPPER_SNAKE_CASE

**폴더 구조 표준:**
- /components/common: 공통 컴포넌트
- /components/pages: 페이지별 컴포넌트  
- /hooks: 커스텀 훅
- /utils: 유틸리티 함수

**금지사항:**
- any 타입 사용 금지
- console.log 프로덕션 코드 포함 금지
- inline 스타일 사용 금지
- 하드코딩된 URL 사용 금지

기존 코드가 표준을 위반하면 자동으로 수정해주세요.

트러블슈팅 & 팁

🚨 자주 발생하는 에러들:

Error: Failed to spawn Claude Code CLI
→ Claude Code가 PATH에 없거나 설치되지 않음

Error: WebKit GTK not found 
→ Linux에서 webkit2gtk 패키지 누락

Error: Tauri build failed
→ Rust 컴파일러 버전 문제 (최신 stable 권장)

Error: Agent execution failed
→ 보안 설정이 너무 제한적이거나 프롬프트 문제

💡 사용할 때 팁들
• 개발 모드(`bun run tauri dev`)로 먼저 테스트해보고 문제없으면 빌드하기
• 에이전트 시스템 프롬프트는 짧고 명확하게 작성하기
• 세션이 너무 길어지면 체크포인트를 중간중간 만들어두기
• 포크 기능을 적극 활용해서 여러 방향으로 실험해보기
• CLAUDE.md를 프로젝트마다 작성해서 컨텍스트 제공하기
• 사용량 대시보드를 주기적으로 확인해서 비용 관리하기
• MCP 서버는 필요한 것만 설치하기 (너무 많으면 느려짐)

Q: Gooey(Claudia)가 Claude Code CLI보다 느린 것 같은데요?

A: 맞습니다. GUI 래핑 때문에 약간의 오버헤드가 있어요. 하지만 생산성 향상을 고려하면 충분히 감수할만합니다. 성능이 중요한 작업은 터미널 Claude Code를 병행해서 사용하는 것도 좋은 전략이에요.

Q: 에이전트가 원하는 대로 작동하지 않아요

A: 시스템 프롬프트를 더 구체적으로 작성해보세요. "코드 리뷰를 해줘"보다는 "버그와 보안 취약점 위주로 간결하게 리뷰해줘"처럼 명확한 지시가 효과적입니다. 그리고 보안 설정도 확인해보세요.

Q: 빌드가 자꾸 실패해요

A: 의존성 설치가 제대로 되었는지 확인하고, Rust와 Node.js가 최신 버전인지 체크해보세요. 특히 Linux에서는 시스템 라이브러리들이 모두 설치되었는지 꼼꼼히 확인해야 합니다.

Q: CLAUDE.md를 어떻게 효과적으로 활용하나요?

A: 프로젝트 구조, 코딩 컨벤션, 자주 사용하는 패턴, 피해야 할 실수들을 정리해두세요. Claude가 프로젝트를 더 잘 이해하게 됩니다. 특히 팀 프로젝트에서는 모든 팀원이 동일한 컨텍스트를 공유할 수 있어 유용해요.

정리

GUI의 진짜 가치: 단순히 예쁘게 보이는 게 아니라 워크플로우 자체를 개선시켜준다
포크 기능의 혁신성: AI 세션에 Git 브랜치 개념을 도입한 건 정말 혁신적이다
통합 환경의 장점: 프로젝트 관리, 문서 작성, 에이전트 실행이 한 곳에서 가능한 게 편하다
오픈소스의 힘: 커뮤니티에서 만든 도구가 때로는 공식 도구보다 더 실용적일 수 있다
도구의 조합: 터미널 Claude Code와 Gooey를 상황에 따라 병행 사용하는 게 최고
보안과 편의성의 균형: 적절한 보안 설정으로 안전하면서도 편리하게 사용 가능
문서화의 중요성: CLAUDE.md를 잘 작성해두면 AI가 훨씬 더 똑똑해진다

참고 자료

Gooey GitHub 저장소 - 공식 소스코드와 이슈 트래킹
Claude Code 공식 문서 - Claude Code CLI 설치 및 사용법
Tauri 공식 사이트 - Tauri 프레임워크 이해를 위한 자료
Bun 공식 사이트 - Bun 패키지 매니저 설치 가이드

저작자표시 비영리 변경금지 (새창열림)

'AI > Claude' 카테고리의 다른 글

Claude Code 2.0(클로드 코드 2.0) 설치 - (Claude Code 1.0에서 2.0 업그레이드 하기) (6)	2025.10.07
클로드 신기능 리뷰 - Upgraded file creation and analysis(Excel, Word, PowerPoint, PDF 파일 생성 및 편집) (2)	2025.09.14
Claude Code + SuperClaude 조합(2) : SuperClaude 사용 예시 (React 프로젝트 화면 버그 수정) (13)	2025.08.12
Claude Code + SuperClaude 조합 : SuperClaude 설치 방법 (/sc: 커맨드로 개발 효율성 올리기) (15)	2025.08.11
Claude Code CLI (2) - 기본 사용 방법 (클로드 코드 - 고급 CLI 명령어 사용 방법) (9)	2025.08.01

Contents

새소식