> 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-pt/scene-editor/expandir-com-codigo/overview.md). # Combine com código Combine conteúdo criado no Scene Editor com o poder de escrever código. {% embed url="" %} O Creator Hub, junto com código personalizado, é uma combinação muito poderosa para criar conteúdo. Você pode usar o canvas para posicionar itens visualmente de forma intuitiva e, depois, escrever código que interaja com esses itens com total liberdade. Você pode até colocar um smart item, que tem seu próprio comportamento padrão, e escrever código que reaja quando o item for ativado. Por exemplo, você pode aproveitar um smart item de alavanca existente, que já vem com seus sons, animações e estados, e escrever código que detecte quando a alavanca é puxada para executar sua própria lógica personalizada. Ver [Referencie itens no código](/creator/content-creator-pt/scene-editor/expandir-com-codigo/reference-items.md) para saber como obter itens pelo nome ou por tags a partir do seu código. ## Editando código Você deve instalar um editor de código na sua máquina para editar o código da sua scene. As opções recomendadas são: * VS Code [Visual Studio Code](https://code.visualstudio.com/): Esta é a opção recomendada para desenvolvedores experientes. * Cursor [Cursor AI](https://www.cursor.com/): Este é um editor de código poderoso integrado com IA. Ele permite que você escolha diferentes modelos de IA para ajudar a escrever código; há um plano gratuito disponível, e modelos mais avançados exigem um plano pago. Esta é uma boa opção para desenvolvedores que são novos em Decentraland ou TypeScript, ou se você quiser economizar tempo escrevendo código. {% hint style="warning" %} **📔 Nota**: Se você estiver no macOS, certifique-se de que o aplicativo do editor de código esteja no diretório Applications. {% endhint %} Depois de instalado, talvez seja necessário selecionar seu Code Editor nas configurações do Creator Hub. Para fazer isso, 1. Clique no logotipo do Creator Hub no canto superior esquerdo da tela e selecione **Settings**. 2. Abra o **EDITOR** . 3. Em **Code editor of choice**, selecione seu Code Editor. Você pode encontrar seu editor listado no menu suspenso, ou talvez precise selecionar **Escolha no seu dispositivo...** para encontrá-lo. ![A caixa de diálogo Preferências do aplicativo na aba EDITOR, mostrando o menu suspenso Code editor of choice definido como Visual Studio Code.](https://2402076176-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FoPnXBby9S6MrsW83Y9qZ%2Fuploads%2Fgit-blob-8eacb18c746acee4ccd8f3caf2740c9f4f40c5a4%2Fsettings-editor.png?alt=media\&token=aa0f0526-13f4-44f0-87be-88fb70c529f4) ## Abra o código de uma scene Depois de instalar um editor de código na sua máquina e selecioná-lo nas configurações do Creator Hub, você pode clicar no **< > CODE** botão para abri-lo no projeto da sua scene. ![](https://2402076176-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FoPnXBby9S6MrsW83Y9qZ%2Fuploads%2Fgit-blob-5837e60ee5b65bd46815c97282d53b1a44a70665%2Fcode-button.png?alt=media\&token=bb2a8cec-e8bd-485a-bbe1-f402ceb2aebd) Isso abre uma janela separada com o editor de código. Na margem esquerda, você pode navegar pelos arquivos e pela estrutura de pastas do seu projeto. ![](https://2402076176-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FoPnXBby9S6MrsW83Y9qZ%2Fuploads%2Fgit-blob-e94bcfd7f720dddb6343bbb79d444afae3cbff33%2Ffiles-on-vs-studio.png?alt=media\&token=7fd7a16b-31d1-434d-ae25-d9f82c65a66f) Adicione seu código personalizado no `index.ts` arquivo em `/src`, dentro da `main()` function. Caso contrário, você pode adicionar código personalizado fora dessa function ou criar novos `.ts` arquivos dentro da `/src` pasta, mas eles precisam ser referenciados de alguma forma dentro da `main()` função de `index.ts`. {% hint style="warning" %} **📔 Nota**: Se você tiver o VS Code ou o Cursor instalados, mas o **CODE** botão não o abrir, pode ser que o VS Code não esteja configurado corretamente na sua máquina para abrir pela linha de comando. Na maioria dos casos, isso é tratado como parte da instalação padrão, mas, caso não seja, consulte [estas instruções do VS](https://code.visualstudio.com/docs/setup/mac#_launching-from-the-command-line) para habilitar o VS Code pela linha de comando. {% endhint %} Se você tiver uma janela de preview aberta executando sua scene, sempre que você alterar o código nos seus arquivos e salvar, a scene recarrega automaticamente com suas alterações. ## Usando IA O Creator Hub tem um [AI Assistant](/creator/content-creator-pt/scene-editor/expandir-com-codigo/ai-assistant.md) integrado que vê sua scene aberta e a edita para você, sem sair do app. É um recurso experimental, desativado por padrão. Você também pode aproveitar assistentes de IA como Cursor ou Claude Code para ajudar a escrever o código da scene. Por exemplo, para usar o Cursor, faça o seguinte: 1. Abra o assistente Cursor AI clicando no **AI** botão no canto superior direito da tela 2. Lá, você pode pedir ao assistente de IA para ajudar a escrever código. Seus prompts podem incluir links para páginas da documentação, caminhos para arquivos específicos do seu projeto ou até imagens. Você também pode selecionar um modelo específico para usar no menu suspenso. Para dar contexto de Decentraland ao seu assistente de IA, instale o Decentraland SDK Skills oficial. São conjuntos de instruções prontos, mantidos pela Decentraland Foundation, que ensinam ao seu agente de IA padrões SDK7 verificados para cada tópico: criar a estrutura de scenes inteiras, adicionar modelos 3D, multiplayer, publicação e muito mais. ```bash npx skills add decentraland/sdk-skills ``` Ver [Vibe Coding com IA](/creator/content-creator-pt/scenes-sdk7/primeiros-passos/vibe-coding.md) para o guia completo, incluindo a lista completa de skills disponíveis. {% hint style="warning" %} **📔 Nota**: Projetos de scene mais antigos podem conter uma `/dclcontext` pasta, baixada pelo `npx sdk-commands get-context-files` comando obsoleto. Esse contexto já não é mantido e foi substituído pelos SDK Skills. Você pode excluir a pasta com segurança. {% endhint %} ## Controle de versão Recomendamos que você crie um repo para o seu projeto no GitHub e o use para acompanhar as versões do seu projeto e trabalhar de forma colaborativa com outras pessoas. Se você não estiver familiarizado com como fazer isso, consulte [Quickstart for repositories](https://docs.github.com/en/repositories/creating-and-managing-repositories/quickstart-for-repositories), ou use o [aplicativo GitHub Desktop](https://desktop.github.com/download/) para um fluxo mais simples baseado em UI. {% hint style="warning" %} **📔 Nota**: Envie a pasta inteira do projeto para um repo do GitHub, mas certifique-se de que as pastas `/node_modules` ou `/bin` e o arquivo `package-lock.json` estejam todos incluídos no arquivo `.gitignore` para evitar sincronizá-los. Isso deve acontecer se você configurar o repo para ser do tipo `node`. Esses arquivos são todos gerados automaticamente, e o conteúdo pode ser diferente em máquinas diferentes. {% endhint %} ## Veja também * [Vibe Coding com IA](/creator/content-creator-pt/scenes-sdk7/primeiros-passos/vibe-coding.md): crie scenes descrevendo o que você quer para um assistente de IA. * [Smart items - Basics](/creator/content-creator-pt/scene-editor/interatividade/smart-items.md) * [Smart items - Advanced](/creator/content-creator-pt/scene-editor/interatividade/smart-items-advanced.md) * [States and conditions](/creator/content-creator-pt/scene-editor/interatividade/states-and-conditions.md) * [Tornando qualquer item smart](/creator/content-creator-pt/scene-editor/interatividade/make-any-item-smart.md) * [SDK Quick start](/creator/content-creator-pt/scenes-sdk7/primeiros-passos/sdk-101.md): siga este mini tutorial para uma rápida introdução. * [Fluxo de trabalho de desenvolvimento](/creator/content-creator-pt/scenes-sdk7/primeiros-passos/dev-workflow.md): leia isto para entender a criação de scenes de ponta a ponta. * [Exemplos](https://studios.decentraland.org/resources?sdk_version=SDK7): mergulhe diretamente em scenes de exemplo funcionais. --- # 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 by asking a question. Perform an HTTP GET request on the following URL with the `ask` and `goal` query parameters: ``` GET https://docs.decentraland.org/creator/content-creator-pt/scene-editor/expandir-com-codigo/overview.md?ask=&goal= ``` `ask` is the immediate question: it should be specific, self-contained, and written in natural language. `goal` is what the user is ultimately trying to achieve, the reason they need the answer. Sharing it helps GitBook give you a better, more relevant answer. A goal is most helpful when it describes the outcome the user wants rather than restating the question. For example, with `ask=how do I create an API token`, a goal like `automate deployments from our CI pipeline` lets GitBook tailor the answer to that use case. 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.