빅코드

HTML5에서 로컬 DB로 사용가능하며,(웹브라우저일 경우 제약이 각각 있습니다... ) 

CouchDB와 편리하게 서버동기화가 가능하도록 마련되어있습니다...

웹이라는 제약은 물론 있지만, cordova를 통해 앱으로 만들 경우 Plugin으로 그 제약을 풀 수 있다는 장점이 있죠...

(인터페이스는 동일)

기존 HTML5의 로컬DB스펙인 WEBSQL은 예전에 SQLITE기반이었던거 같은데... 

아마도 특정 벤더에 종속되는 것을 막기 위해서 그런지.... 

표준화되면서 폐기되버렸네요... ㅡㅡ;

대신 키/밸류 기반의 IndexedDB라는걸 각 브라우저 벤더사에서 각각 제공해주는 듯합니다.

PouchDB는 이러한 춘추전국시대 같은 다양한 환경에서 최적에 상황에 맞도록 셋팅가능하게 합니다.. 아래링크 참조합니다.

https://pouchdb.com/adapters.html

PouchDB를 위한 12가지 프로팁 (읽어볼만하며, PouchDB의 특징도 알 수 있습니다.)

https://pouchdb.com/2014/06/17/12-pro-tips-for-better-code-with-pouchdb.html

- API 레퍼런스는 여기서 확인이 가능합니다.

https://pouchdb.com/api.html

- ES7일 경우 async , await가 사용가능하나,, ES5는 Promise패턴을 이용해야합니다.

-  Mango Query(cf.Mongo DB) 가 가능한 헬퍼 패키지가 있어 사용할 수 있습니다. 

Vue 인스턴스 생성시 최초에, 객체를 주입하고, 이후 각 콤포넌트에서 this.$bucket 으로 접근하는 방식..

https://www.npmjs.com/package/vue-pouch-db

- ibm watson 데이터랩에서 제공하는 Vuejs / PouchDB 튜터리얼 문서입니다.

https://github.com/ibm-watson-data-lab/shopping-list-vuejs-pouchdb/blob/master/tutorial.md

- MongoDB같은 json 문서 DB입니다.. RDB랑 같이 생각해선 곤란....하구요. MongoDB같은 접근법이 필요합니다.

- 테이블 개념이 없네요.. 이것 때문에 좀 헷갈렸는데. DB가 여러개. 문서속에 하위노드나, attach, 연결정보를 추가하도록 합니다.

Vuejs에서 사용시 아래와 같이 사용했습니다.

- 초기 접근

노드 입력시 guid가 필요해서 vuex에  공용 guid생성 함수를 만들어서 사용했습니다.

최초, 로딩되도록 아래 같이 호출합니다.

로드 메소드는 아래와 같이 구성했고..

저장 버튼 눌렀을때 메소드 구현은 아래와 같이 했습니다.

삽질이 있었지만.. 잘됩니다.

웹쪽 기술동향을 알 수 있다는 점에서는 흥미롭네요.