> For the complete documentation index, see [llms.txt](https://docs.decentraland.org/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.decentraland.org/creator/content-creator-ko/sdk7/debugging/debug-in-preview.md).

# 미리보기에서 디버그

로컬에서 미리보기로 실행 중일 때 씬을 디버그하는 방법

미리보기를 실행하면 장면이 어떻게 렌더링되는지 이해하는 데 도움이 되는 유용한 디버깅 정보와 도구를 일부 제공합니다.

장면을 컴파일할 수 없으면, 아무것도 렌더링되지 않은 빈 바닥만 보이게 됩니다. 이런 일이 발생하면, 무엇이 잘못되었는지 이해하는 데 도움이 되는 오류 메시지를 확인할 수 있는 몇 가지 위치가 있습니다:

1. 코드 편집기를 확인하여 구문 또는 논리 오류가 표시되지 않았는지 확인하세요.
2. 미리보기 창의 콘솔에서 오류 메시지가 있는지 확인하세요. 콘솔은 ![](https://3980763956-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FoPnXBby9S6MrsW83Y9qZ%2Fuploads%2Fgit-blob-a673f6b987216e9e471fdac882879c44fcf94652%2Fconsole-icon.png?alt=media) 아이콘을 오른쪽 상단 모서리에서 클릭하여 열 수 있습니다.
3. Creator Hub를 사용해 장면을 실행했다면, 장면의 콘솔 출력이 있는 창을 확인하세요. CLI를 사용해 장면을 실행했다면, 실행한 명령줄의 출력을 확인하세요 `npm run start`

{% hint style="info" %}
**💡 팁** : 장면을 프로덕션 환경에 게시하기 전에, 다음 곳에 게시해 볼 수 있습니다 [Decentraland World](/creator/content-creator-ko/sdk7/publishing/publishing-options.md#decentraland-worlds) 프로덕션에 훨씬 더 가까운 환경에서 테스트해 보기 위해서입니다.
{% endhint %}

## 콘솔 사용

콘솔은 ![](https://3980763956-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FoPnXBby9S6MrsW83Y9qZ%2Fuploads%2Fgit-blob-a673f6b987216e9e471fdac882879c44fcf94652%2Fconsole-icon.png?alt=media) 아이콘을 오른쪽 상단 모서리에서 클릭하여 열 수 있습니다.

키보드의 백틱 키를 눌러서도 전환할 수 있습니다: **`**. 이 키는 대부분의 영어 키보드에서 1 키의 왼쪽에 있습니다. 또는 Shift + **\를 누르세요.`** 더 많은 텍스트를 확인해야 할 경우 콘솔을 더 넓은 보기로 열 수 있습니다.

콘솔에 메시지 출력( `console.log()`)를 사용하여 출력합니다. 그런 다음 장면 콘솔을 열어 생성되는 메시지를 확인할 수 있습니다.

콘솔에는 오류 메시지도 표시되며, 이는 빨간색으로 표시됩니다.

## 디버그 패널

디버그 콘솔은 ![](https://3980763956-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FoPnXBby9S6MrsW83Y9qZ%2Fuploads%2Fgit-blob-92fe4dd70621a496d0da083ae9b5f9b2ef84d2dd%2Fdebug-icon.png?alt=media) 아이콘을 오른쪽 상단 모서리에서 클릭하여 열 수 있습니다.

이것을 클릭하면 오른쪽 아래 모서리에 렌더러 엔진에 대한 정보가 있는 패널이 열리며, 상황이 바뀔 때마다 실시간으로 업데이트됩니다.

![](https://3980763956-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FoPnXBby9S6MrsW83Y9qZ%2Fuploads%2Fgit-blob-ccb91c00f390553253215ec2c18eef6d50f22c5c%2Fdebug-panel.png?alt=media)

### 현재 장면

그 **현재 장면** 탭에는 현재 서 있는 장면에 대한 정보가 포함됩니다. 여기에는 다음이 포함됩니다:

* 장면의 파셀 수
* 빌드할 수 있는 최대 높이(장면의 파셀 수에 비례함)

또한 다음 항목도 확인할 수 있습니다 **장면 경계 표시** 옵션을 사용하면 장면 주변에 빨간색 벽이 표시되어 장면의 경계를 확인할 수 있습니다.

### 메모리

그 **메모리** 섹션에는 Decentraland가 사용하는 메모리가 표시됩니다. 이 값은 항상 **메모리 예산 임계값**보다 낮게 유지하도록 하세요. 이 값이 너무 커지면 장면을 방문하는 플레이어의 앱이 충돌할 위험이 있습니다. 프로덕션에서는 장면이 주변의 다른 장면 및 플레이어와 함께 로드될 수 있으며, 이 모든 요소가 미리보기에서 보이는 것보다 메모리 사용량을 더 높이는 원인이 될 수 있다는 점을 기억하세요.

### 성능

그 **성능** 탭에는 다음과 관련된 여러 필드가 포함됩니다 *FPS* (초당 프레임 수). 장면이 복잡해질수록 이 값은 낮아지는 경향이 있으므로, 플레이어에게 좋은 경험을 보장하기 위해 항상 이 값을 25 FPS 이상으로 유지하세요. FPS는 실행하는 머신에 따라 달라집니다.

여기서 가장 중요한 값은 **평균 FPS**이며, 최근 1000 프레임의 FPS를 반올림한 값입니다.

![](https://3980763956-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FoPnXBby9S6MrsW83Y9qZ%2Fuploads%2Fgit-blob-5476d0417a1f29680ff83a9352543acb34dc1ce6%2Ffps-debug-panel.png?alt=media)

{% hint style="warning" %}
**📔 참고**: 렌더러의 FPS는 게임 루프가 1초에 업데이트되는 장면의 수와 동일하지 않습니다. 장면의 로직은 30 FPS로 제한되며, 렌더러의 FPS는 60 이상으로 올라갈 수 있습니다.
{% endhint %}

일시적인 끊김은 프레임 속도가 순간적으로 멈추는 현상을 말하며, 전체 FPS 수치에는 큰 영향을 주지 않을 수 있지만 플레이어에게는 매우 눈에 띌 수 있습니다. 이는 일반적으로 무거운 에셋이 로드될 때나 그와 유사한 상황에서 발생할 수 있습니다.

### 웹 요청

그 **웹 요청** 섹션에서는 Chrome DevTools의 Network 탭을 열 수 있으며, 이 탭은 장면에서 발생한 웹 요청의 수와 그 내용을 보여줍니다. 이는 장면이 서버에 너무 많은 요청을 보내 성능에 영향을 주는지 확인하는 데 유용합니다.

장면이 서드파티 서버와 상호작용하는 경우, 어떤 데이터가 오가고 있는지 확인하는 것이 종종 유용합니다. 클릭하세요 **Chrome DevTools 열기** 를 클릭하면 Network 탭이 열린 새 Chrome 창이 열립니다.

{% hint style="warning" %}
**📔 참고**: 이 기능을 사용하려면 먼저 [크리에이터 허브](/creator/content-creator-ko/scene-editor/get-started/editor-installation.md)를 설치해야 합니다. 필요한 종속성이 해당 설치에 함께 포함되어 있기 때문입니다.

이 기능을 사용하려고 Creator Hub를 열어 둘 필요는 없으며, Creator Hub를 통해 장면 미리보기를 실행하지 않아도 됩니다. CLI를 사용하여 장면 미리보기를 실행하는 경우에도 사용할 수 있습니다.
{% endhint %}

대안으로, Decentraland 애플리케이션으로 들어오고 나가는 모든 데이터를 보고해 주는 무료 도구를 컴퓨터에서 실행할 수 있습니다. 예를 들면 [Charles](https://www.charlesproxy.com/) 또는 [Wireshark](https://www.wireshark.org/).

## 빠른 다시 로드

장면을 변경할 때마다 미리보기가 자동으로 다시 로드되고 업데이트되므로, 미리보기 창을 열고 닫을 필요가 없습니다.

서 있는 장면을 다시 로드해야 한다면 **장면 다시 로드** 버튼을 미리보기 창의 왼쪽 위 모서리에서 클릭하세요.

![](https://3980763956-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FoPnXBby9S6MrsW83Y9qZ%2Fuploads%2Fgit-blob-aee1c0d965e8eb0be4dce2269a40c7bd34e3a867%2Freload-button.png?alt=media)

채팅에 다음을 입력하고 Enter를 눌러서도 장면을 다시 로드할 수 있습니다:

`/reload`

## 버그 신고

문제가 여러분의 장면이 아닌 Decentraland SDK 일반 문제라면, 다음을 참고하세요 [버그 신고](/creator/content-creator-ko/sdk7/debugging/report-bug.md).

## 종속성 버전

장면의 모든 종속성은 항상 최신 버전을 사용하세요. 겪고 있는 문제가 더 최신 버전에서는 이미 수정되었을 수 있기 때문입니다. Creator Hub는 Decentraland 장면에 설치할 업데이트가 있을 때 알려줍니다.

![](https://3980763956-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FoPnXBby9S6MrsW83Y9qZ%2Fuploads%2Fgit-blob-dfb7f58f6d4c56c78eb70530feed95cf300b0876%2Fnew-dependencies.png?alt=media)

명령줄을 통해 종속성을 수동으로 업데이트할 수도 있습니다. 로컬에서 Decentraland 장면을 실행하려면 두 개의 주요 라이브러리에 의존합니다: `@dcl/sdk` 및 `@dcl/js-runtime`는 각 프로젝트 폴더에 설치됩니다. 이 두 항목이 모두 최신 상태인지 확인하세요. 다음 명령을 실행하여 이 두 라이브러리를 최신 안정 버전으로 수동 업데이트할 수 있습니다:

```
npm i @dcl/js-runtime@latest
npm i @dcl/sdk@latest
```

장면에서 스마트 아이템을 사용한다면, 다음 항목도 사용 중일 수 있습니다 `@dcl/asset-packs` 라이브러리이며, 다음을 통해 업데이트할 수 있습니다:

```
npm i @dcl/asset-packs@latest
```

다음 중 하나를 사용하고 있다면 [유틸 라이브러리](https://studios.decentraland.org/resources?sdk_version=SDK7\&resource_type=Library) 도 최신 상태인지 확인하세요. 이 라이브러리의 이전 버전은 다음의 최신 버전과 호환되지 않을 수 있습니다 `@dcl/sdk`.

## 조명 조건

월드 내 시간대는 3D 모델이 어떻게 보이는지에 큰 영향을 줍니다. 광원 색상은 미묘하게 바뀌며, 밤에는 푸른빛을 띠고 일출과 일몰에는 붉은빛을 띱니다. 빛의 방향도 하늘을 가로질러 이동하면서 그림자를 서로 다른 방향으로 드리웁니다.

게임 시계를 다른 값으로 바꿔가며 장면이 하루 중 모든 시간대에 잘 보이는지 확인하세요. 클릭하세요 **하늘상자 시간** 화면 왼쪽 패널의 아이콘을 눌러 원하는 시간을 설정하세요. 이 슬라이더가 회색으로 비활성화되어 있다면 **자동** 옵션이 비활성화되어 있는지 확인하세요.

<figure><img src="https://github.com/decentraland/docs-creator/blob/main/images/media/daylight-settings.png" alt="Dynamic skybox" width="300"><figcaption><p>월드 내 지침</p></figcaption></figure>

여러분의 3D 모델 재질은 제작에 사용한 모델링 도구에서 보이던 것과 같지 않을 수 있습니다. 모든 3D 렌더링 엔진은 빛과 재질을 처리하는 방식에 미묘한 차이가 있기 때문에 이는 예상되는 일입니다.

또한 장면을 설정하여 하루 중 시간을 고정하고 조명이 변하지 않도록 할 수도 있습니다. 다음을 참고하세요 [스카이박스 제어](/creator/content-creator-ko/sdk7/interactivity/skybox-control.md) 자세한 내용은 다음을 참조하세요.

## 멀티플레이어 테스트

장면 미리보기를 실행하고 두 개 이상의 서로 다른 탐색기 창에서 열면, 열려 있는 각 창은 별도의 플레이어로 해석되며 모의 통신 서버가 이 플레이어들을 동기화 상태로 유지합니다.

한 창에서 장면과 상호작용한 다음 다른 창으로 전환하여 그 상호작용의 효과가 그곳에도 보이는지 확인하세요.

Creator Hub를 사용하는 경우 Preview 버튼을 두 번째로 클릭하면 두 번째 Decentraland 탐색기 창이 열립니다. 두 창 모두 서로 다른 주소로 연결해야 합니다. 장면이 다시 로드되어도 동일한 세션은 열린 상태로 유지됩니다. 다른 계정을 선택하려면 두 번째 창에서 로그아웃했다가 다시 로그인해야 할 수도 있습니다.

![](https://3980763956-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FoPnXBby9S6MrsW83Y9qZ%2Fuploads%2Fgit-blob-30317b50bc4b4e646a1b28effe1ff76939ab0f28%2Fpreview-button.png?alt=media)

두 플레이어는 서로를 볼 수 있고, 서로 상호작용할 수 있습니다. 장면에 멀티플레이어 로직이 있다면 예상대로 작동하며 두 플레이어 간에 동기화됩니다.

대안으로, 다음을 브라우저 URL에 입력하여 두 번째 Decentraland 탐색기 창을 열 수 있습니다:

> `decentraland://realm=http://127.0.0.1:8000&local-scene=true&debug=true&multi-instance=true`

## Ethereum 테스트 네트워크 사용

장면을 테스트하는 동안 실제 MANA나 다른 통화를 전송하지 않으려면 Ethereum Sepolia 테스트 네트워크를 사용하고 대신 가짜 테스트넷 MANA를 전송할 수 있습니다.

테스트 네트워크를 사용하려면 Metamask Chrome 확장을 다음으로 설정해야 합니다 *Sepolia 테스트 네트워크* 대신 *메인 네트워크*를 사용해야 합니다. 또한 Sepolia 블록체인에서 MANA를 보유하고 있어야 하며, 이는 Decentraland에서 무료로 받을 수 있습니다.

{% hint style="info" %}
**💡 팁**: Sepolia MANA를 지갑으로 전송하는 거래를 실행하려면 Sepolia Ether로 가스비를 지불해야 합니다.
{% endhint %}

이 모드에서 장면을 보는 동안 승인한 모든 거래는 테스트 네트워크에서만 발생하며 실제 지갑의 MANA 잔액에는 영향을 주지 않습니다.

테스트 네트워크를 사용하여 장면을 미리 보려면 다음 URL을 브라우저 탭에 붙여넣으세요. 그러면 Decentraland 데스크톱 클라이언트에서 장면이 열립니다:

> decentraland://realm=<http://127.0.0.1:8000\\&local-scene=true\\&debug=true\\&dclenv=zone\\&position=0,0>

{% hint style="info" %}
**💡 팁**: position 매개변수를 장면의 좌표로 변경하여 장면으로 바로 로드하세요. 이 모드에서 장면을 보는 동안 승인한 모든 거래는 테스트 네트워크에서만 발생하며 실제 지갑의 MANA 잔액에는 영향을 주지 않습니다.
{% endhint %}

Polygon 테스트넷에서 거래를 테스트해야 하고 해당 테스트넷에서 MANA가 필요하다면, Sepolia에서 MANA를 받은 후 그 네트워크로 MANA를 스왑해야 합니다. Sepolia MANA를 Polygon 테스트넷으로 브리지하려면 Sepolia에서 Decentraland 계정 페이지를 방문한 다음 Ethereum MANA 쪽의 ‘swap’을 클릭하세요.


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs.decentraland.org/creator/content-creator-ko/sdk7/debugging/debug-in-preview.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
