> 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). # Combinar com 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 states, e escrever código que detecta quando a alavanca é puxada para executar sua própria lógica personalizada. Veja [Referenciar itens no código](/creator/content-creator-pt/scene-editor/expandir-com-codigo/reference-items.md) para saber como obter itens por nome ou por tags a partir do seu código. ## Editar 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 developers experientes. * Cursor [Cursor AI](https://www.cursor.com/): Este é um poderoso editor de código integrado com IA. Permite-lhe escolher diferentes modelos de IA para o ajudar a escrever código; existe um plano gratuito, e os modelos mais avançados requerem um plano pago. Esta é uma boa opção para developers que são novos no Decentraland ou no TypeScript, ou se quiser poupar tempo a escrever código. {% hint style="warning" %} **📔 Observação**: 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 você precise selecionar o seu Code Editor nas configurações do Creator Hub. Para fazer isso, 1. Abra o ícone da roda no canto superior direito do ecrã 2. Em **Code editor of choice**, selecione o seu Code Editor. Pode encontrar o seu editor listado no dropdown, ou talvez precise de selecionar **Escolher do seu dispositivo...** para o encontrar. ## 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. ![](/files/16f4f615feb89b86fdb2b77e9b2ffb308d21e227) 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. ![](/files/f59a8d5caceb94445ab4f28447c9cfb42697cc11) Adicione o 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 de alguma forma referenciados dentro da `main()` function de `index.ts`. {% hint style="warning" %} **📔 Observação**: 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, veja [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 Você pode aproveitar assistentes de IA como Cursor ou Claude Code para ajudar você a escrever código da scene. Por exemplo, para usar o Cursor, faça o seguinte: 1. Abra o assistente de IA do Cursor clicando no **AI** botão no canto superior direito da tela 2. Lá você pode enviar prompts ao assistente de IA para ajudar você a escrever código. Seus prompts podem incluir links para páginas da documentação, paths para arquivos específicos do seu projeto ou até imagens. Você também pode selecionar um modelo específico para usar no dropdown. Decentraland fornece uma pasta de contexto para o assistente de IA ajudar você a escrever código; essa pasta de contexto está localizada em `/dclcontext` no projeto da sua scene. O assistente de IA saberá pesquisar esse contexto sempre que gerar código, para se familiarizar com o Decentraland SDK. Essa pasta é atualizada com os arquivos de contexto mais recentes toda vez que as dependências da sua scene são atualizadas. Você também pode forçar a atualização dessa pasta executando o seguinte: ``` npx sdk-commands get-context-files ``` {% hint style="info" %} **💡 Dica**: Você também pode adicionar seus próprios arquivos de contexto a essa pasta para ajudar o assistente de IA a entender sua scene e seu projeto. Se fizer isso, certifique-se de adicioná-los a um novo arquivo nessa pasta, pois os arquivos padrão são substituídos quando as atualizações do SDK acontecem. {% endhint %} {% hint style="info" %} **💡 Dica**: Quer ir além com IA? Você pode instalar Decentraland skills no seu agente de IA preferido para estruturar scenes inteiras, adicionar multiplayer, deploy e muito mais — tudo a partir de prompts em linguagem natural. Veja [Vibe Coding com IA](/creator/content-creator-pt/scenes-sdk7/primeiros-passos/vibe-coding.md) para o guia completo. {% 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 em colaboração com outras pessoas. Se você não estiver familiarizado com como fazer isso, veja [Quickstart para repositórios](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" %} **📔 Observação**: Envie a pasta inteira do projeto para um repo no GitHub, mas certifique-se de que as `/node_modules` ou `/bin` pastas e o `package-lock.json` arquivo estejam todos incluídos no `.gitignore` arquivo, para evitar sincronizá-los. Esse deve ser o caso se você configurar o repo como do tipo `node`. Esses arquivos são todos gerados automaticamente, e o conteúdo pode diferir entre 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 a um assistente de IA. * [Smart items - Noções básicas](/creator/content-creator-pt/scene-editor/interatividade/smart-items.md) * [Smart Items - Avançado](/creator/content-creator-pt/scene-editor/interatividade/smart-items-advanced.md) * [Estados e condições](/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) * [Início rápido do SDK](/creator/content-creator-pt/scenes-sdk7/primeiros-passos/sdk-101.md): siga este mini tutorial para uma introdução rápida. * [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 do início ao fim. * [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 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-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 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.