SCOUTER 써드파티 UI인 "PAPER" 릴리즈 기념 빠르게 설치해보기

이미 Scouter의 코어나 Web API를 통해서 UI를 만드신다는 소식은 몇 번 접하였고, 몇몇 회사에서는 특정 제품의 APM 엔진으로 사용되거나 또는 기업 내부에서 사용하는 자체 APM으로 개발된 것도 보았습니다만 오픈 소스로 공개된 적은 없었습니다.

드디어 오픈소스로 개발된 스카우터의 첫번째 3rd party UI인 PAPER가 나왔네요.
케빈님 감사합니다!!

호주 케빈님이 아닌 카카오 케빈님 이십니다.
mindplates(마음판??) 또는 beperson(인간이되거라??)이라는 닉으로 주로 활동하십니다.

아 그리고 Paper를 같이 개발하실 분들 대모집 이라고 합니다. 관심 있으신 분들 컨택해 보시길.. 제가 연결해 드릴수도 있습니다.
React로 개발되어 있으니 이쪽 관심있으신 분들이 많이 참여하셨으면 좋겠습니다.(전 UI알못이라...)

출시 기념으로 제가 설치를 한번 해보도록 하겠습니다.

Paper를 사용하기 위해서는 scouter v1.8.4.1 이상을 사용하여야 합니다.

1. scouter demo 설치

여기서는 데모 환경을 설치하며 운영 환경에 설치할 경우는 정식 버전 설치 방법에 따라 설치하여야 합니다.

SCOUTER DEMO를 다운로드하고 압축을 풉니다.

wget https://github.com/scouter-project/scouter-demo/releases/download/v1.8.4.1/demo-env1.tar.gz
...
tar -xvzf demo-env1.tar.gz
...

Scouter Server, Host Agent, 데모 환경(jpetstore)를 차례로 실행시킵니다.

cd ./demo-env1
./start-scouter-server.sh
...
./start-scouter-host.sh
...
./start-tomcat.sh
...

데모 환경에서는 가상의 부하를 줄수 있는 기능이 있습니다. 필요하다면 이를 실행합니다.
5분간 실행되며 종료시 이 script를 다시 실행하면 됩니다.

./start-jmeter.sh

여기서는 OSX 환경 기준으로 설명합니다. demo를 다른 OS 환경에 설치하거나 상세 설치 절차를 보시려면 scouter quick start 가이드를 참고하세요.

데모 환경의 설치 및 기동이 완료되었습니다. 이제 scouter paper를 설치합니다.

2. Paper 설치

Paper의 릴리즈 페이지에서 최신 버전을 다운로드 받습니다.
글을 쓰는 현재 시점의 최신 버전은 1.0.167 이므로 이 버전을 다운로드 받고 압축을 풀도록 하겠습니다.

cd ..
wget https://github.com/mindplates/scouter-paper/releases/download/1.0.167/scouter-paper-v1.0.167.zip
...
unzip -d ./scouter-paper ./scouter-paper-v1.0.167.zip
...
ls -al ./scouter-paper
total 264
drwxr-xr-x   9 gunlee  staff     288  4  7 23:05 .
drwxr-xr-x  13 gunlee  staff     416  4  7 23:05 ..
-rw-r--r--   1 gunlee  staff     780  4  7 02:54 asset-manifest.json
-rw-r--r--   1 gunlee  staff  118026  4  7 02:53 favicon.ico
drwxr-xr-x   5 gunlee  staff     160  4  7 23:05 help
-rw-r--r--   1 gunlee  staff    1030  4  7 02:54 index.html
-rw-r--r--   1 gunlee  staff     332  4  7 02:53 manifest.json
-rw-r--r--   1 gunlee  staff    3687  4  7 02:54 service-worker.js
drwxr-xr-x   5 gunlee  staff     160  4  7 23:05 static

압축을 풀고 해당 내용을 확인해 보면 index.html 파일이 있는것을 알 수 있습니다.

Paper는 정적 웹페이지만으로 구성되어 있으므로 이 디렉토리를 임의의 HTTP 서버(데몬)에 연결하여 서비스하면 됩니다.
HTTP 서버를 하나 더 올리기 귀찮으니 여기서는 그냥 scouter에 내장된 HTTP 서버를 사용하겠습니다.
Scouter 서버가 설치된 위치를 보면 extweb 이라는 디렉토리가 있습니다. 여기에 서비스 할 파일을 넣으면 http://scouter-server:port/extweb/ 으로 접근이 가능합니다.

cp -rf ./scouter-paper/* ./demo-env1/scouter/server/extweb

이제 모든 설치가 완료되었습니다.
브라우저를 열고 설치한 주소로 접근합니다. 데모 환경에서 웹 포트는 6180로 설정되어 있습니다.

• http://localhost:6180/extweb/index.html

3. Paper 설정

Paper 화면에서 SETTINGS 메뉴로 들어갑니다.
Edit 버튼을 누르고 Port가 6188로 되어있는걸 6180으로 변경해 줍니다.
이제 Papers 메뉴로 들어가서 Paper라는 이름에 맞게 종이에 그림을 그리듯 내 입맛에 맞는 성능 대시보드를 구성하시면 됩니다. ^^

• 대시보드 구성은 페이스북에 소개된 동영상을 참고하세요.
• PAPER의 보다 상세한 설치 및 설정 방법은 Paper 공식 문서를 참고하세요.

Paper에서 기본설정이 6188인 것은 Scouter의 webapp(API를 제공하는)의 기본 포트가 6188이기 때문입니다.
6180 포트는 scouter에서 webapp을 독립 실행(standalone mode) 하지 않고 scouter collector 서버에 포함(embedded)된 형태로 실행한 경우의 포트입니다.
scouter webapp은 json 파싱이나 메모리를 많이 사용하는 방식의 bulk성 데이터 처리를 동반하므로, 운영 환경에서 embeded 모드로 webapp을 실행하는 것은 scouter 서버의 데이터 수집에 영향을 줄 수 있어 권장되지 않습니다.
자세한 내용은 scouter web api 가이드를 참고하시기 바랍니다.