Mobile Convergence

"엑셀로 통계 차트 그리기 어렵다" 

"쉽고 빠르게 이동평균 선을 보고 싶다"

왜?

End User가 모니터링 중인 미들웨어(JBoss)에 대한 Resource Usage/TPS/Response Time등의 분기별 통계 정보를 요구한다. 3개월 또는 6개월 단위 raw data를 그냥 엑셀에 담아서 전달하는 것은 의미가 없고, 엑셀의 차트를 그려도 일정한 패턴을 찾기 어렵지 않을까 생각되어 이동평균선 차트를 만들어서 전달해 주기로 하였다. Raw Data는 엑셀파일로 export가 되므로 .csv 확장자로 파일을 업로드하면 바로 이동평균 차트가 나오는 서비스를 만들어 널리 편히 쑤메 그 패턴(우상향, 우하향)을 인지하여 미들웨어가 정상적으로 운영되고 있는지 장기적인 관점(Capcity Plan)에서 판단근거를 세우고자 한다

들어가면서

  - 비즈니스 모델 캔버스 : 이런건 작성안함. 내가 필요해서 하는 서비스임. 

  - Lean Development : Agile Scrum방식으로 진행을 한다. 빠르게 만들고 배포하고 피드백받아 학습하면서 고도화해 간다 

    + 도구로 Trello을 사용할 예정이며 간략히 Specification(SRS)도 이곳에 정리한다 

    + Public 저장소로 GitHub을 사용하고, GitHub Commit때 마다 Travis를 통하여 지속적인 배포를 한다  

  - Lean UX : Service Desgin 에 대해서 조금 접근해 본다. 

    + 누군가 같이 할 수 있다면(3명가량) 서비스 디자인 툴킷 사용해서 워크샵 해보고 싶다 

  - RWD : Responsive Web Design (반응형 웹) 을 통해 다양한 스마트 기기에서 볼 수 있도록 한다 

  - 그동안 검토한 기술과 환경들에 대한 파일럿 성격의 서비스 구현체를 만들어 보는데 의의가 있다

어떻게 

  - SPA : Single Page Application으로 만들것이다. SPA Framework으로 AngularJS를 사용한다 

  - MEAN : MongoDB + Express + AngularJS + NodeJS를 기술스택으로 사용한다 

  - Yeoman : Yeoman의 scafolding 기능을 통하여 SPA 환경을 최초에 구성하고 개발할 것임 (include Grunt, Bower)

  - D3.js : Data Driven Documents Framework을 기반하여 HTML5의 svg를 이용한 차트 라이브러리인 NVD3.js 를 사용한다 

  - Heroku : PaaS에 서비스를 올려서 공개한다 

  - 서비스 소개는 GitHub에 프로젝트 Page를 만들어서 공개한다. 소스도 물론 퍼블릭 공개한다 

  - 서비스 진행과정은 블로그에 정리하고 SPA 초기 개발하는 분들이 참조토록 한다 

무엇을

  - Smart Visualization : 엑셀 수치 데이터를 이동평균 차트로 보여주는 서비스 

향후 하고 싶은 것

  - 다양한 통계 정보를 자동으로 차트에 표현해 보고 싶다 

  - Hadoop을 이용하여 BigData 연산 배치 처리 결과를 차트로 표현해 보고 싶다 

Mobile 서비스 개발을 위하여 JavaScript 기반의 기술 스택을 선택하여 사용하다 보니 1년사이에 MongoDB, Express.js, Angular.js, Node.js를 공부하고 솔루션에 적용하게 되었다. 그간 해당 기술들을 추상화한 프레임워크들을 사용하여 개발을 진행해 왔다. 그러나 가끔 풀리지 않는 문제에 대한 근원적인 해결책을 찾는데는 다시 처음부터 추상화 내역에 대한 이해가 바탕이 되지 않으면 풀리지 않았다. 

즉, 기본 스택을 추상화한 스택사용시에는 추상화 영역에 대한 사용경험과 전반적인 이해가 없이는 오히려 시간공수만 더 늘어나는 격이 된다. 예로 Express와 MongoDB를 좀 더 수월하게 사용키위하여 Trains, Sails Framework들을 사용해 보았고 나름의 장점은 있으나 왠지 남의 옷을 입은듯한 느낌이랄까? 문제 발생시 빠른 대응이 어려웠다 (개인적으론 Trains Framework의 Node.js단의 IoC 방식을 좋아한다)

따라서 소규모 팀으로 개발하면서 하나의 가치를 빠른 시간안에 전달하고자 한다면 기본 Stack기반으로 진행하면서 필요한 시점에 스스로 추상화 모듈을 만들어 사용하는 방법이 좋지 않을까 생각한다. (Don't Invent Wheel 이니 초기엔 쓸만한 것을 GitHub에서 찾아 응용하고 없으면 개발하자) 그런 의미에서 mean.io 에서 기본 Stack에 충실하면서 현재 사용되는 최신 개발 기술들 - Jade, Bootstrap, Mongoose, Bower, Grunt 같은 - 도 함께 접목되어 적당히 어려운 상태이므로 개발시 집중(Flow)을 가능케 하는 구조를 가지고 있다. (너무 어려우면 흥미를 읽고, 너무 쉬우면 긴장감이 떨어진다. 적당히 어려우면 흥미와 긴장감을 주어 개발시 집중을 가능케 한다) 

1. 설치

  - 홈페이지에서 zip 파일 다운로드 

  - 프로젝트로 이동해서 

2. 접속 

  - http://localhost:3000/

    + Sign Up 할 수 있다

    + 테스트 글을 CRUD 할 수 있다 

  - MongoDB 

해당 스택을 통해 SPA(Single Page Application) 개발에 대한 Lean(신속한) 스타트업을 시도하자.

<참조>

  - mean.io