Node.js로 스티밋에서 할 수 있는 것(1): 원하는 작가들의 최신 글 리스트 받기

들어가며

node.js로 작업을 시작한지 꽤 되었다.
그런데 최대 난제를 만나서 진도가 나가지 않았는데, 드디어 정답을 찾은 것 같다.
그동안 개발하면서 얻은 지식을 나누고자 한다.

초보아닌 초보가 진짜 초보를 대상으로 글을 써 보기로 한다.
난 C, C++로는 10년 이상 개발을 한 경험이 있기는 한데, node.js는 처음이라 초보다. 개발 경험이 거의 없는 일반인도 쉽게 이해할 수 있도록(?) 글을 써 볼 예정이다.

그리고 node.js로 스티밋에서 할 수 있는 것들을 적은 글들도 많이 있다. 부록에 몇 몇 글들을 정리해 놓았다.

아직도 node.js는 초보이다 보니, 배워야 할 것이 많이 있다. 특히 UI를 이쁘게 만들기 위해서는 천문학적인 시간을 투입해되기 때문에 사용 방법을 익히는 선에서 기술할 예정이다.

steem.python을 이용하지 않고 node.js를 선택한 이유는 내 노트북에 steem.python이 설치가 되지 않았기 때문이다. 그리고 배포판을 만들 방법을 아직 찾지 못하였기 때문이다. node.js에서도 몇몇 package가 설치가 되지 않는다. 그 이유는 사용자 명이 한글이기 때문이다. 앞으로 컴퓨터 새로 사게 되면 사용자명은 반드시 영어로 해야겠다.

node.js 설치하기

이 주제는 일전에 적은 글이 있어서 대체한다. 아래 글을 참고하시기를.
자동으로 보팅하는 봇 만들어 보기 #2

node. js 를 이용하여 예제 : 원하는 작가들의 최신 글 리스트 읽기

1. project 만들기

아래 그림과 같이 파일/새로만들기/프로젝트를 선택한다.

왼쪽 설치됨 항목에서 "JavaScript"/"Node.js"를 선택한 후 "빈 Node.js 콘솔 .."을 선택한다. 밑에 위치에 대한 정보가 나오는데 일단 무시하고 "확인"을 누른다.

2. 실행해 보기

메뉴에 있는 "디버그"/"디버깅 시작" 을 누른다.

아래와 같이 command 창이 뜨면서 "Hello World"가 찍히면 제대로 설치가 된 것이다.

실행을 종료하기 위해서는 "디버그/디버깅 중단"을 누른다.

3. 스팀 패키지 추가하기

오른 쪽에 있는 솔류션탐색시에서 npm을 오른버튼 클릭을 한 후 "새 npm 패키지 설치"를 누른다.

빈칸에 steem을 입력한 후 찾기 버튼을 누르면 아래와 같이 steem 패키지가 나온다. 첫번째 것을 선택한 후 아래에 있는 "패키지 설치"를 누른다.

그러면 왼쪽 아래 창에 설치 과정이 출력된다. 조금 전에 디버깅을 했었기 때문에 출력보기 선택을 npm으로 변경하여야 npm 설치 내용이 나온다. 아래와 같이 완료되었는지 여부를 확인하여야 한다.

3. 예제 프로그램 가져오기

아래 사이트에 가서 postList.js를 다운 받는다.
https://github.com/multiwhs/steem-js

다운 받은 파일을 visual studio에서 연 후 소스코드를 모두 선택 후 복사한 후 app.js에 붙여넣는다.

4. 예제 프로그램 실행시켜보기

2번에서 설명한 대로 "디버그/디버깅시작"을 선택한다. 혹은 F5를 누른다.

아래와 같이 실행이 되면 성공한 것이다.

5. 코드 이해하기

5.1스팀 패키지를 사용하겠다는 선언
반드시 처음에 있어야 한다.

5.2찾고 싶은 저자 목록
따옴표와 쉼표로 계속 추가하면 된다.

5.3오늘 날짜 가져오기
new Date()를 하면 오늘 날짜를 얻을 수 있다. 그런데 steem.js 함수에서 요구하는 날짜 형태로 전달해주어야 하기 때문에 toISOString()이라는 함수를 사용한다.

toISOString()의 결과 값은 아래와 같다. 우리가 필요로 하는 값은 초 단위까지인데 이 함수는 milisec 까지 돌려준다. 그리고 마지막에 Z라고 하는 timezone 정보도 있다. 이 경우에 문자열을 나누어서 우리가 필요로 하는 값만 뽑을 수 있어야 한다.

우리가 필요로 하는 값은 초단위이므로, "." 을 기준으로 문자열을 나누면 된다. 이렇게 해 주는 함수가 split('.')이다. 즉 "."을 기준으로 문자열을 두개로 쪼개어 주는 역할을 한다.

따라서 beforeDate에 있는 값은 아래와 같은데, split('.') 이후에는 아래와 같이 두개의 배열로 나누어 진다. 우리가 필요로 하는 초 정보인 beforeDate.split('.')[0]을 사용하면 된다.

beforeDate -> "2018-02-01T10:06:33.715Z"

beforeDate.split('.')[0] => "2018-02-01T10:06:33"
beforeDate.split('.')[1] => ".715Z"

5.4작가 수 만큼 루프 돌기
authors에 있는 작가의 수는 authors.length에 들어있다. 이 수 만큼 루프를 돈다.

5.5특정 작가의 최신 글 10개 가져오기
드디어 우리가 관심있는 함수이다.

k가 0부터 작가수 만큼 반복한다. k번째 작가를 입력으로 하고, 두번째는 인자는 무시, 세번째는 날짜, 네번째는 가져올 글 갯수(최대 100)을 입력한다. 검색결과는 오른쪽 끝에 있는 post라는 변수에 저장된다.

5.6 특정 글에 대한 정보 출력하기
post에 몇 개의 글에 대한 정보가 있는지는 post.length에 저장되어 있다. 이 숫자만큼 루프를 돌리면서 필요로 하는 정보를 출력한다. 예제에서는 생성시간, 주제, 링크, 보팅 값을 출력한다.

나가기

초보도 따라 할 수 있도록 글을 쓸려고 했으나, 알아야 할 것들이 너무 많다. 아직 설명할 것들이 많은데, 다음에 기회가 있을 때 언급하도록 하겠다.

최대한 예제를 쉽게 만들어 놓았으니, 간단하게 돌려볼 수 있을 것 같다. 사용하다가 궁금한 사항이나 추가로 필요한
기능이 있으면 댓글로 남겨 주시기를. 나도 초보여서 모든 것을 할 수는 없겠지만 최대한 도와드릴 예정이다.

최신 리스트를 웹 페이지에서 볼 수 있으면 링크를 바로 클릭해서 볼 수 있을 것이다.

사실 이렇게 예제를 만들려고 했는데, 한글이 깨져서 console에 출력되는 것으로 대신했다. 뭔가 할려고 했던 것이 안되면 시간이 무한정 걸려서 끝나는 시간을 예상할 수가 없다. 혹시 node.js로 web 페이지 만들 때 한글 깨지지 않게 하는 법 아는 분 답 부탁합니다. 아래와 같이 했는데 한글이 깨져서 나옵니다.