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

# 앱 게시하기

> 릴리스 설정을 선택하고, 앱을 게시하고, 라이브 버전을 확인하고, 출시 후 모니터링하세요.

export const PublishingPlanAvailability = () => <Note>
    Publishing is available on every plan. Starter includes {FreeDeployments}
    published app, which expires after 30 days and can be republished. Core and
    Pro include additional publishing options. See [Deployment
    pricing](/billing/deployment-pricing) and [Starter
    plan](/billing/plans/starter-plan) for current limits.
  </Note>;

export const YouTubeEmbed = ({videoId, title = "YouTube video", startAt}) => {
  if (!videoId) {
    return null;
  }
  let url = "https://www.youtube.com/embed/" + videoId;
  if (startAt) {
    url = url + "?start=" + startAt;
  }
  return <Frame>
      <iframe src={url} title={title} allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowFullScreen></iframe>
    </Frame>;
};

**Preview**에서 앱을 빌드하고 테스트했다면, 이제 다른 사람들이 사용할 수 있게 하고 싶을 것입니다. Preview URL은 일시적이며 개발용입니다 — 공개적으로 배포하기 위한 링크가 아닙니다. Preview를 열면 배너가 안전한 공유를 위해 게시를 진행하도록 안내합니다.

<Frame>
  <img src="https://mintcdn.com/replit/82Q9hMxIoxepT4ct/images/publish-gather/00-development-preview-banner.jpg?fit=max&auto=format&n=82Q9hMxIoxepT4ct&q=85&s=f0f282033a3c4c9175d995d4c29db553" alt="URL이 일시적이며 안전한 공유를 위해 앱을 게시해야 한다는 내용을 안내하는 배너가 표시된 Gather 개발 Preview" width="1280" height="720" data-path="images/publish-gather/00-development-preview-banner.jpg" />
</Frame>

게시하면 **프로덕션 배포**가 생성됩니다. 이는 자체 URL에서 실행되는, 안정적이고 공유 가능한 버전의 앱입니다. 개발 Preview는 빌드하고 테스트하는 공간이고, 프로덕션 배포는 방문자가 사용하는 버전입니다. 두 가지가 분리되어 있으므로 다시 게시하기 전까지는 라이브 앱을 변경하지 않고 계속 작업할 수 있습니다.

게시는 단순히 Preview를 공개로 전환하는 것 이상입니다. Replit이 앱을 패키징하고, 필요한 리소스를 프로비저닝하고, 릴리스를 확인한 다음, 도메인을 결과 배포로 라우팅합니다.

<YouTubeEmbed videoId="ski8_MUYO4M" title="Replit에서 앱 게시하기" />

## 게시하기 전에

배너를 따라가거나 **Publish**를 열기 전에, Preview를 사용해 주요 사용자 여정을 테스트하고, 지원하는 화면 크기에서 레이아웃을 확인하고, Agent가 보고한 오류를 수정하세요. 게시하면 현재 버전이 다른 사람들에게 제공되므로, 앱에 시크릿이나 비공개 테스트 데이터를 포함하지 않도록 주의하세요.

## 앱 게시하기

