> ## Documentation Index
> Fetch the complete documentation index at: https://private-7c7dfe99-detect-table-modification.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

> Zing Data는 iOS, Android, 웹에서 사용할 수 있도록 만들어진 ClickHouse용 간편한 소셜 비즈니스 인텔리전스 도구입니다.

# Zing Data를 ClickHouse에 연결

export const CommunityMaintainedBadge = () => {
  return <div className="CommunityMaintainedBadge">
            <div className="CommunityMaintainedIcon">
            <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor" viewBox="0 0 256 256">
                <path d="M244.8,150.4a8,8,0,0,1-11.2-1.6A51.6,51.6,0,0,0,192,128a8,8,0,0,1-7.37-4.89,8,8,0,0,1,0-6.22A8,8,0,0,1,192,112a24,24,0,1,0-23.24-30,8,8,0,1,1-15.5-4A40,40,0,1,1,219,117.51a67.94,67.94,0,0,1,27.43,21.68A8,8,0,0,1,244.8,150.4ZM190.92,212a8,8,0,1,1-13.84,8,57,57,0,0,0-98.16,0,8,8,0,1,1-13.84-8,72.06,72.06,0,0,1,33.74-29.92,48,48,0,1,1,58.36,0A72.06,72.06,0,0,1,190.92,212ZM128,176a32,32,0,1,0-32-32A32,32,0,0,0,128,176ZM72,120a8,8,0,0,0-8-8A24,24,0,1,1,87.24,82a8,8,0,1,0,15.5-4A40,40,0,1,0,37,117.51,67.94,67.94,0,0,0,9.6,139.19a8,8,0,1,0,12.8,9.61A51.6,51.6,0,0,1,64,128,8,8,0,0,0,72,120Z"></path>
            </svg>
        </div>
            커뮤니티에서 관리
        </div>;
};

export const Image = ({img, alt, size = "lg"}) => {
  const normalizedSize = ["sm", "md", "lg"].includes(size) ? size : "lg";
  return <div className={`ch-image-${normalizedSize}`}>
      <Frame>
        <img src={img} alt={alt} />
      </Frame>
    </div>;
};

<a href="https://www.zingdata.com/" target="_blank">Zing Data</a>는 데이터 탐색 및 시각화 플랫폼입니다. Zing Data는 ClickHouse에서 제공하는 JS 드라이버를 통해 ClickHouse에 연결됩니다.

<div id="how-to-connect">
  ## 연결 방법
</div>

1. 연결 세부 정보를 준비합니다.

HTTP(S)로 ClickHouse에 연결하려면 다음 정보가 필요합니다.

| 매개변수                      | 설명                                                         |
| ------------------------- | ---------------------------------------------------------- |
| `HOST` and `PORT`         | 일반적으로 TLS를 사용하는 경우 포트는 8443, TLS를 사용하지 않는 경우 8123입니다.      |
| `DATABASE NAME`           | 기본적으로 `default`라는 이름의 데이터베이스가 제공되며, 연결할 데이터베이스 이름을 사용하십시오. |
| `USERNAME` and `PASSWORD` | 기본 사용자 이름은 `default`입니다. 사용 사례에 맞는 사용자 이름을 사용하십시오.         |

ClickHouse Cloud 서비스의 연결 정보는 ClickHouse Cloud 콘솔에서 확인할 수 있습니다.
서비스를 선택한 다음 **Connect**를 클릭하십시오.

<Image img="https://mintcdn.com/private-7c7dfe99-detect-table-modification/0yJtAU6cqYAQlCWC/images/_snippets/cloud-connect-button.webp?fit=max&auto=format&n=0yJtAU6cqYAQlCWC&q=85&s=2d1e2340e1ddccf3199ca1e41eeba836" size="md" alt="ClickHouse Cloud 서비스 연결 버튼" border width="998" height="932" data-path="images/_snippets/cloud-connect-button.webp" />

**HTTPS**를 선택하십시오. 연결 정보가 예시 `curl` 명령으로 표시됩니다.

<Image img="https://mintcdn.com/private-7c7dfe99-detect-table-modification/0yJtAU6cqYAQlCWC/images/_snippets/connection-details-https.webp?fit=max&auto=format&n=0yJtAU6cqYAQlCWC&q=85&s=2ea2af378046d5ec87ea8e78de573bc1" size="md" alt="ClickHouse Cloud HTTPS 연결 정보" border width="1320" height="1184" data-path="images/_snippets/connection-details-https.webp" />

