15주차-Node‐RED - boguuu/SmartDevice_2025-1 GitHub Wiki

Node-RED


Node-RED는 IBM에서 개발한 오픈소스 시각적 프로그래밍 도구로, 다양한 하드웨어 장치, API, 온라인 서비스를 손쉽게 연결할 수 있도록 설계된 플로우(Flow) 기반 개발 환경. 주로 사물인터넷(IoT) 애플리케이션 개발에 최적화되어 있으며, 복잡한 코딩 없이도 데이터 흐름을 시각적으로 설계하고 자동화할 수 있음.

주요 특징


특징 설명
🔧 비주얼 플로우 설계 마우스로 노드를 드래그 & 드롭하고 연결하여 프로그래밍
🌐 브라우저 기반 웹 브라우저에서 편리하게 플로우를 작성하고 수정
🧱 노드(Node) 단위 구성 입력, 처리, 출력 기능을 가진 블록(노드)을 조합
🔁 이벤트 기반 동작 이벤트(데이터 수신, HTTP 요청 등)가 발생하면 플로우 실행
🧩 확장성 다양한 노드를 설치하거나 사용자 정의 노드/함수를 작성 가능
🤝 다양한 시스템 연동 MQTT, HTTP, WebSocket, 데이터베이스, 파일 등과 연동 가능

구성 요소


  • 노드(Node): 데이터 입력, 처리, 출력 등 다양한 기능을 수행하는 블록 단위의 컴포넌트
  • 플로우(Flow): 여러 노드를 연결해 데이터가 흐르는 경로와 처리 과정을 정의한 논리적 단위
  • 런타임: Node.js 기반으로 동작하며, PC, 서버, 라즈베리파이 등 다양한 환경에서 실행할 수 있음

⚙️ 동작 원리 (간단 요약)


  1. Node.js 기반으로 설치됨
  2. 각 기능을 수행하는 **노드(Node)**를 연결하여 플로우(Flow) 구성
  3. 사용자가 브라우저에서 플로우를 설계하고 실행
  4. 이벤트가 발생하면 msg 객체가 노드를 따라 흐름
  5. 데이터가 처리되고 외부로 전달됨 (예: DB 저장, API 응답 등)

이벤트 드리븐


Node-RED는 이벤트 드리븐(Event-Driven) 방식으로 작동

즉, 외부에서 어떤 **이벤트(HTTP 요청, 센서 입력, MQTT 메시지 등)**가 발생하면, 그에 반응하여 설정된 플로우가 자동으로 실행. 이때 데이터는 msg 객체로 전달되며, 각 노드는 이 msg를 처리하거나 변형하며 다음 노드로 넘김.

[입력 이벤트 발생] → [노드 간 msg 전달] → [가공 및 출력]
💡

이러한 방식은 비동기적이고 논블로킹 구조이기 때문에, 빠르게 반응하고 동시에 여러 작업을 처리할 수 있음

💻 작동 환경


Node.js 환경에서 작동, 개발 언어: JavaScript (백엔드 Node.js)

자바스크립트는 원래 브라우저에서 사용하는 인터프리터 언어이지만, Node-RED는 이를 브라우저가 아닌 서버나 PC 등 일반 컴퓨터에서 실행되도록 Node.js를 활용

즉, Node-RED를 사용하려면 다음과 같은 환경이 필요:

  1. Node.js 설치
  2. Node-RED 설치 (Node.js 위에서 구동됨)
  3. 브라우저를 통해 Node-RED 편집기 접속
📌

Node-RED는 다양한 운영체제(OS)에서 작동하며, 설치 후 로컬 서버를 통해 브라우저에서 편집기에 접속하여 플로우를 구성할 수 있음.

Node-RED 실습


Node.js 설치


homepage

  1. Node.js 홈페이지(https://nodejs.org/en/) 접속 → 다운로드 및 설치
  2. 관리자 권한 명령 프롬프트 실행
  3. "node-red" 입력 → URL 실습 페이지 실행

image

image 1

inject 노드 실습


image 2

inject와 debug 노드들을 가져와 연결

image 3

노드를 클릭하여 이름 및 정보를 수정할수 있음

image 4

066b8931-47dc-4cce-8ce1-81df0c240acd

💡

inject노드 수정칸에서 현재 년 일 월 출력 설정후 배포시 디버그창에서 현재 시각이 나오는 것을 확인

image 5

image 6

👉

메세지 자동 생성 기능 3초마다 → 설정후 배포

메시지 객체 출력


inject노드를 아래와 같이 설정

image 7

디버그 출력을 object로 변경

image 8

배포 결과

image 9

각 속성값 전달


inject노드 아래와 같이 설정

image 10

debug노드 하나 추가 생성 후 아래와 같이 설정

image 11

배포 결과

image 12

debug3 설정

image 13

배포 결과

image 14

image 15

👉

각 debug노드 오른쪽 녹색 버튼을 통해 활성 여부 설정 가능!

image 16

function 노드


inject, debug, function 노드 활용

image 17

문자열 변경


inject노드 설정

image 18

function 노드 설정

image 19

배포 결과

image 20

👉

function 노드가 없을 경우 “안녕!” 출력

덧셈처리


inject 노드 설정

image 21

function 노드 설정

image 22

배포 결과

image 23

image 24

⚠️ **GitHub.com Fallback** ⚠️