IBM Cloud Docs
웹 기반 수행 목록 작성

웹 기반 수행 목록 작성

간단한 웹 기반 할 일 목록을 만들어 기본 IBM Cloud 기능에 익숙해지세요.

목표

  1. 이 튜토리얼에서는 데이터를 읽고 쓰기 위해 IBM Cloud 데이터베이스와 인터페이스하는 기본 웹 사이트를 작성하는 방법을 학습합니다.

    이 프로젝트는 간단한 할 일 목록으로, 노트 목록을 볼 수 있습니다. 메모를 추가 및 삭제할 수 있습니다. 각 메모에는 태그가 있으며 태그별로 메모를 필터링할 수 있습니다.

  2. 이 할 일 목록을 만들려면 애플리케이션에서 데이터베이스를 읽고 쓸 수 있어야 합니다. 할 일을 '최신순'으로 읽고 태그를 기준으로 필터링하려면 데이터베이스에 보조 인덱스가 있어야 합니다. 이제 이 모든 것을 만들 수 있습니다.

1시간 내에 이 튜토리얼을 완료할 수 있습니다. 현재 IBM Cloudant 청구에 대해서는 비용이 들지 않습니다(따라서 IBM Cloudant Lite 플랜을 사용 중인 경우에는 무료임).

작성하는 웹 사이트는 로컬 시스템에서 제공되므로 IBM Cloud 이외의 다른 서비스는 필요하지 않습니다.

After you complete it, you have a basic understanding of how applications can interface with IBM Cloudant through an IBM Cloudant SDK (in this case, NodeJS).

시작하기 전에

이 튜토리얼을 완료하려면 다음 구현이 필요합니다:

  1. IBM Cloudant 서비스 인스턴스 및 일부 서비스 인증 정보. IBM Cloudant 시작하기 튜토리얼에 따라 IBM Cloudant 대시보드에서 인스턴스 및 인증 정보를 작성할 수 있습니다. 서비스 인증 정보를 작성할 때 APIKey 및 URL을 기록해 두어야 합니다.
  2. Mac 또는 Linux™ 터미널에 액세스할 수 있는지 확인합니다.
  3. Git 다운로드합니다.
  4. Node.js 및 npm을 다운로드합니다.

코드 가져오기

  1. 터미널을 여십시오.

  2. 다음 명령을 입력하십시오.

    git clone https://github.com/IBM-Cloud/todo-list.git
cd todo-list

환경 준비 및 웹 사이트 실행

이 단계에서는 웹 사이트를 실행하는 데 필요한 모든 코드 종속성 및 환경 변수를 설치합니다.

  1. todo-list 디렉토리에 있는지 확인하십시오.

  2. 터미널에서 다음 명령을 실행하십시오.

    npm install
export CLOUDANT_APIKEY="<the_apikey_from_prerequisites>"
export CLOUDANT_URL="https://<the_url_from_prerequisites>"
npm run start

처음으로 이 명령을 실행하면 코드에서 데이터베이스가 없음을 발견합니다. 이 코드는 일부 인덱스(날짜별 및 태그별)와 샘플 데이터가 포함된 데이터베이스를 생성합니다.

웹사이트를 확인하세요!

이제 웹 사이트를 확인할 수 있습니다.

  1. 브라우저에서 https://localhost:8080 이동합니다.

    할 일 목록에 몇 가지 항목이 표시되어 있는 것을 볼 수 있습니다:

    내 할 일
    기반 할 일

  2. 메모를 추가하거나 삭제하십시오. 또는 태그 중 하나를 클릭하여 태그별로 필터링할 수 있습니다.

코드 이해

데이터베이스 및 인덱스 작성

백엔드 스크립트(server.js)는 시작 시 getDatabaseInformation 메소드를 사용하여 todo 데이터베이스에 연결하려고 합니다. 찾지 못하면 putDatabase 메소드를 사용하여 작성하려고 시도합니다.

todo 데이터베이스를 작성한 후 postIndex 메소드를 사용하여 두 개의 인덱스를 작성합니다. 첫 번째는 시간소인 필드(메모 작성 날짜)에 인덱스를 작성하므로 모든 메모를 역시간 순서로 검색할 수 있습니다. 두 번째 인덱스는 태그 및 시간소인에 있으므로 태그별로 필터링하고 알려진 태그에 대한 날짜순 목록을 리턴할 수 있습니다.

데이터베이스 사용

프론트 엔드는 인기 있는 express 프레임워크를 사용하여 작성, 삭제 및 필터링과 같은 다양한 조치를 클릭할 때 백엔드에서 웹 페이지를 표시하고 호출 서비스 엔드포인트를 호출합니다.

예를 들어 웹페이지가 처음 로드될 때 GET /todolist 엔드포인트를 호출합니다. The GET /todolist endpoint uses the postFind method to query the database for all documents (by using the index created after the todo database), and then orders the notes by timestamp, and returns them to the front end for display.

태그별 필터링은 동일한 postFind 방법을 사용하지만, 두 번째 인덱스를 사용하면 postDocument deleteDocument 방법을 사용해 노트를 만들고 삭제할 수 있습니다.

요약

IBM Cloudant를 사용하면 해당 HTTP API가 Node.js SDK로 모델링되고 사용자 고유의 코드와 쉽게 통합되므로 웹 애플리케이션을 빠르게 개발할 수 있습니다. IBM Cloudant 데이터베이스를 작성하고 사용자 고유의 데이터를 모델링하는 JSON 문서를 추가합니다. 데이터 볼륨이 증가해도 조회 성능이 빠르게 유지되도록 조회 액세스 패턴을 처리하는 데 도움이 되는 2차 인덱스를 작성해야 합니다.

JavaScript, 작성에 익숙하지 않다면 Java™, Python, Go용 SDK와 HTTP API를 이용할 수 있습니다. 잊지 마십시오. IBM Cloudant 대시보드는 데이터베이스를 탐색하고 문서를 작성 및 수정하며 인덱스 및 조회 기술을 세분화하는 좋은 방법입니다.

더 많은 모범 사례 지침은 블로그와 문서에서 확인할 수 있습니다. IBM Cloudant 및 해당 기능에 대한 비디오 안내서는 학습 센터의 교육 과정을 참조하십시오.