Prototype/IoT Platform

 

 

아래 게시글의 ThingPlug 대시보드는 Local PC에 node.js 서버를 구동해서 만든 대시보드였다.

http://1byte.tistory.com/10

 

그렇기 때문에 외부에서 접근하기 위해서는 port forwading 등 서버 port에 접속하기 위한 별도의 작업이 필요하고, Local PC에서 서버를 구동하고 있는 동안에만 접속할 수 있다.

 

따라서, 위 문제점등을 해결하기 위해서 외부에서 호스팅 해주는 방법이 필요해 보였다.

 

구글링 결과, Heroku라는 클라우드 플랫폼을 선택했다. Heroku는 테스트 용도로 적합해 보이며, 꽤 쉽게 어플리케이션을 호스팅 할 수 있었다.

 

 

1. ThingPlug Starter Kit 소스코드 다운로드

 

https://github.com/SKT-ThingPlug/thingplug-lora-starter-kit

 

우선 ThingPlug Lora Starter Kit을 다운 받았다. Starter kit의 사용 방법은 PC에 starter kit 소스코드와 node.js를 다운로드 받고, config_x.js 파일에 테스트할 node id, user key, container 등등 ThingPlug web Application에서 필요한 정보들과,  디바이스 시뮬레이터를 실행 시키기 위한 config 내용들이 모두 포함되어 있다.

그렇기 때문에 config_x.js 에 node id, user key, container등의 정보가 정상적으로 저장되어 있어야만 최신 데이터 조회, 디바이스 제어 등을 수행할 수 있다.

 

2. ThingPlug Starter Kit 소스코드 수정

 

제공하는 StarterKit도 쓸만하지만, 여러 사용자들이 Config 파일과 상관 없이 접근 가능한 대시보드를 만드는 것이 목표였기 때문에,, 조금 StarterKit의 소스코드를 조금 수정했다.

 

      

왼쪽의 서버 소스코드를 오른쪽 처럼 Node ID, User Key, Container Name 을 직접 입력 받도록 수정했다.

이 과정에서 필요 없는 부분인 google 지도와 Event trigger를 없앴다.

https://github.com/wpgnss/ThingPlug_starter_kit_for_academy

 

 

3. Heroku 사용하기

Heroku에서 어플리케이션을 배포하기 위한 방법은 3가지를 지원한다.

Heroku CLI를 다운로드 받아서 Heroku Git에 소스코드를 업로드 하는 방법과 GitHub나 Dropbox에 소스코드를 업로드 후 연결하는 방법이 있다.

 

Heroku CLI를 사용하는 방법은 구글링에도 많이 나오기 때문에, 머리아픈 CLI 없이 GitHub와 연동하는 방법으로 해보기로 했다.

 

4. Heroku 사용하기 – Procfile

 

Heroku를 사용하기 위해서 자신의 ThingPlug StarterKit repository에 꼭 필요한 파일이 있다. Procfile이라는 파일이다. 해당 파일을 생성 후 commit & push 해주자.

이 파일은 처음 실행되어야 할 web app의 이름을 정의하는 파일이다.

 

ThingPlug Starter Kit의 메인 js 파일은 application_web.js이니까 아래처럼 작성해 준다.

 

web: node application_web.js

 

 

5. Heroku 사용하기 – Create New App

https://dashboard.heroku.com

Heroku에 가입 후 dashboard 사이트에 접속하게 되면 오른쪽 상단에서 New->Create new app을 선택한다.

 

Create App을 선택한다.

 

GitHub를 선택한다. (이미 GitHub와 연동되었기 때문에 아래처럼 나오지만 처음이라면 GitHub에 권한을 요청하는 팝업이 뜬다.)

 

Search를 클릭한 후 원하는 Repository에 Connect를 누른다.

 

Enable Automatic Deploys 를 누른다.

 

정상적으로 진행했다면, Overview 탭에서 Dyno formation 에서 web node application_web.js    ON 으로 변하면서 서버가 정상 동작하게 된다.

만약 Dyno formation이 바뀌지 않는다면, Manual deploys로 해보자.

 

 

Open app을 누르면 동작 중인 서버에 접속할 수 있다.

 

이렇게…

 

 

사이트 주소 뒤에 /dashboard 를 입력하면 SKT ThingPlug 대시보드가 정상적으로 동작하는 것을 확인할 수 있다.

https://boiling-everglades-36951.herokuapp.com/dashboard/