<Steps>
  <Step title="Publish 대화 상자 열기">
    개발 Preview 배너에서 **Publish your app**을 선택하면 게시 흐름으로 돌아갑니다. 또는 Build나 Design에서 작업하는 동안 프로젝트를 직접 열고 Project Editor 우측 상단의 **Publish**를 선택할 수도 있습니다.

    <Tip>
      프롬프트 상자에서 Agent에게 다음과 같이 요청할 수도 있습니다: `Publish this app.` Agent가 릴리스를 준비하거나 필요한 확인 절차로 안내해 줍니다.
    </Tip>
  </Step>

  <Step title="도메인 및 액세스 설정 선택하기">
    **도메인**은 방문자가 배포에 접근하기 위해 사용하는 주소입니다. 생성된 `.replit.app` 도메인을 확인하고 필요하면 사용 가능한 이름으로 변경하세요. 그런 다음 앱을 열 수 있는 사람을 결정하는 **액세스 수준**을 선택합니다:

    * **Public**: 링크를 가진 모든 사람이 앱을 사용할 수 있습니다.
    * **Password protected**: 방문자가 공유된 비밀번호를 입력해야 합니다.
    * **Workspace only**: 액세스를 워크스페이스 구성원으로 제한합니다.
    * **Invite only**: 액세스를 선택한 사람이나 그룹으로 제한합니다.

    각 옵션에 대한 자세한 내용은 [앱 액세스](/ko/features/publishing/private-deployments)를 참고하세요.

    방문자가 게시된 앱에서 피드백을 보낼 수 있도록 피드백 위젯을 활성화할 수도 있습니다.

    <Frame>
      <img src="https://mintcdn.com/replit/82Q9hMxIoxepT4ct/images/publish-gather/01-publish-settings.jpg?fit=max&auto=format&n=82Q9hMxIoxepT4ct&q=85&s=a755466f940ad3e4cdc46507acd72499" alt="생성된 도메인, 공개 액세스 설정, 피드백 위젯, 보안 검토, Publish 버튼을 보여주는 Gather의 Publish 대화 상자" width="1280" height="720" data-path="images/publish-gather/01-publish-settings.jpg" />
    </Frame>

    <PublishingPlanAvailability />
  </Step>

  <Step title="보안 검토 후 게시하기">
    **Review security**를 선택하면 릴리스가 라이브로 전환되기 전에 확인할 수 있습니다. 도메인, 액세스, 보안 설정이 준비되면 **Publish**를 선택하세요.

    Replit이 배포를 프로비저닝하고, 보안 검사를 실행하고, 앱을 빌드 및 번들링한 다음, 릴리스를 프로모트합니다. 프로비저닝은 클라우드 리소스를 준비하는 단계이고, 빌드와 번들링은 프로젝트를 프로덕션에 사용할 수 있는 패키지로 변환하는 단계이며, 프로모트는 해당 패키지를 라이브 버전으로 만드는 단계입니다. 각 단계가 완료될 때까지 프로젝트를 열어 두세요.

    <Frame>
      <img src="https://mintcdn.com/replit/82Q9hMxIoxepT4ct/images/publish-gather/02-publishing-progress.jpg?fit=max&auto=format&n=82Q9hMxIoxepT4ct&q=85&s=f7033afaf58fc5c5e1c9a0c0086d8d61" alt="릴리스가 시작된 후 게시가 진행 중인 상태를 보여주는 Gather 프로젝트" width="1280" height="720" data-path="images/publish-gather/02-publishing-progress.jpg" />
    </Frame>
  </Step>

  <Step title="라이브 앱 열고 확인하기">
    게시가 완료되면 Replit이 배포 상태와 공개 URL을 표시합니다. 개발 Preview뿐만 아니라 URL을 열어 라이브 앱을 테스트하고, 페이지와 가장 중요한 동작이 예상대로 작동하는지 확인하세요.

    <Frame>
      <img src="https://mintcdn.com/replit/82Q9hMxIoxepT4ct/images/publish-gather/03-published-project.jpg?fit=max&auto=format&n=82Q9hMxIoxepT4ct&q=85&s=7020bc214dcafbcfc67ec35f1bbf36c0" alt="게시 후, 성공적인 프로덕션 상태와 라이브 URL을 보여주는 Gather 프로젝트" width="1280" height="720" data-path="images/publish-gather/03-published-project.jpg" />
    </Frame>

    <Frame>
      <img src="https://mintcdn.com/replit/82Q9hMxIoxepT4ct/images/publish-gather/04-live-site.jpg?fit=max&auto=format&n=82Q9hMxIoxepT4ct&q=85&s=389ee3320b672823997c4687ec7b9180" alt="공개 replit.app URL에서 열린, 게시된 Gather 워크숍 탐색 앱" width="1280" height="720" data-path="images/publish-gather/04-live-site.jpg" />
    </Frame>
  </Step>
</Steps>

## 게시된 프로젝트 이해하기

게시 후, 프로젝트에는 서로 연관된 두 부분이 있습니다: 계속 빌드해 나가는 편집 가능한 프로젝트와, 현재 방문자에게 서비스를 제공하는 프로덕션 배포입니다. 해당 프로덕션 환경을 확인하고 관리하려면 **Tools**를 여세요.

