15개 툴의 파편화를 해결한 Electron 기반 통합 보안 커맨드 센터

Context

보안 분석 시 15개 이상의 브라우저 탭과 터미널, 노트 앱을 동시 사용. 잦은 컨텍스트 스위칭으로 인한 작업 효율 저하 발생. 개별 도구의 파편화된 정보를 통합 관리할 단일 인터페이스 부재.

Technical Solution

• React Context 기반의 Quad-Split Pane 설계를 통해 4개 독립 영역의 동시 렌더링 및 가변 레이아웃 구현
• Supabase Realtime과 Singleton 채널 매니저를 결합하여 중복 구독을 방지하는 효율적인 실시간 위협 피드 동기화 구조
• 11단계 상태 컬럼을 가진 Kanban 보드에 HTML5 Native DnD를 적용하고 Optimistic UI 전략으로 사용자 경험 최적화
• xterm.js와 node-pty를 통합하여 데스크톱 앱 내에서 tmux 지원이 가능한 풀 기능 터미널 환경 구축
• SSH 및 Gateway API를 통한 원격 VPS Agent Swarm 제어로 분산된 AI 에이전트의 결과값을 대시보드에 통합 수집
• NVD 및 Shodan API 병렬 쿼리를 통해 CVE 정보를 수집하고 개인 DB에 저장하는 통합 데이터 파이프라인 설계

Key Takeaway

복잡한 도구 체인을 단일 인터페이스로 통합할 때 상태 관리 Context와 실시간 데이터 싱글톤 패턴을 통해 리소스 낭비를 최소화하고 작업 흐름의 연속성을 확보하는 설계 방식.