라즈이노 iOT

이번 게시글은 아래 지난 게시글 핵심노드 설명 4편에 이은 설명입니다.  순서는 크게 상관없지만 다른 노드의 설명과 Node-RED의 기초적인 설명을 참고하려면 맨 앞쪽 링크를 참고해 보세요.

【Node-RED #⑤】노드-레드! 핵심노드 설명 4편/ Core Node Description! #4

①  delay 노드

  delay 노드는 입력 받는 메시지를 일정한 규칙에 따라 지연해서 전달하도록 해주는 노드입니다.

지연 전달하는 몇 가지 조건 설정을 할 수 있는데요,  예를 들어 아래처럼 5초의 시간 delay를 시켜볼 수 있습니다.   확인을 위해 1번 debug 창은 바로 연결하였고,  2번 debug 창은 5초의 시간 delay를 거치도록 하였습니다. 

1. 타임스템프(inject 노드)의 속성 값으로 전달할 적당한 메시지를 아래처럼 작성합니다. 

2. delay 노드의 속성은 아래처럼 해주세요. 

3. 그리고 배포하기를 누르고 Inject 버튼을 누르면 아래처럼 debug 창으로 결과를 확인해 보면,  delay가 없는 출력과 비교해서 5초의 설정에 따라 5초의 delay가 정확히 발생하는 것을 알 수 있습니다.

 delay 속성중에는 방금과 같은 고정 값 지연(Fixed delay) 외에,  일정 범위 값 안에서 랜덤으로 지연시킬 수 있는 속성도 사용 가능합니다.

또한, 기본(default) delay 값으로 예를 들어 3초를 설정하고,  특정 메시지(페이로드) 마다 delay를 다르게 설정하여 구분해 줄 수도 있습니다.  (아래 예시)

먼저,
1. 아래처럼 노드를 구성해 주세요.  

2.  delay 노드의 속성은 아래처럼 "msg.delay에 지연을 설정"으로 바꾸고 시간은 default 값으로 임의로 3초를 지정해 줍니다.

3.  'A' inject노드에는 단순한 전달 메시지만 입력합니다.

4. 'B' inject 노드에는 둘 째줄에 있는 'msg.topic'을  'msg.delay'로 바꿔주고, 속성을 '0~9' number 형식으로 바꾼 다음, delay 값 5000 millisecond (5초)를 입력해줍니다.

5.  결과를 실행해 보면, 'A inject'노드를 눌렀을 때, delay (variable) 노드에 기본 값으로 설정된 3초를 기다린 후 A의 메시지(페이로드)를 debug 창으로 전달(출력)했으며, 

6.  'B inject'노드를 눌렀을 때는 B inject 노드에 설정된 delay 값이 적용되어 5초를 기다린 후 B의 메시지(페이로드)를 debug 창으로 전달(출력)하는 것을 알 수 있습니다. 

7. 그 밖에, delay 노드 사용할 때  inject 노드에서 Reset 기능을 설정할 수 있는데요, 예를 들어, A나 B노드의 inject를 실행하고 설정된 delay 값이 완료되기 전,  Reset inject노드를 누르면 delay가 취소되고 결국 debug창으로 페이로드가 전달되지 않게 됩니다.  (이 실습을 위해 아래처럼 Reset inject 노드를 추가해 주세요)

그리고 리셋(Reset) inject 노드의 속성은 아래처럼 합니다.  일반 inject 노드를 추가해서 두 번째 줄에 있는 msg.topic 항목의 topic 글자를 지우고 reset를 입력합니다.(자동완성 기능 제공)   그리고 속성창에 있는 속성을 Boolean(불린)으로 변경하고, true값으로 설정 확인해 주면 됩니다. 

실습은 먼저 A 혹은 B inject 노드(여기서는 5초로 설정된 B 노드를 클릭)를 클릭 한 다음 5초가 되기 전 Reset inject노드를 클릭하면 delay가 취소되고 debug창으로 아무런 페이로드가 전달되지 않는 것을 볼 수 있습니다. 

8. 아래처럼, 플러쉬(Flush) inject 노드를 추가해 주는데요, 마찬가지로 일반 inject 노드를 추가해서 두 번째 줄에 있는 msg.topic 항목의 topic 글자를 지우고 flush를 입력합니다.   그리고 속성창에 있는 속성을 Boolean(불린)으로 변경하고, true값으로 설정확인해 주면 됩니다.   Flush 기능은 delay 타임이 적용되고 있든 그렇지 않든 클릭하는 즉시 페이로드를 전달시키는 기능입니다. 

