> 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-es/scene-editor/extender-con-codigo/overview.md). # Combinar con código Combina contenido creado en el Scene Editor con el poder de escribir código. {% embed url="" %} Creator Hub más código personalizado es una combinación muy potente para crear contenido. Puedes usar el canvas para colocar visualmente items de forma intuitiva, y luego escribir código que interactúe con estos items con total libertad. Incluso puedes colocar un smart item, que tiene su propio comportamiento predeterminado, y escribir código que reaccione cuando el item se active. Por ejemplo, puedes aprovechar un smart item de palanca existente, que ya viene con sus sonidos, animaciones y estados, y escribir código que detecte cuándo se tira de la palanca para ejecutar tu propia lógica personalizada. Ver [Referenciar items en código](/creator/content-creator-es/scene-editor/extender-con-codigo/reference-items.md) para ver cómo obtener items por nombre o por tags desde tu código. ## Edición de código Debes instalar un editor de código en tu máquina para editar el código de tu escena. Las opciones recomendadas son: * VS Code [Visual Studio Code](https://code.visualstudio.com/): Esta es la opción recomendada para desarrolladores experimentados. * Cursor [Cursor AI](https://www.cursor.com/): Este es un potente editor de código integrado con IA. Te permite elegir distintos modelos de IA para ayudarte a escribir código; hay un nivel gratuito disponible, y los modelos más avanzados requieren un plan de pago. Esta es una buena opción para desarrolladores que son nuevos en Decentraland o TypeScript, o si quieres ahorrar tiempo escribiendo código. {% hint style="warning" %} **📔 Nota**: Si estás en macOS, asegúrate de que la app del editor de código esté en el directorio Applications. {% endhint %} Una vez instalado, puede que necesites seleccionar tu Code Editor en la configuración de Creator Hub. Para hacerlo, 1. Haz clic en el logo de Creator Hub en la esquina superior izquierda de la pantalla y selecciona **Configuración**. 2. Abre la **EDITOR** pestaña. 3. En **Editor de código preferido**, selecciona tu editor de código. Puede que encuentres tu editor en el dropdown, o puede que necesites seleccionar **Elegir desde tu dispositivo...** para encontrarlo. ![El diálogo de Preferencias de la app en la pestaña EDITOR, que muestra el desplegable de editor de código preferido configurado en Visual Studio Code.](https://1216664193-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FoPnXBby9S6MrsW83Y9qZ%2Fuploads%2Fgit-blob-8eacb18c746acee4ccd8f3caf2740c9f4f40c5a4%2Fsettings-editor.png?alt=media) ## Abrir el código de una escena Una vez que hayas instalado un editor de código en tu máquina y lo hayas seleccionado en la configuración de Creator Hub, puedes hacer clic en el **< > CODE** botón para abrirlo en el proyecto de tu escena. ![](https://1216664193-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FoPnXBby9S6MrsW83Y9qZ%2Fuploads%2Fgit-blob-5837e60ee5b65bd46815c97282d53b1a44a70665%2Fcode-button.png?alt=media) Esto abre una ventana separada con el editor de código. En el margen izquierdo puedes navegar por los archivos y la estructura de carpetas de tu proyecto. ![](https://1216664193-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) Añade tu código personalizado en el `index.ts` archivo dentro de `/src`, dentro de la `main()` function. De lo contrario, puedes añadir código personalizado fuera de esa función o crear nuevos `.ts` archivos dentro de la `/src` carpeta, pero estos deben estar de alguna manera referenciados dentro de la `main()` función de `index.ts`. {% hint style="warning" %} **📔 Nota**: Si tienes VS Code o Cursor instalados, pero el **CODE** botón no lo abre, puede que VS Code no esté configurado correctamente en tu máquina para abrirse desde la línea de comandos. En la mayoría de los casos, esto se gestiona como parte de la instalación predeterminada, pero si no es así, consulta [estas instrucciones de VS](https://code.visualstudio.com/docs/setup/mac#_launching-from-the-command-line) para habilitar VS Code desde la línea de comandos. {% endhint %} Si tienes una ventana de vista previa abierta ejecutando tu escena, cada vez que cambias el código en tus archivos y lo guardas, la escena se recarga automáticamente con tus cambios. ## Uso de IA Creator Hub tiene un asistente integrado [botón Asistente de IA](/creator/content-creator-es/scene-editor/extender-con-codigo/ai-assistant.md) que ve tu escena abierta y la edita por ti, sin salir de la app. Es una función experimental, desactivada por defecto. También puedes aprovechar asistentes de IA como Cursor o Claude Code para ayudarte a escribir código de escena. Por ejemplo, para usar Cursor, haz esto: 1. Abre el asistente de IA Cursor haciendo clic en el **AI** botón en la esquina superior derecha de la pantalla 2. Allí puedes pedirle al asistente de IA que te ayude a escribir código. Tus prompts pueden incluir enlaces a páginas de documentación, rutas a archivos específicos de tu proyecto o incluso imágenes. También puedes seleccionar un modelo específico para usar desde el desplegable. Para darle a tu asistente de IA contexto de Decentraland, instala las SDK Skills oficiales de Decentraland. Son conjuntos de instrucciones listos para usar, mantenidos por la Decentraland Foundation, que enseñan a tu agente de IA patrones verificados de SDK7 para cada tema: estructurar escenas completas, añadir modelos 3D, multiplayer, despliegue y más. ```bash npx skills add decentraland/sdk-skills ``` Ver [Vibe Coding con IA](/creator/content-creator-es/scenes-sdk7/primeros-pasos/vibe-coding.md) para la guía completa, incluida la lista completa de skills disponibles. {% hint style="warning" %} **📔 Nota**: Los proyectos de escenas más antiguos pueden contener una `/dclcontext` carpeta, descargada por el obsoleto `npx sdk-commands get-context-files` command. Ese contexto ya no se mantiene y ha sido reemplazado por las SDK Skills. Puedes eliminar la carpeta de forma segura. {% endhint %} ## Control de versiones Recomendamos que crees un repo para tu proyecto en GitHub y lo uses para hacer seguimiento de las versiones de tu proyecto y para colaborar con otras personas. Si no estás familiarizado con cómo hacerlo, consulta [Inicio rápido para repositorios](https://docs.github.com/en/repositories/creating-and-managing-repositories/quickstart-for-repositories), o usa la [aplicación de escritorio de GitHub](https://desktop.github.com/download/) para un flujo más sencillo basado en la UI. {% hint style="warning" %} **📔 Nota**: Sube toda la carpeta del proyecto a un repo de GitHub, pero asegúrate de que las `/node_modules` o `/bin` carpetas y el `package-lock.json` archivo estén todos incluidos en el `.gitignore` archivo, para evitar sincronizarlos. Esto debería ser así si configuras el repo como de tipo `node`. Estos archivos se generan automáticamente, y el contenido puede diferir entre distintas máquinas. {% endhint %} ## Ver también * [Vibe Coding con IA](/creator/content-creator-es/scenes-sdk7/primeros-pasos/vibe-coding.md): crea escenas describiendo lo que quieres a un asistente de IA. * [Smart items - Conceptos básicos](/creator/content-creator-es/scene-editor/interactividad/smart-items.md) * [Smart items - Advanced](/creator/content-creator-es/scene-editor/interactividad/smart-items-advanced.md) * [Estados y condiciones](/creator/content-creator-es/scene-editor/interactividad/states-and-conditions.md) * [Hacer smart cualquier item](/creator/content-creator-es/scene-editor/interactividad/make-any-item-smart.md) * [Inicio rápido del SDK](/creator/content-creator-es/scenes-sdk7/primeros-pasos/sdk-101.md): sigue este minitutorial para una introducción rápida. * [Flujo de desarrollo](/creator/content-creator-es/scenes-sdk7/primeros-pasos/dev-workflow.md): lee esto para entender la creación de escenas de principio a fin. * [Ejemplos](https://studios.decentraland.org/resources?sdk_version=SDK7): sumérgete directamente en escenas de ejemplo funcionales. --- # 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-es/scene-editor/extender-con-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.