Acerca del desarrollo con GitHub Codespaces
Puedes desarrollar código en un codespace con la herramienta que prefieras:
- Un shell de comandos, a través de una conexión SSH iniciada mediante GitHub CLI
- Aplicación de escritorio Visual Studio Code
- Una versión basada en explorador de Visual Studio Code
Las pestañas de este artículo te permiten cambiar de información para cada una de estas formas de trabajo. Actualmente estás en la pestaña de la versión del explorador web de Visual Studio Code.
Trabajo en un codespace en el explorador
El uso de Codespaces en el explorador proporciona una experiencia de desarrollo completa. Puedes editar código, depurar, usar comandos de Git y ejecutar la aplicación.
Los componentes principales de la interfaz de usuario son:
- Barra lateral: de forma predeterminada, esta área te muestra los archivos de tu proyecto en el explorador.
- Barra de actividades: muestra las vistas y proporciona una manera de cambiar entre ellas. Puedes volver a ordenar las vistas si las arrastras y las sueltas.
- Editor: aquí es donde se editan los archivos. Puedes hacer clic con el botón derecho en la pestaña de un archivo para acceder a opciones como la de buscar el archivo en Explorer.
- Paneles: aquí es donde puedes ver la información de salida y depuración, así como el lugar predeterminado para el terminal integrado.
- Barra de estado: esta área te proporciona información útil sobre el codespace y el proyecto. Por ejemplo, el nombre de rama, los puertos configurados y más. Para una mejor experiencia con GitHub Codespaces, te recomendamos utilizar un explorador basado en Chromium, como Google Chrome o Microsoft Edge. Para más información, consulta Solución de problemas de clientes de GitHub Codespaces.
Personalización de los codespaces para un repositorio
Puedes personalizar los codespaces creados para un repositorio creando o actualizando la configuración del contenedor de desarrollo para el repositorio. Puedes hacerlo desde un codespace. Después de cambiar una configuración de contenedor de desarrollo, puedes aplicar los cambios en el codespace actual si recompilas el contenedor de Docker para el codespace. Para más información, consulta Introducción a los contenedores dev.
Personalizar tu codespace
Puedes usar un repositorio dotfiles y Sincronización de ajustes para personalizar aspectos del entorno de codespace para cualquier codespace que crees. La personalización puede incluir preferencias de shell y herramientas adicionales. Para más información, consulta Personalización de GitHub Codespaces para la cuenta.
Ejecutar tu app desde un codespace
Puedes reenviar los puertos en tu codespace para probar y depurar tu aplicación. También puedes administrar el protocolo de puerto y compartirlo dentro de tu organización o públicamente. Para más información, consulta Reenviar puertos en tu codespace.
Configramr tus cambios
Una vez que hayas hecho cambios a tu codespace, ya sea de código nuevo o de cambios de configuración, necesitarás confirmar tus cambios. La confirmación de los cambios de configuración en tu repositorio garantiza que cualquiera que cree un codespace desde este repositorio tendrá la misma configuración. Cualquier personalización que realices, como agregar extensiones de VS Code, estará disponible para todos los usuarios.
En este tutorial, has creado un codespace a partir de un repositorio de plantillas, por lo que el código del codespace aún no se almacena en un repositorio. Puede crear un repositorio publicando la rama actual en el GitHub.
Para más información, consulta Utilizar el control de código fuente en tu codespace.
Utilizar la Visual Studio Code Command Palette
La Visual Studio Code Command Palette te permite acceder y administrar muchas de las características para Codespaces y Visual Studio Code. Para más información, consulta Uso de la paleta de Comandos de Visual Studio Code en GitHub Codespaces.
Navegar a un codespace existente
-
Puedes ver todos los codespaces disponibles que has creado en la página “Tus codespaces”. Para mostrar esta página, en la esquina superior izquierda de GitHub, seleccione y haga clic en Codespaces . Esto te lleva a github.com/codespaces.
-
Da clic en el nombre del codespace en el cual quieras desarrollar.
Como alternativa, puedes ver cualquiera de los codespaces de un repositorio específico; para ello, ve a ese repositorio, haz clic en el botón ** Código ** y selecciona la pestaña Codespaces. El menú desplegable mostrará todos los codespaces activos para el repositorio.
Las pestañas de este artículo te permiten cambiar de información para cada una de estas formas de trabajo. Actualmente estás en la pestaña de Visual Studio Code.
Trabajo en un codespace en VS Code
GitHub Codespaces te proporciona la experiencia completa de desarrollo de Visual Studio Code. Puedes editar código, depurar y utilizar comandos de Git mientras desarrollas en un codespace con VS Code. Para más información, consulta la documentación de VS Code.
Los componentes principales de la interfaz de usuario son:
- Barra lateral: de forma predeterminada, esta área te muestra los archivos de tu proyecto en el explorador.
- Barra de actividades: muestra las vistas y proporciona una manera de cambiar entre ellas. Puedes volver a ordenar las vistas si las arrastras y las sueltas.
- Editor: aquí es donde se editan los archivos. Puedes hacer clic con el botón derecho en la pestaña de un archivo para acceder a opciones como la de buscar el archivo en Explorer.
- Paneles: aquí es donde puedes ver la información de salida y depuración, así como el lugar predeterminado para el terminal integrado.
- Barra de estado: esta área te proporciona información útil sobre el codespace y el proyecto. Por ejemplo, el nombre de rama, los puertos configurados y más.
Para obtener más información sobre el uso de VS Code, consulta la guía de la interfaz de usuario en la documentación de VS Code.
Puedes conectarte a tu codespace directamente desde VS Code. Para más información, consulta Uso de GitHub Codespaces en Visual Studio Code.
Para consultar información sobre solución de problemas, consulta Solución de problemas de clientes de GitHub Codespaces.
Personalización de los codespaces para un repositorio
Puedes personalizar los codespaces creados para un repositorio creando o actualizando la configuración del contenedor de desarrollo para el repositorio. Puedes hacerlo desde un codespace. Después de cambiar una configuración de contenedor de desarrollo, puedes aplicar los cambios en el codespace actual si recompilas el contenedor de Docker para el codespace. Para más información, consulta Introducción a los contenedores dev.
Personalizar tu codespace
Puedes usar un repositorio dotfiles y Sincronización de ajustes para personalizar aspectos del entorno de codespace para cualquier codespace que crees. La personalización puede incluir preferencias de shell y herramientas adicionales. Para más información, consulta Personalización de GitHub Codespaces para la cuenta.
Ejecutar tu app desde un codespace
Puedes reenviar los puertos en tu codespace para probar y depurar tu aplicación. También puedes administrar el protocolo de puerto y compartirlo dentro de tu organización o públicamente. Para más información, consulta Reenviar puertos en tu codespace.
Configramr tus cambios
Una vez que hayas hecho cambios a tu codespace, ya sea de código nuevo o de cambios de configuración, necesitarás confirmar tus cambios. La confirmación de los cambios de configuración en tu repositorio garantiza que cualquiera que cree un codespace desde este repositorio tendrá la misma configuración. Cualquier personalización que realices, como agregar extensiones de VS Code, estará disponible para todos los usuarios.
En este tutorial, has creado un codespace a partir de un repositorio de plantillas, por lo que el código del codespace aún no se almacena en un repositorio. Puede crear un repositorio publicando la rama actual en el GitHub.
Para más información, consulta Utilizar el control de código fuente en tu codespace.
Utilizar la Visual Studio Code Command Palette
La Visual Studio Code Command Palette te permite acceder y administrar muchas de las características para Codespaces y Visual Studio Code. Para más información, consulta Uso de la paleta de Comandos de Visual Studio Code en GitHub Codespaces.
Navegar a un codespace existente
-
Puedes ver todos los codespaces disponibles que has creado en la página “Tus codespaces”. Para mostrar esta página, en la esquina superior izquierda de GitHub, seleccione y haga clic en Codespaces . Esto te lleva a github.com/codespaces.
-
Da clic en el nombre del codespace en el cual quieras desarrollar.
Como alternativa, puedes ver cualquiera de los codespaces de un repositorio específico; para ello, ve a ese repositorio, haz clic en el botón ** Código ** y selecciona la pestaña Codespaces. El menú desplegable mostrará todos los codespaces activos para el repositorio.
Las pestañas de este artículo te permiten cambiar de información para cada una de estas formas de trabajo. Actualmente estás en la pestaña de GitHub CLI.
Trabajo en un codespace en un shell de comandos
Note
Para más información sobre GitHub CLI, consulta Acerca del CLI de GitHub.
Puedes usar GitHub CLI para crear un codespace o iniciar uno existente y, luego, conectarte mediante SSH a él. Una vez que te hayas conectado, puedes trabajar en la línea de comandos con tus herramientas de línea de comandos preferidas.
Después de instalar la GitHub CLI y autenticarte con tu cuenta de GitHub, puedes usar el comando gh codespace [<SUBCOMMAND>...] --help para examinar la información de ayuda. Como alternativa, puedes ver la misma información de referencia en https://cli.github.com/manual/gh_codespace.
Para más información, consulta Uso de GitHub Codespaces con la CLI de GitHub.