라파엘 우골리니는 현재 벨기에 브뤼셀의 파모코에서 근무하는 풀스택 소프트웨어 개발자입니다. 그는 10년 이상 소프트웨어 개발 분야에서 일해 왔으며 최근에는 웹 솔루션 설계와 Python 및 Javascript를 사용한 개발에 주력하고 있습니다. 트위터, LinkedIn, Github
소개
이 글에서는 다음과 같이 제안하려고 합니다. 오프라인 우선 다음을 사용하여 개발 카우치베이스 를 백엔드와 프론트엔드 간의 커뮤니케이션 도구로 사용하세요.
리액트-리덕스를 공부하면서 정말 마음에 들었던 것은 비동기 작업 패턴이 있는 곳입니다:
|
1 2 3 4 5 |
{ type: 'FECH_POSTS_REQUEST' } { type: 'FECH_POSTS_FAILURE', error: 'Oops' } { type: 'FECH_POSTS_SUCCESS', response: { ... } } |
카우치베이스에 대해 조금 더 이해하고 나면 카우치베이스 동기화 게이트웨이이 패턴을 적용하면 앱의 모든 통신과 모든 기능을 갖춘 오프라인 앱을 Couchbase가 처리하도록 할 수 있으며, 앱의 현재 상태를 기반으로 페이지를 실제로 렌더링하기 때문에 매우 우수한 사용자 경험을 제공합니다.
어떻게 작동하나요?
애플리케이션
애플리케이션 자체는 백엔드에 대한 호출을 수행하지 않으며, 상태를 저장하고 렌더링하는 것만 담당하므로 오프라인에서도 모든 기능을 갖춘 앱을 작동시킬 수 있습니다.
카우치베이스 라이트/싱크 게이트웨이
카우치베이스 라이트 는 앱의 현재 상태를 다음 주소로 동기화할 책임이 있습니다. 카우치베이스 동기화 게이트웨이 를 사용하여 백엔드에서 문서가 업데이트되면 새 정보를 검색할 수 있습니다.
웹 후크
카우치베이스 동기화 게이트웨이가 필터와 일치하는 문서를 수신하면 업데이트해야 하는 문서가 있는 웹 앱에 HTTP 호출을 수행합니다.
웹 앱
웹 앱은 다음과 같은 모든 종류의 업데이트를 수행할 수 있습니다:
- 작업 대기열에서 새 작업 만들기
- 외부 API에서 데이터 검색
- 일부 데이터/이미지 분석(예: OCR)
실습
이 개념이 어떻게 작동하는지 설명하기 위해 특정 문서를 저장하면 웹 애플리케이션이 무작위 스타워즈 캐릭터를 가져와 문서를 업데이트하는 작업을 수행하는 간단한 예제를 개발했습니다.
이 예제를 실행하는 데 필요한 모든 코드를 다운로드할 수 있습니다. 솔루션.
스택은 다음과 같이 구성됩니다:
- 웹 앱 - 플라스크
- 작업 대기열 - 셀러리 + RabbitMQ
- 동기화 게이트웨이(바다코끼리 모드)
실행하려면 git 리포지토리를 복제하고 docker-compose를 실행하기만 하면 됩니다:
|
1 2 3 4 5 |
git clone https://github.com/rafaelugolini/syncgateway_apiless_example cd syncgateway_apiless_example docker-compose up |
데이터 모델링
이 예제에서는 키 액션 를 이벤트의 기본 소스로 사용하여 문서를 저장해야 합니다:
|
1 |
{ "action": "person_request" } |
문서 컬을 만들려면 다음 명령을 사용하면 됩니다.
|
1 |
curl -H "Content-Type: application/json" -X POST -d '{"action":"person_request"}' https://localhost:4984/db/ |
동기화 게이트웨이
동기화 게이트웨이의 구성에서 모든 문서가 변경될 때마다 이벤트 핸들러를 등록합니다. action == "person_request"를 클릭하면 웹 앱으로 API 호출이 이루어집니다.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 |
"event_handlers": { "document_changed": [ {"handler": "webhook", "url": "https://web_service:5000/person_request/", "filter": `function(doc) { if (doc.action == "person_request") { return true; } return false; }` } ] } |
웹 앱
웹 앱은 문서 정보가 포함된 POST를 수신하여 셀러리로 작업을 전송하는 간단한 플라스크 API입니다.
이 작업은 다음에서 임의의 스타워즈 인물을 쿼리합니다. https://swapi.co/ 를 클릭하고 문서를 업데이트합니다:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
{ "action": "person_success", "gender": "female", "height": "168", "mass": "55", "name": "Zam Wesell" } |
클라이언트
저는 동기화 게이트웨이에서 콘솔로 모든 문서를 인쇄하는 간단한 pouchdb 클라이언트를 개발했습니다. 기본적으로 데이터베이스가 변경될 때마다 이 기능을 실행합니다.
|
1 2 3 4 5 6 7 8 9 10 11 |
const getAllDocs = () => ( db.allDocs({ include_docs: true, attachments: true, }).then((result) => { console.log('\x1Bc'); // this clears the console console.log(util.inspect(result.rows, false, null)); }).catch((err) => { console.log(err); }) ); |
Y에서 얻을 수 있습니다. git 저장소.
|
1 2 |
yarn install yarn start |
이 게시물은 다음에서 가져온 것입니다. 카우치베이스 커뮤니티 글쓰기 프로그램
[...] HTMLUnique 문서를 로드하는 중 오류가 발생했습니다 [...]