DevTrend 프로젝트를 진행하기 위해 고려할 사항이 여러가지가 있겠지만, 그 중에서도 특히 고민해야 했던 부분은 데이터를 어디서 어떤식으로 가져오고, 가져온 데이터를 어떤 방식으로 사용자들에게 보여줄 지를 결정하는 것이었다.
최신 트렌드, 즉 사람들이 최근에 많이 사용하고, 활성화되어 있는 커뮤니티를 가지고 있는 기술을 어떻게 알 수 있을까를 줄곧 고민해보았고, 공개 API를 사용하는 방향으로 결정을 했다. 그 다음엔 어떤 서비스의 API를 사용할 지 고민했는데, 구글이나 깃헙 등 여러 선택지 중에서 개발자들 간의 의견교환이 가장 활발하다고 느끼는 Stack Overflow API를 한 번 검토해 보기로 결정했다. 열심히 알아본 결과, stack overflow는 SEDE(Stack Exchange Data Explorer)라고 불리는 서비스를 제공하고 있었다. SEDE는 stack overflow가 가지고 있는 데이터에 대해서 사람들이 sql 쿼리를 날려 원하는 정보를 얻을 수 있도록 하는 서비스다.
이와 같이 임의의 sql query 문을 작성해 api를 쏘면 아래와 같이 결과를 뱉는다.
그리고 이를 data explorer 사이트에서뿐만 아니라 외부에서 api의 형태로는 데이터를 어떻게 주고받을 수 있을 지 찾아보았는데 원하는 답을 얻지 못했다... 그래서 어떤 uri로 어떤 형태의 http request를 날리고 있는 지 직접 뜯어보았고, 알아낸 대로 postman에서 api를 날려본 결과 원하는 데이터를 얻을 수 있었다!!
api의 형태로 데이터를 주고 받을 수 있다는 것을 확인했으므로, 이 서비스를 DevTrend 프로젝트에 사용할 것으로 확정할 수 있었다. 그리고 그 다음으로는 위와 같이 받아온 데이터들을 어떤 형태로 뿌려줄 지를 결정해야 했는데, pie chart와 bubble chart의 형태로 visualization을 구현하기로 결정했다. 이들을 사용하기로 결정한 특별한 이유는 사실 딱히 없고, 단지 만드는게 재밌고 또 예쁠 것 같아서이다ㅎㅎ.. pie chart는 canvasJS를 이용하고 bubble chart는 d3를 이용해서 만들 수 있다는 것을 알았고, 아래와 같이 연습용으로 작은 리액트 컴포넌트들을 만들어 보았다.
(pie chart)
(bubble chart)
결론
데이터를 받아오는 것은 SEDE api와 sql query를 이용해서 받아오기로 결정하였고, 데이터를 띄우는 것은 canvasJS와 d3를 이용하기로 결정하였다. 대략적으로 사용할 서비스와 기술 스택을 정했으니, 이제부터 개발을 본격적으로 시작할 것이다.