자가 관리형 ClickHouse를 사용하는 경우 연결 정보는 ClickHouse 관리자가 설정합니다.

2. Zing Data를 다운로드하거나 접속합니다.

   * 모바일에서 ClickHouse를 Zing Data와 함께 사용하려면 [Google Play Store](https://play.google.com/store/apps/details?id=com.getzingdata.android) 또는 [Apple App Store](https://apps.apple.com/us/app/zing-data-collaborative-bi/id1563294091)에서 Zing Data 앱을 다운로드합니다.

   * 웹에서 ClickHouse를 Zing Data와 함께 사용하려면 [Zing 웹 콘솔](https://console.getzingdata.com/)에 접속해 계정을 생성합니다.

3. 데이터 소스를 추가합니다.

   * Zing Data에서 ClickHouse 데이터와 상호 작용하려면 ***데이터 소스***를 정의해야 합니다. Zing Data 모바일 앱 메뉴에서 **Sources**를 선택한 다음 **Add a Datasource**를 클릭합니다.

   * 웹에서 데이터 소스를 추가하려면 상단 메뉴에서 **Data Sources**를 클릭하고 **New Datasource**를 클릭한 다음 드롭다운 메뉴에서 **ClickHouse**를 선택합니다.

   <Image size="md" img="https://mintcdn.com/private-7c7dfe99-detect-table-modification/oiVn1yLOSIt50Ty-/images/integrations/data-visualization/zing_01.webp?fit=max&auto=format&n=oiVn1yLOSIt50Ty-&q=85&s=469cee22e2ad83470ad6bf38106acaa3" alt="새 데이터 소스 버튼과 드롭다운 메뉴의 ClickHouse 옵션이 표시된 Zing Data 인터페이스" border width="2420" height="278" data-path="images/integrations/data-visualization/zing_01.webp" />

   <br />

4. 연결 세부 정보를 입력한 후 **Check Connection**을 클릭합니다.

   <Image size="md" img="https://mintcdn.com/private-7c7dfe99-detect-table-modification/oiVn1yLOSIt50Ty-/images/integrations/data-visualization/zing_02.webp?fit=max&auto=format&n=oiVn1yLOSIt50Ty-&q=85&s=00949fc46f5e76678eb0d98bf8fe4c42" alt="server, port, database, username, password 필드가 있는 Zing Data의 ClickHouse 연결 구성 양식" border width="2242" height="2210" data-path="images/integrations/data-visualization/zing_02.webp" />

   <br />

5. 연결에 성공하면 Zing이 테이블 선택 단계로 이동합니다. 필요한 테이블을 선택하고 **Save**를 클릭합니다. Zing이 데이터 소스에 연결하지 못하면 자격 증명을 확인한 후 다시 시도하라는 메시지가 표시됩니다. 자격 증명을 확인하고 다시 시도한 뒤에도 문제가 계속되면 <a id="contact_link" href="mailto:hello@getzingdata.com">여기에서 Zing 지원팀에 문의하십시오.</a>

   <Image size="md" img="https://mintcdn.com/private-7c7dfe99-detect-table-modification/oiVn1yLOSIt50Ty-/images/integrations/data-visualization/zing_03.webp?fit=max&auto=format&n=oiVn1yLOSIt50Ty-&q=85&s=8f4fd926ae8264ebd6c6e79b2600c9a2" alt="체크박스와 함께 사용 가능한 ClickHouse 테이블이 표시된 Zing Data의 테이블 선택 인터페이스" border width="2248" height="1232" data-path="images/integrations/data-visualization/zing_03.webp" />

   <br />

6. ClickHouse 데이터 소스가 추가되면 Zing 조직의 모든 사용자가 **Data Sources** / **Sources** 탭에서 이를 사용할 수 있습니다.

<div id="creating-charts-and-dashboards-in-zing-data">
  ## Zing Data에서 차트와 대시보드 만들기
</div>

1. ClickHouse 데이터 소스가 추가되면, 차트 생성을 시작하려면 웹에서는 **Zing App**을 클릭하고 모바일에서는 데이터 소스를 탭합니다.

2. 차트를 만들려면 테이블 목록에서 테이블을 클릭합니다.

   <Image size="sm" img="https://mintcdn.com/private-7c7dfe99-detect-table-modification/oiVn1yLOSIt50Ty-/images/integrations/data-visualization/zing_04.webp?fit=max&auto=format&n=oiVn1yLOSIt50Ty-&q=85&s=57520c0d7d21feadb016a572b66b5ca3" alt="사용 가능한 ClickHouse 테이블이 표시된 테이블 목록을 보여주는 Zing Data 인터페이스" border width="836" height="422" data-path="images/integrations/data-visualization/zing_04.webp" />

   <br />

3. 시각적 쿼리 빌더를 사용해 원하는 필드, 집계 등을 선택한 다음 **Run Question**을 클릭합니다.

   <Image size="md" img="https://mintcdn.com/private-7c7dfe99-detect-table-modification/oiVn1yLOSIt50Ty-/images/integrations/data-visualization/zing_05.webp?fit=max&auto=format&n=oiVn1yLOSIt50Ty-&q=85&s=3942dbd77d310e22af297fd690b984e2" alt="필드 선택 및 집계 옵션이 있는 Zing Data 시각적 쿼리 빌더 인터페이스" border width="2624" height="1734" data-path="images/integrations/data-visualization/zing_05.webp" />

   <br />

4. SQL에 익숙하다면 사용자 지정 SQL을 작성해 쿼리를 실행하고 차트를 만들 수도 있습니다.

   <Image size="md" img="https://mintcdn.com/private-7c7dfe99-detect-table-modification/oiVn1yLOSIt50Ty-/images/integrations/data-visualization/zing_06.webp?fit=max&auto=format&n=oiVn1yLOSIt50Ty-&q=85&s=7690769322e27cff942d56577e05de79" alt="SQL 쿼리 작성 인터페이스를 보여주는 Zing Data의 SQL Editor 모드" border width="2636" height="140" data-path="images/integrations/data-visualization/zing_06.webp" />

   <Image size="md" img="https://mintcdn.com/private-7c7dfe99-detect-table-modification/oiVn1yLOSIt50Ty-/images/integrations/data-visualization/zing_07.webp?fit=max&auto=format&n=oiVn1yLOSIt50Ty-&q=85&s=f61239329395d6174f0a702bac0eb12d" alt="표 형식으로 데이터가 표시된 Zing Data의 SQL 쿼리 결과" border width="2632" height="1030" data-path="images/integrations/data-visualization/zing_07.webp" />

5. 예시 차트는 다음과 같습니다. 점 3개 메뉴를 사용해 질문을 저장할 수 있습니다. 차트에 댓글을 달고, 팀 구성원을 태그하고, 실시간 알림을 만들고, 차트 유형을 변경하는 등의 작업을 할 수 있습니다.

   <Image size="md" img="https://mintcdn.com/private-7c7dfe99-detect-table-modification/oiVn1yLOSIt50Ty-/images/integrations/data-visualization/zing_08.webp?fit=max&auto=format&n=oiVn1yLOSIt50Ty-&q=85&s=fbf9fe5d91021c8914e7774f91875225" alt="옵션 메뉴와 함께 ClickHouse의 데이터를 보여주는 Zing Data의 예시 차트 시각화" border width="2634" height="1252" data-path="images/integrations/data-visualization/zing_08.webp" />

   <br />

6. 대시보드는 홈 화면의 **Dashboards** 아래에 있는 "+" 아이콘을 사용해 만들 수 있습니다. 기존 질문을 끌어와 대시보드에 표시할 수 있습니다.

   <Image size="md" img="https://mintcdn.com/private-7c7dfe99-detect-table-modification/oiVn1yLOSIt50Ty-/images/integrations/data-visualization/zing_09.webp?fit=max&auto=format&n=oiVn1yLOSIt50Ty-&q=85&s=b1e090548b1aed728001299b72b3eda3" alt="대시보드 레이아웃에 여러 시각화가 배치된 Zing Data 대시보드 보기" border width="2606" height="764" data-path="images/integrations/data-visualization/zing_09.webp" />

   <br />

<div id="related-content">
  ## 관련 콘텐츠
</div>

* [문서](https://docs.getzingdata.com/docs/)
* [Quick Start](https://getzingdata.com/quickstart/)
* [대시보드 만들기](https://getzingdata.com/blog/new-feature-create-multi-question-dashboards/) 가이드
