[WebApp] google fit imitation 만들어 보기 - 1

web app 으로 google fit imitation app 을 만들어 만들기로 한다.
다음과 같은 것들을 배우기 위해서이다.

1. web app 의 전체 구조
2. java script 의 기본
3. java script 의 여러 library 사용 방법
4. js 와 native code 의 연동
5. google fit rest api

기본 시나리오는 아래와 같다.

1. Main 화면

오늘의 운동량을 pie chart 형식으로 표시한다.

pie chart 하단에 과거의 운동량이 list 형태로 표시된다.

사용자는 list item 을 선택해서 특정 날짜의 detail 정보를 볼 수 있다.

2. Detail 선택 화면

line graph 로 시간대별 운동량을 확인 할 수 있다.

graph 에서 특정 시간대를 선택하면 화면 하단에 해당 시간에 맞는 추가 정보가 text 형태로 표시된다.

Block diagram

Webview : front ui(기본 html)
JavaScript : Jquery/JsChart 를 이용한 기본 UI engine, Data store 의 data  를 가져오는 역할
Data store : google server 에서 가져온 data를 보관한다. 당장은 memory cache.
RestApiAdapter : rest api 를 이용하여 data 를 가져온다.  gson/retrofit 을 이용하여 json data 를 parsing 해서 Data store 에 넘겨준다.

다음에 할 일
- 전체 와꾸 잡기
- sign in 하기
- data 1개 뿌려보기