지난 시간에는  노드레드를 라즈베리파이 또는 윈도에 설치하는 것에 대해 다루었습니다.  이와 관련하여서는 아래 게시물을 참고해 주세요.
▶【Node-RED #1】라즈베리파이(Raspberry pi)에 Node-RED 설치하기

 이번 시간부터는 본격적으로 노드레드에 대해 알아보고 활용해 보도록 시작해 보겠습니다. 

1. Node-RED의 개념

 노드레드는 플로우(Flow) 즉, 흐름 기반의 프로그래밍으로써 시각적 표현에 매우 적합하고, 복잡하고 어려운 프로그래밍 사용을 자제하고, 사용자가 보다 쉽게 접근할 수 있도록 설계된 모듈입니다.   노드레드에서의 각 노드는 마치 블록코딩의 대명사인 스크래치의 블록과 유사한 개념으로  노드레드는 다수의 노드를 이용하여 각 노드별 원하는 요구사항에 맞는 플로우를 만들 수 있으며 이를 아두이노, 라즈베리파이 및 각종 센서, 디스플레이 등 제어모듈과 같은 하드웨어와 연결하여 시각적으로 보여주거나 제어가능하도록 ioT 시스템을 쉽게 구축할 수 있는 특징이 있습니다. 

아래는 노드레드 Flow 구성 및 편집 예시입니다.

아래는 노드레드 UI 예시입니다.

아래는 노드레드 UI 예시입니다.

아래는 노드레드 UI 예시입니다.

기본 화면 구성은 아래 이미지와 같습니다.

① 노드레드 편집기 화면 구성

노드레드는 크게 4개의 영역으로 구성되는데요,,

→ ① 상단(Header) 영역에는 배포(Deploy) 메뉴와(Deploy) 팔레트관리와 같은 설정 메뉴가 배치되어 있습니다.

→ ② 팔레트(Palette) 영역은 각종 기능 구현해 주는 노드 블록들로 배치되어 있습니다.

→ ③ 측면(Sidebar) 영역은 노드에 대한“정보/도움말/디버그/노드설정”에 대한 메뉴로 구성되어 있습니다.

→ ④ 작업공간(Workspace) 영역은 노드들을 배치하고 이어주며 함수 노드에 프로그래밍을 하는 영역입니다.

① 상단(Header) 영역에 있는 배포(Deploy) 메뉴는 작업공간영역에서 완성된 노드들의 플로우를 실행시키는 역할을 합니다. 만약 UI(User Interface)가 있는 플로우라면 “http://localhost:1880/ui” 주소를 통해서 UI를 확인하거나 실행할 수 있습니다. 그리고 배포하기 옆에 세줄로 표시된 부분을 클릭하면, 라이브러리 추가 등 팔레트관리와 같은 설정 메뉴가 있는데, 제세한 내용은 이후 계속 설명이 됩니다.

② 팔레트(Palette) 영역은 작업영역 좌측에 있으며, 기본적으로 6개 그룹(카테고리)의 메뉴로 구성되어 있습니다. 여기에서 필요한 노드 블록을 선택하여 작업영역으로 끌어다 놓는 식으로 작업합니다. 기본 그룹 외에 추가적으로 팔레트관리 메뉴에 있는 라이브러리 추가를 통해 대시보드(dashboard)나 라즈베리파이(Raspberry Pi) 노드 그룹 같은 것들을 추가해서 사용할 수 있습니다.  
대략 2,700개 이상의 모듈을 추가 설치가 가능하며, 사용자 정의로 직접 모듈을 등록하고 관리할 수 있습니다.

③ 측면(Sidebar) 영역은 노드 편집기 내의 유용한 도구를 제공하는 패널로 구성되어 있는데요, Information탭/Help탭/Debug탭/Configuration nodes탭/Context Data탭/Dashboard탭 , 6개의 탭으로 구성되어 있습니다.

주로 Debug탭을 많이 활용하게 되는데요, 작업공간에서 사용한 디버그 노드의 출력을 확인할 수 있습니다. 측면영역은 작업영역 확보를 위해 숨김/보이기 처리할 수 있으며, (Ctrl+Space) 단축키도 할당되어 있습니다. 가령,  "Hello world!"와 같은 

