> ## Documentation Index
> Fetch the complete documentation index at: https://clickhouse.com/docs/llms.txt
> Use this file to discover all available pages before exploring further.

> 풍부한 사용자 인터페이스를 갖춘 웹 및 모바일 앱을 빠르게 구축하고, 복잡한 작업을 자동화하며, AI를 통합할 수 있습니다. 이 모든 기능은 데이터를 기반으로 합니다.

# Retool을 ClickHouse에 연결하기

export const PartnerBadge = () => {
  return <div className="PartnerBadge">
            <div className="PartnerBadgeIcon">
                <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
                    <polyline points="12.5 9.5 10 12 6 11 2.5 8.5" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="1" />
                    <polyline points="4.54 4.41 8 3.5 11.46 4.41" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="1" />
                    <path d="M2.15,3.78 L0.55,6.95 A0.5,0.5 0,0,0 0.77,7.62 L2.5,8.5 L4.54,4.41 L2.82,3.55 A0.5,0.5 0,0,0 2.15,3.78 Z" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="1" />
                    <path d="M13.5,8.5 L15.23,7.62 A0.5,0.5 0,0,0 15.45,6.95 L13.85,3.78 A0.5,0.5 0,0,0 13.18,3.55 L11.46,4.41 Z" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="1" />
                    <path d="M11.5,4.5 L9,4.5 L6.15,7.27 A0.5,0.5 0,0,0 6.24,8.05 C7.33,8.74 8.81,8.72 10,7.5 L12.5,9.5 L13.5,8.5" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="1" />
                    <polyline points="7.75 13.5 5.15 12.85 3.5 11.67" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="1" />
                </svg>
            </div>
            파트너 통합
        </div>;
};

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

<PartnerBadge />

<Steps>
  <Step title="연결 세부 정보 수집" id="1-gather-your-connection-details">
    HTTP(S)로 ClickHouse에 연결하려면 다음 정보가 필요합니다.

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

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

    <div className="ch-image-md">
      <Frame>
        <img src="https://mintcdn.com/private-7c7dfe99/EDr8ydtGBgFPOQea/images/_snippets/cloud-connect-button.webp?fit=max&auto=format&n=EDr8ydtGBgFPOQea&q=85&s=97d6a020a443f1b365b017488b39d0c8" alt="ClickHouse Cloud 서비스 연결 버튼" width="998" height="932" data-path="images/_snippets/cloud-connect-button.webp" />
      </Frame>
    </div>

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

    <div className="ch-image-md">
      <Frame>
        <img src="https://mintcdn.com/private-7c7dfe99/EDr8ydtGBgFPOQea/images/_snippets/connection-details-https.webp?fit=max&auto=format&n=EDr8ydtGBgFPOQea&q=85&s=80369fc90cd1ac3108fe455f2426c19a" alt="ClickHouse Cloud HTTPS 연결 정보" width="1320" height="1184" data-path="images/_snippets/connection-details-https.webp" />
      </Frame>
    </div>

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

  <Step title="ClickHouse 리소스 생성" id="2-create-a-clickhouse-resource">
    Retool 계정에 로그인한 다음 *Resources* 탭으로 이동합니다. "Create New" -> "Resource"를 선택합니다:

    <Image img="https://mintcdn.com/private-7c7dfe99/6s0zAeps_NYZmK2e/images/integrations/tools/data-integration/retool/retool_01.webp?fit=max&auto=format&n=6s0zAeps_NYZmK2e&q=85&s=ed34ddfe4447cad699a936e3a36c93c0" size="lg" border alt="새 리소스 생성" width="1843" height="908" data-path="images/integrations/tools/data-integration/retool/retool_01.webp" />

    <br />

    사용 가능한 커넥터 목록에서 "JDBC"를 선택합니다:

    <Image img="https://mintcdn.com/private-7c7dfe99/6s0zAeps_NYZmK2e/images/integrations/tools/data-integration/retool/retool_02.webp?fit=max&auto=format&n=6s0zAeps_NYZmK2e&q=85&s=6097acbba8929453d7331456edcea140" size="lg" border alt="JDBC 커넥터 선택" width="1478" height="490" data-path="images/integrations/tools/data-integration/retool/retool_02.webp" />

    <br />

    설정 마법사에서 "Driver name"으로 `com.clickhouse.jdbc.ClickHouseDriver`를 선택했는지 확인합니다:

    <Image img="https://mintcdn.com/private-7c7dfe99/6s0zAeps_NYZmK2e/images/integrations/tools/data-integration/retool/retool_03.webp?fit=max&auto=format&n=6s0zAeps_NYZmK2e&q=85&s=2337f7bac3d54563a89056b2178c268c" size="lg" border alt="올바른 드라이버 선택" width="1475" height="1011" data-path="images/integrations/tools/data-integration/retool/retool_03.webp" />

    <br />

    다음 형식으로 ClickHouse 자격 증명을 입력합니다: `jdbc:clickhouse://HOST:PORT/DATABASE?user=USERNAME&password=PASSWORD`.
    인스턴스에 SSL이 필요하거나 ClickHouse Cloud를 사용하는 경우 연결 문자열에 `&ssl=true`를 추가하여 `jdbc:clickhouse://HOST:PORT/DATABASE?user=USERNAME&password=PASSWORD&ssl=true` 형식이 되도록 합니다

    <Image img="https://mintcdn.com/private-7c7dfe99/6s0zAeps_NYZmK2e/images/integrations/tools/data-integration/retool/retool_04.webp?fit=max&auto=format&n=6s0zAeps_NYZmK2e&q=85&s=152fd831d32a0c47bbaf8a2432cb4e54" size="lg" border alt="자격 증명 입력" width="1475" height="923" data-path="images/integrations/tools/data-integration/retool/retool_04.webp" />

    <br />

    그런 다음 연결을 테스트합니다:

    <Image img="https://mintcdn.com/private-7c7dfe99/6s0zAeps_NYZmK2e/images/integrations/tools/data-integration/retool/retool_05.webp?fit=max&auto=format&n=6s0zAeps_NYZmK2e&q=85&s=7be77a552d567b407c135fd4ee869dcf" size="lg" border alt="연결 테스트" width="1475" height="1008" data-path="images/integrations/tools/data-integration/retool/retool_05.webp" />

    <br />

    이제 ClickHouse 리소스를 사용해 앱 작업을 계속 진행할 수 있습니다.
  </Step>
</Steps>