**Publishing** 패널은 배포 개요를 보여줍니다. 최신 릴리스가 성공했는지, 누가 액세스할 수 있는지, 어디에서 실행되는지, 어떻게 호스팅되는지, 어떤 리소스를 사용할 수 있는지, 어떤 도메인이 연결되어 있는지를 표시합니다.

**배포 유형**은 Replit이 앱을 실행하는 방식을 나타냅니다. **Autoscale**은 트래픽 변화에 따라 머신을 추가로 시작합니다. **Reserved VM**은 머신을 계속 사용 가능한 상태로 유지합니다. **Static**은 실행 중인 백엔드가 필요 없는 파일을 제공하며, **Scheduled**는 프로그램을 일정에 따라 실행합니다. 이들을 비교하려면 [배포 유형](/ko/features/publishing/deployment-types)을 참고하세요.

**머신 성능**은 각 인스턴스에서 사용할 수 있는 CPU와 메모리입니다. 최대 머신 수는 Autoscale이 확장될 수 있는 한도를 제한합니다. [머신 구성](/ko/features/publishing/machine-configuration)을 참고하세요. 리소스를 늘리면 용량이 향상되지만 사용 비용도 증가할 수 있습니다.

**배포 지역**은 앱이 실행되는 리전을 제어합니다. 대부분의 방문자와 가까운 리전을 선택하면 지연 시간을 줄일 수 있습니다. [프로젝트 지역](/ko/features/publishing/project-geography)을 참고하세요.

앱과 플랜에 따라 **Adjust settings** 또는 **Manage**에서 프로덕션 시크릿 및 관련 배포 옵션과 함께 이러한 설정에 액세스할 수 있습니다.

이는 선택적인 프로덕션 설정입니다. 일반적인 앱을 공유하는 데는 변경할 필요가 없으며, 일부 변경 사항은 가용성이나 사용 비용에 영향을 줄 수 있습니다.

<Frame>
  <img src="https://mintcdn.com/replit/82Q9hMxIoxepT4ct/images/publish-gather/07-resource-settings.jpg?fit=max&auto=format&n=82Q9hMxIoxepT4ct&q=85&s=92b0a530db80585b1bb88f1015b10bb8" alt="머신 성능, CPU와 RAM, 최대 머신 수, 예상 컴퓨팅 사용량을 보여주는 Gather의 Autoscale 머신 구성" width="1280" height="720" data-path="images/publish-gather/07-resource-settings.jpg" />
</Frame>

### 릴리스 모니터링하기

**Monitoring**은 프로덕션과 관련된 질문에 답합니다: *앱이 정상적이고 잘 응답하고 있는가?* **Tools** 패널의 **Replit Cloud** 아래에서 **Monitoring**을 여세요. 요청, HTTP 상태, 응답 시간, CPU 사용률, 메모리 사용률을 보여줍니다. 상태 코드는 실패한 요청을 나타내고, 응답 시간은 느린 응답을 나타냅니다. CPU와 메모리 차트는 리소스 한계를 파악하는 데 도움이 됩니다. 새 릴리스는 라이브 앱이 트래픽을 받기 전까지는 표시되는 데이터가 거의 없을 수 있습니다. 전체 내용을 확인하려면 [앱 모니터링](/ko/features/publishing/monitoring-a-deployment)을 참고하세요.

<Frame>
  <img src="https://mintcdn.com/replit/82Q9hMxIoxepT4ct/images/publish-gather/05-monitoring.jpg?fit=max&auto=format&n=82Q9hMxIoxepT4ct&q=85&s=3a95750bf68df7ac1f91c6fd7b94323f" alt="애플리케이션 요청 지표와 인프라 CPU 및 메모리 차트를 보여주는 Gather의 Monitoring 패널" width="1280" height="720" data-path="images/publish-gather/05-monitoring.jpg" />
</Frame>

### 트래픽 및 성장 확인하기