④ 작업공간(Workspace) 영역은 필요한 노드 블록을 끌어다 놓고 블록들 사이의 플로우(Flow)를 연결하며, 함수 노드의 경우 Javascript로 프로그래밍을 추가해 넣을 수 있는 작업 공간입니다. 노드들을 클릭하면 세부 설정을 변경하거나 코드를 입력할 수 있는 메뉴가 표시됩니다.  노드레드에서 노드는 플로우를 작성하는 기본 구성단위 요소입니다. 

작업공간 상단 우측에 보면 + 표시와 서브메뉴가 보이는데요,  이를 클릭하면 플로우 페이지를 추가하거나 보이기 감추기 등을 할 수 있습니다. 

또한, 불필요한 플로우 삭제는 아래처럼,  플로우를 더블클릭 후 나타나는 메뉴에서 플로우를 삭제할 수 있습니다.

그럼, 사용법을 익히기 위해 먼저 간단한 플로우를 작성해 볼게요.

▶ Hello world ! 문자 출력해 보기

프로그래밍을 배울 때 제일 처음 출력해 보는 것이 “Hello world!”인 것은 이제 국룰? 인데요, 여기서도 그 문장을 출력해 볼게요.

먼저 위 이미지처럼, 공통노드(common node) 그룹에서 inject(타임스탬프)를 플로우 작업화면으로 끌어다 놓으세요.   
그리고, 타임스탬프노드를 더블 클릭하면 설정창이 열리는데, 아래 ②번 부분을 클릭하여 전달할 메시지 타입을 String(문자열)으로 선택합니다. 

그런 다음, 아래 ④번과 같이 "Hello world !" 메시지를 입력하고 완료 버튼을 눌러주세요.

 이제 공통그룹에서 debug 노드를 ⑤ 위치에 끌어다 놓으세요. 

그리고 "Hello world! " 노드 끝에 있는 포인트를 마우스로 드래그하면 연결할 수 있는 주황색 선이 나오는데요,  이를 debug노드의 연결점에 이어 붙여주세요.  (아래 이미지 참조)

각각의 노드 오른쪽에 보면, 파란색 점이 있는 것을 볼 수 있는데요, 이는 현재 새로운 노드가 삽입되었거나, 변경 사항이 발생한 표시이며, 아직 배포(적용)되기 전이라는 뜻입니다.     그럼,  이 상태에서 상단메뉴에 보이는 "베포하기" 버튼을 눌러주세요. 

그럼, 아래처럼 파란색 점이 사라진 것을 볼 수 있습니다.     이제 "Hello world!"라는 전달 내용(payload)을 가진 타임스탬프 노드의 왼쪽 버튼 부분(Inject)을 클릭하면 디버그 노드로 전달이 이루어집니다.   이윽고 우측 Sidebar의 디버그 창으로 "Hello world !"가 출력되는 것을 볼 수 있게 됩니다.    또한, Inject 버튼을 여러 번 클릭하는 만큼 출력이 됩니다.

참고로,  노드레드의 언어 설정은 기본적으로  영어, 독일어, 일본어, 러시아어를 지원하며, 한글도 지원하지만 간혹 한글 표현이 조금 어색한 경우도 있습니다.  
언어 설정 메뉴는 상단메뉴의 "배포하기" 버튼 오른쪽에 있는 삼선을 클릭 후,  창 탭을 클릭하면 나옵니다.

그리고 디버그 창에 출력된 내용이 지저분하거나 하여 삭제하고 싶을 때는 아래 휴지통 버튼을 클릭하면 됩니다. 

참고로 디버그(debug) 노드를 클릭 후 보이는 설정메뉴 하단에 "ㅇ사용가능" 표시가 있는데요, 이를 클릭하면 "Ø사용불가능"으로 표시가 바뀌며,  해당 디버그 노드는 실행을 시켜도 디버그 창으로 메시지 출력이 되지 않도록 사용이 중단됩니다. 

아래 이미지처럼,  해당 노드는 점선으로 처리되며,  Inject 버튼을 눌러도 아무것도 출력되지 않게 됩니다.

 노드의 삭제는 삭제하고자 하는 개별 노드를 선택한 다음 Delete 키로 쉽게 삭제 가능합니다.
노드간 연결된 선도 마우스로 선택 후 Delete 키로 삭제할 수 있습니다. 

그럼  "Node-RED의 시작!" 첫 글은 여기까지 하고,  다음 게시글에서 계속 이어가도록 하겠습니다.