Usage Guide
Shawny Dashboard — 전체 기능 가이드
사이드바에서 접근 가능한 모든 페이지. 클릭하면 해당 페이지로 이동.
대시보드 홈. 시스템 상태, 배치 진행률, 메모리 레이어, 최근 세션을 한 눈에 보여줌.
쇼니 에이전트 전체 화면 채팅. 시스템 상태 질의, 브리핑, 복잡한 작업 요청 가능.
OpenClaw, iMessage, Tailscale, GDrive, Cloudflare 각 서비스의 실시간 상태.
배치 작업 큐. 타임스탬프, stale 경고, 의존성 시각화, 알림 상태. 필터/확장 카드.
GDrive 4계층 메모리 (Working→Episodic→Semantic→Procedural→Rules→CLAUDE.md). 레이어 헬스, 승격 플로우, 최근 파일.
에이전트 조직도. 계층 구조, 실시간 활성 상태, 브리핑/메모리 정리/배치 실행 액션 버튼.
지식 그래프 탐색. Word Cloud (pack 레이아웃) + Mind Map (force-directed 물리 시뮬레이션). 드래그/줌 인터랙티브.
시스템 이벤트 타임라인. 배치 완료, 동기화, 보안 이벤트 등을 시간순 표시.
4채널 세션 통합 뷰 (Claude/Gemini/Codex/OpenClaw). 채널 필터, 프로젝트 그룹, 태그, 대화 미리보기.
건강 데이터 대시보드. 걸음 수, 심박수, 수면, 운동, 체중의 7일 트렌드 차트와 수동 입력.
인프라 현황. Cloudflare Workers, KV 네임스페이스, DNS, Tailscale 네트워크 상태.
보안 대시보드. 인증 이벤트, Vault 항목 수, Critical/Warning 알림, 레이트 리밋 상태.
자동 생성 변경 로그. git log 기반으로 빌드 시 generate-changelog.ts가 생성.
웹 터미널. 시스템 명령어 + AI 질의 (ask/shawny 커맨드). 쇼니 에이전트 API로 자연어 질문 가능.
대시보드 설정. 프로필, 인증, 알림, 동기화, 테마. Web Push 설정과 데이터 내보내기.
이 페이지. 대시보드의 모든 기능에 대한 사용법 가이드.
대시보드 내장 AI 어시스턴트. 시스템 데이터 기반으로 답변하고, 복잡한 질의는 OpenClaw 게이트웨이로 라우팅.
접근 방법
• 데스크탑: 우측 하단 플로팅 채팅 위젯
• 모바일: 하단 Agent 탭 또는 플로팅 버튼
• 전체 화면: /agent 페이지
Quick Actions
• "오늘 브리핑" — 배치, 시스템, 메모리 종합 요약
• "세션 현황" — 활성 세션, 프로젝트별 통계
• "메모리 통계" — 레이어별 파일 수, 검색 인덱스
• "배치 상태" — 배치 큐 현황, 다음 대기 작업
• "시스템 상태" — 전체 서비스 헬스체크
동작 방식
• 인증 없이 로컬 키워드 매칭으로 즉시 응답 (배치/메모리/시스템/에이전트/브리핑)
• 복잡한 질의는 OpenClaw 게이트웨이 (127.0.0.1:18789)로 포워드
• 게이트웨이 미응답 시 오프라인 폴백: 로컬 데이터로 최대한 답변
• 대화 세션은 브라우저 세션 스토리지에 유지 (탭 닫으면 초기화)
• 터미널에서도 ask 명령으로 동일 API 접근 가능
Apple Shortcuts로 HealthKit 데이터를 자동 수집하거나, /health 페이지에서 수동 입력.
지원 메트릭
• steps — 걸음 수 (steps)
• heart_rate — 심박수 (bpm)
• sleep_hours — 수면 시간 (hrs)
• workout_minutes — 운동 시간 (min)
• weight — 체중 (kg)
# Apple Shortcuts 자동화 설정
Step 1: 인증 토큰 발급
POST /api/auth/request → access token 발급
scope: health:write
Shortcuts Keychain에 토큰 저장
Step 2: Automation 생성 (iPhone)
Shortcuts → Automation → New → Personal
Trigger: Workout ends / Time of day / App closes
Step 3: Action 구성
1. Get Health Samples (HealthKit)
2. Get Contents of URL (POST)
3. URL: /api/health
# API Endpoint
POST /api/health
Authorization: Bearer <token>
Content-Type: application/json
Body:
{"type":"steps","value":8432,"unit":"steps"}
{"type":"heart_rate","value":72,"unit":"bpm"}
{"type":"sleep_hours","value":7.5,"unit":"hrs"}
{"type":"workout_minutes","value":45,"unit":"min"}
{"type":"weight","value":72.3,"unit":"kg"}
Optional: "date":"YYYY-MM-DD", "notes":"..."
/health 페이지에서 수동 입력 가능. 7일간 트렌드 차트로 시각화.
Safari Web Push로 iPhone, iPad, Mac에 네이티브 알림 전송.
설정 방법
1. Settings 페이지 → Web Push Notifications 섹션
2. "Enable" 버튼 클릭 → 브라우저 알림 권한 허용
3. 구독 완료 후 "Test" 버튼으로 테스트 알림 발송
지원 플랫폼
• iPhone/iPad — Safari (iOS 16.4+)
• Mac — Safari (macOS Ventura+)
• HTTPS 접속 필수
서버 설정 (1회)
VAPID 키 생성: npx ts-node generate-vapid.ts
생성된 키를 Cloudflare Workers 환경 변수에 설정
알림 트리거
• 배치 상태 변경 (완료, 실패)
• 보안 이벤트 (로그인 시도, 레이트 리밋 초과)
• 메모리 유지보수 이슈 (stale, near limit)
/terminal 페이지의 웹 셸. 시스템 조회 명령어 + AI 에이전트 질의를 CLI 스타일로 실행.
help사용 가능한 명령어 목록 표시status시스템 전체 상태 (OpenClaw, iMessage, Tailscale, GDrive, CF, 보안)batch배치 큐 상태 — 완료/대기/실행/실패 건수와 개별 작업 목록agents에이전트 조직 — 역할, 상태, 담당 영역memory메모리 레이어별 파일 수와 설명sessions세션 통계 — 총 수, 활성 수, 프로젝트별 분포ask ...쇼니 에이전트에 자연어 질문 (AI 응답)shawny ...ask의 별칭 — 쇼니한테 직접 물어보기sync마지막 데이터 동기화 시각whoami현재 사용자 정보 (shawny@ai-ops)clear터미널 화면 초기화방향키 ↑↓로 명령어 히스토리 탐색 가능. 터미널 아무 곳 클릭해도 입력 포커스. ask/shawny 명령은 비동기 — 응답 대기 중 입력 비활성화.
빌드 타임에 로컬 시스템에서 데이터를 수집하여 정적 데이터로 번들링.
# 동기화 실행
npm run sync
→ sync-system.ts + sync-sessions.ts
sync-system.ts
로컬 시스템에서 수집하는 데이터:
• OpenClaw 게이트웨이 상태 (PID, 모델, 레이턴시)
• Tailscale 네트워크 (노드 수, Serve 상태)
• GDrive Memory OS (파일/폴더 수, 레이어 구조)
• Cloudflare (도메인, Worker 상태)
• 보안 상태 (Vault 항목, Critical/Warning 수)
sync-sessions.ts (4채널)
• Claude: ~/.claude/projects/*/sessions-index.json
• Gemini: ~/.gemini/tmp/shawn/chats/session-*.json
• Codex: ~/.codex/sessions/YYYY/MM/DD/rollout-*.jsonl
• OpenClaw: ~/.openclaw/agents/main/sessions/*.jsonl
sync-knowledge.ts
alias-graph.yaml 파싱 → Knowledge 그래프 데이터 생성
generate-changelog.ts
predeploy 훅으로 실행. git log 기반 변경 로그 자동 생성.
홈 화면에 추가하면 네이티브 앱처럼 사용 가능. Standalone 모드, 다크 스플래시 화면.
iPhone / iPad
Safari → 공유 버튼 (↑) → "홈 화면에 추가"
Mac
Safari → 파일 → "Dock에 추가"
특징
• Standalone 모드 — 주소창 없이 전체 화면
• 다크 스플래시 스크린, "S" 아이콘
• 오프라인: 정적 에셋 캐시됨, API 호출은 네트워크 필요
모든 API는 인증 필수 (Bearer token). CORS 허용.
/api/agent/chat에이전트 대화 (인증 선택적)/api/health건강 메트릭 기록 (인증 필수)/api/health?from=&to=건강 데이터 요약 (인증 필수)/api/push/subscribe푸시 구독 등록/api/push/send푸시 알림 발송/api/push/status푸시 구독 상태 확인/api/sessions세션 목록/api/sessions/:id세션 상세# Agent Chat
POST /api/agent/chat
Body: {"message":"오늘 브리핑","context":"..."}
Response: {"reply":"...","sources":[...],"suggestions":[...]}
Rate limit: 20 req/min per user
# Health Log
POST /api/health
Body: {"type":"steps","value":8432,"unit":"steps","date?":"YYYY-MM-DD","notes?":"..."}
Response: {"ok":true,"date":"2026-03-08","type":"steps","entries":1}
Storage: KV health:{date}:{type} — TTL 1 year
# Health Summary
GET /api/health?from=2026-03-01&to=2026-03-08
Response: {"days":[...],"latest":{...},"from":"...","to":"...","count":7}
steps, workout_minutes → sum / 나머지 → average
Cloudflare Workers + Vinext (Vite SSR) + React 19 + Tailwind 4 기반 풀스택 대시보드.
Tech Stack
• Runtime: Cloudflare Workers (Edge)
• Framework: Vinext (Vite SSR)
• UI: React 19 + Tailwind CSS 4
• Font: SF Mono / JetBrains Mono
• Icons: lucide-react
• Design: Dark zinc palette, glass morphism
Authentication
• CF Access Email OTP → JWT ES256 (WebCrypto)
• TOTP RFC 6238 지원
• Access Token TTL: 15분
• Refresh Token TTL: 7일
Storage
• Cloudflare KV (AUTH_STORE)
• 인증 토큰, 푸시 구독, 건강 데이터 저장
• 정적 데이터는 빌드 시 번들링
# Deployment
npm run deploy
1. predeploy → generate-changelog.ts
2. sync → sync-system.ts + sync-sessions.ts
3. vinext build
4. wrangler deploy