**Growth**는 다른 질문에 답합니다: *사람들이 앱을 찾고 사용하고 있는가?* **Tools** 패널의 **Replit Cloud** 아래에서 **Growth**를 여세요. 기본 지표에는 방문자 수, 인기 페이지, 리퍼러, 국가, 브라우저, 기기가 포함됩니다. 이는 사용자가 어디에서 유입되고 무엇에 관심을 갖는지를 보여줍니다. [SEO 등급](/ko/features/publishing/seo-rating)은 게시된 페이지가 검색 엔진에 얼마나 잘 대비되어 있는지를 측정합니다. 유료 플랜의 빌더는 [SEO Agent](/ko/features/publishing/seo-agent)를 사용해 개선점을 스캔할 수 있습니다. 분석 데이터는 게시된 앱이 트래픽을 받은 후에 채워집니다.

<Frame>
  <img src="https://mintcdn.com/replit/82Q9hMxIoxepT4ct/images/publish-gather/06-growth-analytics.jpg?fit=max&auto=format&n=82Q9hMxIoxepT4ct&q=85&s=f44ef95cad5f739392f14c251b24d221" alt="게시된 앱의 SEO 상태와 기본적인 방문자 분석을 보여주는 Gather의 Growth 패널" width="1280" height="720" data-path="images/publish-gather/06-growth-analytics.jpg" />
</Frame>

## 게시된 앱 업데이트하기

Project Editor에서의 변경 사항은 라이브 릴리스를 자동으로 대체하지 않습니다. 이러한 분리 덕분에 방문자에게 지장을 주지 않고 변경 사항을 준비하고 테스트할 수 있습니다. **Preview**에서 변경 사항을 테스트한 다음, 준비가 되면 **Republish**를 선택하세요. 다시 게시하면 동일한 URL에서 새로운 프로덕션 릴리스가 생성되므로 방문자에게 새 링크를 보낼 필요가 없습니다.

다시 게시한 후에는 공개 URL을 다시 열어 변경된 동작을 확인하세요. 릴리스가 실패하면 다시 시도하기 전에 게시 상태와 로그를 사용해 실패한 단계를 파악하세요.

## 다음 단계

<section className="chat-mkt chat-workflow-grid has-visuals catalog-three-up">
  <a className="chat-example has-visual" href="/ko/build/add-custom-domain">
    <div className="chat-use-case-visual palette-blush">
      <div className="chat-use-case-window">
        <i />

        <i />

        <i />

        <b />

        <b />

        <b />
      </div>

      <em>
        <Icon icon="globe" size={24} />
      </em>
    </div>

    <span>
      <Icon icon="globe" size={19} />
    </span>

    <div className="chat-card-title">커스텀 도메인 추가하기</div>
    <p>`.replit.app` 대신 자신의 도메인을 사용하세요.</p>
    <div className="chat-card-link">계속하기 →</div>
  </a>

  <a className="chat-example has-visual" href="/ko/learn/projects-and-artifacts/replit-deployments">
    <div className="chat-use-case-visual palette-stone">
      <div className="chat-use-case-window">
        <i />

        <i />

        <i />

        <b />

        <b />

        <b />
      </div>

      <em>
        <Icon icon="server" size={24} />
      </em>
    </div>

    <span>
      <Icon icon="server" size={19} />
    </span>

    <div className="chat-card-title">배포 유형</div>
    <p>Autoscale, Reserved VM, Static, Scheduled 배포를 비교하세요.</p>
    <div className="chat-card-link">배포 비교하기 →</div>
  </a>

  <a className="chat-example has-visual" href="/ko/build/troubleshooting">
    <div className="chat-use-case-visual palette-ink">
      <div className="chat-use-case-window">
        <i />

        <i />

        <i />

        <b />

        <b />

        <b />
      </div>

      <em>
        <Icon icon="triangle-exclamation" size={24} />
      </em>
    </div>

    <span>
      <Icon icon="triangle-exclamation" size={19} />
    </span>

    <div className="chat-card-title">게시 문제 해결</div>
    <p>일반적인 게시 문제와 해결 방법.</p>
    <div className="chat-card-link">문제 해결하기 →</div>
  </a>
</section>