📊 로봇 상태를 한눈에 보는 대시보드, 코딩 없이 만들 수 있어요
여러분, 로봇을 운영하다 보면 이런 생각 들지 않으세요? "지금 로봇 배터리가 얼마나 남았지?", "센서 데이터가 정상인지 어떻게 확인하지?", "여러 대 로봇을 한 화면에서 모니터링할 수 있으면 좋겠는데..." 이런 고민을 한 방에 해결해주는 도구가 있어요. 바로 Node-RED예요.
Node-RED는 드래그 앤 드롭으로 데이터 흐름을 만들 수 있는 비주얼 프로그래밍 도구예요. 코딩을 거의 하지 않고도 로봇 모니터링 대시보드를 뚝딱 만들 수 있죠. 오늘은 이 도구로 IoT 로봇 대시보드를 처음부터 만드는 과정을 알려드릴게요.
📌 Step 1 — Node-RED 설치하기
Node-RED는 Node.js 기반이라 먼저 Node.js를 설치해야 해요. nodejs.org에서 LTS 버전을 다운받아 설치하세요.
그다음 터미널에서 아래 명령어를 실행하면 끝이에요.
npm install -g node-red
설치가 끝나면 터미널에 node-red라고 입력하세요. 브라우저에서 localhost:1880으로 접속하면 Node-RED 에디터가 열려요. 여기까지 5분이면 충분해요! 💡
📌 Step 2 — 대시보드 플러그인 설치하기
기본 Node-RED에는 대시보드 기능이 없어요. 우측 상단 메뉴 → "팔레트 관리" → "설치" 탭에서 node-red-dashboard를 검색해서 설치하세요. 이 플러그인이 게이지, 차트, 버튼, 텍스트 등 대시보드 UI 컴포넌트를 제공해요.
설치가 끝나면 왼쪽 패널에 dashboard 카테고리가 추가돼요. 여기서 필요한 UI 컴포넌트를 드래그 앤 드롭으로 배치하면 돼요.
📌 Step 3 — 로봇 데이터 연결하기
대시보드에 표시할 데이터를 연결해야 해요. 로봇에서 데이터를 보내는 방법은 여러 가지인데, 가장 쉬운 건 MQTT 프로토콜이에요. IoT에서 가장 많이 쓰이는 경량 메시징 프로토콜이거든요.
Node-RED에는 MQTT 입력 노드가 기본 내장되어 있어요. 로봇이 MQTT 브로커에 배터리 잔량, 속도, 위치 데이터를 보내면, Node-RED가 이를 받아서 대시보드에 표시하는 구조예요.
테스트용으로 공개 MQTT 브로커인 broker.hivemq.com을 사용하면 별도 서버 설정 없이 바로 테스트해볼 수 있어요.
📌 Step 4 — 대시보드 UI 구성하기
이제 본격적으로 대시보드를 꾸며볼게요. 로봇 모니터링에 필수적인 요소를 하나씩 만들어볼게요.
첫째, 배터리 게이지예요. gauge 노드를 추가하고, MQTT에서 받은 배터리 데이터를 연결하면 실시간으로 배터리 잔량이 표시돼요. 빨강-노랑-초록 색상으로 상태를 한눈에 파악할 수 있어요.
둘째, 센서 차트예요. chart 노드를 추가하면 시간에 따른 센서 데이터 변화를 그래프로 볼 수 있어요. 온도, 거리, 속도 데이터를 실시간 라인 차트로 표시하면 로봇의 상태 변화를 직관적으로 파악할 수 있죠.
셋째, 제어 버튼이에요. button 노드를 추가하면 대시보드에서 로봇에게 명령을 보낼 수 있어요. "전진", "후진", "정지" 버튼을 만들고, 클릭하면 MQTT로 명령을 전송하는 거예요.
넷째, 로봇 위치 맵이에요. worldmap 노드를 설치하면 로봇의 GPS 좌표를 지도 위에 실시간으로 표시할 수 있어요. 야외 로봇이나 배달 로봇 모니터링에 딱이에요.
📌 Step 5 — 알림 시스템 추가하기
대시보드만으로는 24시간 모니터링이 어려우니까, 이상 상황이 발생하면 알림을 보내는 기능을 추가해볼게요.
switch 노드로 배터리가 20% 이하이면 경고 플로우로 보내고, email 노드나 Telegram 노드로 알림을 전송할 수 있어요. "로봇 A의 배터리가 15%입니다. 충전이 필요합니다" 같은 메시지가 핸드폰으로 날아오는 거예요. 🔔
🔧 더 발전시키는 방법
기본 대시보드가 완성됐다면 여러 방향으로 확장할 수 있어요. AI 연동으로 센서 데이터 이상 징후를 자동 감지하고, 여러 대 로봇의 데이터를 하나의 대시보드에서 탭으로 구분해서 보여주고, 데이터베이스 연동으로 과거 데이터를 저장하고 분석하는 것도 가능해요.
Node-RED는 플러그인이 수천 개라서 거의 모든 기능을 코딩 없이 구현할 수 있어요. ChatGPT에게 "Node-RED에서 이런 기능을 만들고 싶어"라고 물어보면 어떤 노드를 쓰면 되는지 알려줘요.
✅ 마무리
Node-RED로 로봇 대시보드를 만드는 건 생각보다 훨씬 쉬워요. 코딩 없이 드래그 앤 드롭만으로 실시간 모니터링 시스템을 구축할 수 있으니까요. 로봇 프로젝트를 하고 계신다면 오늘 바로 Node-RED를 설치해서 시작해보세요. 결과물을 댓글로 공유해주시면 함께 발전시켜봐요! 🚀
'사용법 튜토리얼' 카테고리의 다른 글
| 코딩 없이 AI 로봇 팔 제어가 된다고? MoveIt 비주얼 튜토리얼 (0) | 2026.03.30 |
|---|---|
| 따라만 하세요! OpenCV와 AI로 로봇 라인 트레이싱 구현하기 (0) | 2026.03.30 |
| 이것만 따라하세요! GPT로 로봇 음성 명령 시스템 간단 구축하기 (0) | 2026.03.27 |
| 10분이면 끝! ChatGPT로 로봇 프로젝트 기획서 뚝딱 만들기 (0) | 2026.03.27 |
| 따라만 하세요! Teachable Machine으로 나만의 AI 로봇 손동작 인식기 만들기 (0) | 2026.03.27 |