Responsive Advertisement

Node.js와 Raspberry Pi로 WebSocket을 이용한 RGB LED 제어

앱개발자 찌빠냥
앱개발자 찌빠냥
•

Raspberry Pi와 Node.js를 활용해 RGB LED를 제어하는 프로젝트는 IoT와 실시간 제어 시스템의 기본적인 구성 요소를 학습하는 데 좋은 예시입니다. 이번 글에서는 WebSocket을 통해 웹 브라우저에서 실시간으로 RGB LED의 색상을 제어하는 방법을 설명하겠습니다. 이 프로젝트는 Raspberry Pi의 GPIO 핀을 활용하고, Node.js 서버를 통해 실시간 통신을 가능하게 합니다.

Node.js와 Raspberry Pi로 WebSocket을 이용한 RGB LED 제어


이번 프로젝트는 다음 단계로 진행됩니다:

  1. Raspberry Pi에 Node.js 설치 및 설정
  2. RGB LED 회로 구성
  3. Node.js와 WebSocket 서버 구현
  4. 웹 클라이언트를 통한 실시간 RGB LED 제어

참고로, 이 프로젝트와 관련된 비디오 튜토리얼을 여기에서 확인할 수 있습니다.

1. Node.js 설치 및 설정

Raspberry Pi에 Node.js를 설치하려면, 터미널을 열고 다음 명령어를 입력합니다.

$ curl -sL https://deb.nodesource.com/setup_16.x | sudo -E bash -
$ sudo apt install -y nodejs

이 명령어로 Node.js와 npm을 설치한 후, node -v와 npm -v로 설치 버전을 확인할 수 있습니다.

2. RGB LED 회로 구성

RGB LED는 3개의 핀을 통해 빨강, 초록, 파랑을 각각 제어할 수 있습니다. Raspberry Pi의 GPIO 핀을 사용하여 이 RGB LED를 제어할 수 있으며, 각 핀은 저항을 통해 Raspberry Pi에 연결되어야 합니다.

필요한 재료

  • Raspberry Pi (모델 상관없이 사용 가능)
  • RGB LED 1개
  • 330Ω 저항 3개
  • 브레드보드와 점퍼 케이블

회로 연결

  • RGB LED의 빨간색 핀은 Raspberry Pi의 GPIO 17번 핀에 연결
  • RGB LED의 녹색 핀은 GPIO 27번 핀에 연결
  • RGB LED의 파란색 핀은 GPIO 22번 핀에 연결
  • 각 핀에 330Ω 저항을 연결하여 Raspberry Pi의 전압을 보호
  • LED의 공통 핀(GND)은 Raspberry Pi의 GND 핀에 연결

이제 회로가 준비되었으니, Node.js로 서버를 구현해보겠습니다.

3. Node.js와 WebSocket 서버 구현

RGB LED를 제어할 Node.js 서버를 구현하기 위해서는 onoff 패키지를 사용해 Raspberry Pi의 GPIO 핀을 제어하고, WebSocket을 통해 실시간으로 클라이언트와 통신할 수 있습니다.

1) 프로젝트 디렉토리 생성 및 필요한 패키지 설치

$ mkdir rgb-led-server
$ cd rgb-led-server
$ npm init -y
$ npm install onoff ws

위 명령어로 onoff와 ws 패키지를 설치합니다.

2) Node.js 서버 코드 작성

// server.js

const Gpio = require('onoff').Gpio;
const WebSocket = require('ws');

// RGB LED 핀 설정 (GPIO 17, 27, 22번 핀 사용)
const red = new Gpio(17, 'out');
const green = new Gpio(27, 'out');
const blue = new Gpio(22, 'out');

// WebSocket 서버 생성
const wss = new WebSocket.Server({ port: 8080 });

wss.on('connection', (ws) => {
    console.log('클라이언트가 연결되었습니다.');

    // 클라이언트로부터 메시지를 받았을 때 실행
    ws.on('message', (message) => {
        const rgb = JSON.parse(message);
        console.log('받은 메시지:', rgb);

        // 받은 메시지에 따라 RGB LED 제어
        red.writeSync(rgb.red);
        green.writeSync(rgb.green);
        blue.writeSync(rgb.blue);
    });

    // 연결 종료 시 GPIO 리소스 해제
    ws.on('close', () => {
        red.writeSync(0);
        green.writeSync(0);
        blue.writeSync(0);
        console.log('클라이언트와의 연결이 종료되었습니다.');
    });
});

console.log('WebSocket 서버가 8080 포트에서 실행 중입니다.');

위 코드에서는 WebSocket을 통해 RGB 값을 클라이언트로부터 받아 Raspberry Pi의 GPIO 핀을 제어합니다. 클라이언트가 보낸 RGB 값에 따라 LED의 각 색상이 켜지거나 꺼지게 됩니다.

4. 웹 클라이언트 구현

이제 브라우저에서 RGB 값을 입력해 LED 색상을 제어할 수 있는 간단한 웹 페이지를 만들어 보겠습니다.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>RGB LED 제어</title>
</head>
<body>
    <h1>RGB LED 제어</h1>

    <label for="red">Red:</label>
    <input type="range" id="red" min="0" max="1"><br>

    <label for="green">Green:</label>
    <input type="range" id="green" min="0" max="1"><br>

    <label for="blue">Blue:</label>
    <input type="range" id="blue" min="0" max="1"><br>

    <button id="sendButton">LED 색상 변경</button>

    <script>
        const ws = new WebSocket('ws://localhost:8080');

        document.getElementById('sendButton').addEventListener('click', () => {
            const red = document.getElementById('red').value;
            const green = document.getElementById('green').value;
            const blue = document.getElementById('blue').value;

            const rgb = {
                red: parseInt(red),
                green: parseInt(green),
                blue: parseInt(blue)
            };

            ws.send(JSON.stringify(rgb));  // 서버로 RGB 값 전송
        });

        ws.onopen = () => {
            console.log('서버와 연결되었습니다.');
        };

        ws.onclose = () => {
            console.log('서버와의 연결이 종료되었습니다.');
        };
    </script>
</body>
</html>

이 웹 페이지는 브라우저에서 사용자가 RGB 값을 설정하고, WebSocket을 통해 서버로 전송하여 실시간으로 RGB LED 색상을 변경할 수 있게 해줍니다.

5. 서버 실행 및 테스트

이제 서버와 클라이언트를 실행하여 Raspberry Pi의 RGB LED를 제어해봅시다.

  1. 먼저 터미널에서 server.js를 실행합니다.
$ sudo node server.js
  1. 그런 다음, 브라우저에서 HTML 파일을 열어 LED 색상을 변경할 수 있습니다.

RGB 값을 설정하고 "LED 색상 변경" 버튼을 클릭하면, WebSocket을 통해 Raspberry Pi로 값이 전송되고 LED의 색상이 실시간으로 변경됩니다.

결론

Node.js와 Raspberry Pi를 사용한 WebSocket 기반의 RGB LED 제어 프로젝트는 IoT와 실시간 데이터 처리의 기초를 학습하는 데 매우 유용합니다. WebSocket을 통해 실시간으로 통신하고, Raspberry Pi의 GPIO 핀을 제어하는 방법을 익힐 수 있습니다. 이번 글에서 소개한 프로젝트를 확장하여 다양한 센서 및 장치를 제어하는 시스템을 구축해보세요.

참고로 이 프로젝트와 관련된 비디오 튜토리얼을 여기에서 확인할 수 있습니다.

이전최근

Related Posts

로드 중…

댓글 쓰기