마지막 웹 페이지는 chart.js를 이용해서 멋들어지게 만들고 싶었으나, 프론트는 정말 마지막의 마지막에 완성하면서 하려고 한다. 그래서!!! 이번 글에서는 4. 웹으로 아두이노 데이터 보내기 를 마무리로 해보겠다. 저번 3. 아두이노에서 보내는 데이터는 다른 이름의 socket으로 보내기 에 이어서 웹으로 다른 이름의 socket을 만들어줬다. // index.html의 script부분 html부분에는 div태그 안에 p태그가 있고 그 부분에 온도 값을 표시해주려고 한다. 아두이노에서 랜덤한 값을 데이터로 보내주고, 웹에서 사용하는 'temp'라는 소켓으로 데이터를 보내주기 위해 잠깐 아두이노 코드를 수정해줬다. // Arduino안의 함수 void socketIOEvent(socketIOmessag..

이번 주말에는 일이 있어서 공부를 하나도 못했다. 저번 글 이후로 Socket.io를 계속 공부했었는데 Socket.io는 꾸준히, 탄탄하게 개발되고 있는 좋은 프로젝트 같다. 이번 글에서는 2. Sever에서 DB에 데이터 보내기 3. 아두이노에서 보내는 데이터는 다른 이름의 socket으로 보내기 4. 웹으로 아두이노 데이터 보내기 중에서 2. Sever에서 DB에 데이터 보내기 3. 아두이노에서 보내는 데이터는 다른 이름의 socket으로 보내기 를 해보겠다. 첫 번째 문제점은 서버에서 아두이노로 데이터를 요청할 때, setInterval()말고는 대안이 없었다는 것이었다. 근데 이 setInterval()을 함수로 만들어서 사용하게 되면 setInterval()을 마구 호출했을 때 마치 여러 함수..

앞의 글에서는 Web(mobile) - Sever - Arduino 의 연결을 테스트했다 이번 글에서는 Web에서 입력한 메세지로 Arduino를 제어하는 걸 해보겠다. 오늘의 목표 3. Front에서 websocket에 접근 후 아두이노에 변동사항 적용 여기서 Front라고 함은 브라우저에서 입력한 데이터를 말한다. 연결 방향은 Front에서 입력 -> Server가 다시 클라이언트에 메세지 전달 -> 아두이노가 해석 후 동작 간단하지만 꽤 복잡하다. 우선 기본 틀에서 천천히 보자 Front에서 입력을 하면 Server가 받고 다시 Client에게 보내는 부분 (만약에 받은 msg와 보내는 msg의 형식이 바뀌길 원한다면 io.emit 부분의 msg를 바뀌게 만들면 될 것 같다) 이제 아두이노가 해당 ..

앞의 프로젝트 준비 글에서는 라즈베리파이에서 돌릴 node.js socket.io 서버를 구현했다. 이번 글에서는 그 서버에 접속할 아두이노 Client 부분을 완성해보겠다. ㄷㄷ 목표 2. 아두이노(Client)에서 socket에서 접근 아두이노 보드는 ESP8266이 기본 탑재되어 있는 Wemos D1R1을 사용하고 있다. 5000원 미만에 pin도 넉넉하고 여러 프로젝트에서 사용하기에 편하다. webSocket을 기반으로 Socket.io가 만들어졌고 TCP를 기반으로 webSocket이 만들어졌다는데 사실 잘 모른다 이번 프로젝트에서 사용할 라이브러리는 바로 이 녀석! Markus Sattler 형님의 라이브러리인데 웹소켓 관련 별점이 제일 높다. 찾기 힘들다면 여기로 해서 zip 라이브러리를 추..