OpenClaw용 커스텀 커맨드 센터 앱: Tailscale과 WebSocket 프록시를 사용한 React PWA
Reddit 사용자(Weird_Night_2176)가 자신의 OpenClaw 게이트웨이를 기반으로 구축한 맞춤형 명령 센터 앱을 공유했습니다. 이 앱은 이전에 WhatsApp을 기반으로 한 제어 방식을 대체하며, Twilio의 하루 50개 메시지 샌드박스 제한으로 인해 불편을 겪었습니다. 설정은 Jetson 장치에서 실행되며, Tailscale을 통해 어디서나 접속 가능한 React PWA를 제공합니다.
아키텍처 및 주요 구성 요소
- WebSocket 프록시: OpenClaw는 루프백에만 바인딩되므로 개발자는 WebSocket 연결을 브리징하는 경량 Express 프록시 서버를 만들었습니다. 이를 통해 React 프론트엔드가 Tailscale 메시의 모든 장치에서 OpenClaw 게이트웨이와 통신할 수 있습니다.
- 프론트엔드: Jetson에서 직접 제공되는 React 프로그레시브 웹 앱(PWA)입니다.
- 네트워크: 보안 원격 접근을 위한 Tailscale 메시; iPhone에서 Tailscale을 통해 작동합니다.
명령 센터 기능
- 실시간 채팅 인터페이스: AI 에이전트 "Bosefus"와의 직접 채팅.
- 에이전트 대시보드: 14명의 에이전트와 각자의 마지막 작업 및 상태를 표시.
- 트레이딩 데스크: 실시간 Alpaca 포지션 및 암호화폐 손익.
- 크루 실행 기록: 자동화된 모든 작업이 이름별로 기록됨.
- Ollama 모델 상태: Orange Pi 모델 서버의 실시간 상태.
- 빌드 펀드 트래커: 다음 하드웨어 업그레이드를 위한 저축을 추적.
- 푸시 알림: 알림용 WhatsApp을 대체.
대상 사용자
명령줄이나 타사 메시징 앱을 넘어 특화된 UI가 필요한, 특히 여러 에이전트와 트레이딩 연동을 사용하는 OpenClaw AI 에이전트 게이트웨이 개발자.
자료
사용자는 YouTube에서 전체 빌드 워크스루를 공개할 예정이라고 밝혔습니다. 현재는 Reddit 게시물에 아키텍처 및 동기에 대한 세부 정보가 있습니다.
📖 전체 소스 읽기: r/openclaw
👀 See Also
30일간의 프리랜스 비즈니스를 위한 클로드: 효과적인 5가지 프롬프트
한 프리랜서가 30일 동안 매일 Claude를 테스트한 결과, 제안서 작성 시간을 45분에서 5분으로 줄이고, 이의 없이 요금을 30% 인상하며, 콜드 피치 응답률을 3배 높인 5가지 프롬프트를 공유합니다.
OpenClaw 고장 패턴: 28일 동안 발생한 42건의 실제 사례
OpenClaw를 매일 실행하는 개발자가 AI 환각, 인증 고장, 시간을 더 소모하는 자동화 등 8개 범주에 걸친 42가지 구체적인 실패 사례를 기록했습니다. 출처는 Google OAuth 7일 토큰 만료, Opus 4.6이 파일에 원치 않는 메타데이터를 추가하는 사례 등 구체적인 예시를 제공합니다.
단계별 명령어를 통한 구조화된 AI 워크플로우로 재작업 감소
한 개발자가 /pwf-brainstorm 및 /pwf-work-plan과 같은 특정 명령어를 사용하여 프로그래밍 가능한 워크플로우를 공유하며, AI 코딩 시 발생하는 일반적인 문제들(컨텍스트 손실, 표준 위반, 계획/실행 혼합)을 해결합니다. 이 접근법에는 필수 문서 업데이트와 다중 루트 프로젝트 구조가 포함됩니다.
오픈클로: 당신의 궁극적인 빠른 참조 치트시트
OpenClaw의 핵심을 파헤치는 유용한 레퍼런스 치트시트를 살펴보세요. AI 코딩 경험을 간소화하기 위한 핵심 기능과 기능들을 추출하세요.