Nota:
Al abrir un repositorio en github.dev, se abre en VS Code for the Web, la versión para navegador de VS Code. Para obtener más información, consulte VS Code for the Web la VS Code documentación.
Acerca de VS Code for the Web
VS Code for the Web es una experiencia de edición ligera que se ejecuta completamente en el explorador. Con VS Code for the Web, puede navegar por archivos y repositorios de código fuente desde GitHuby realizar y confirmar cambios en el código. Puedes abrir cualquier repositorio, fork o pull request en el editor.
VS Code for the Web está disponible para todos los usuarios de forma gratuita en GitHub.com.
VS Code for the Web proporciona muchas de las ventajas de Visual Studio Code, como la búsqueda, el resaltado de sintaxis y una vista de control de código fuente. También puede usar Settings Sync para compartir sus propios ajustes de VS Code en el editor. Consulte Sincronización de configuración en la VS Code documentación.
VS Code for the Web se ejecuta por completo en el entorno aislado de tu navegador. El editor no clona el repositorio, sino que usa la extensión GitHub Repositorios para llevar a cabo la mayor parte de la funcionalidad que usará. Tu trabajo se guarda en el almacenamiento local de tu buscador hasta que lo confirmes. Debes confirmar tus cambios frecuentemente para asegurarte de que siempre sean accesibles.
Debe iniciar sesión en GitHub para usar VS Code for the Web.
Abriendo VS Code for the Web desde GitHub
Puede abrir en GitHub cualquier repositorio de VS Code for the Web de cualquiera de las siguientes formas:
-
Para abrir el repositorio en la misma pestaña del explorador, presiona . al examinar cualquier repositorio o solicitud de incorporación de cambios en GitHub.
Para abrir el repositorio en una pestaña nueva del explorador, presiona >.
-
Cambiando la URL de "github.com" a "github.dev".
-
Al ver un archivo, seleccione el menú desplegable y haga clic en github.dev.
Codespaces y VS Code for the Web
Tanto VS Code for the Web como GitHub Codespaces permiten editar el código directamente desde el repositorio. Sin embargo, ambos tienen beneficios ligeramente diferentes, dependiendo de tu caso de uso.
| VS Code for the Web | GitHub Codespaces | |
|---|---|---|
| Costo | Libre. | Cuota mensual gratuita de uso para cuentas personales, consulta facturación de GitHub Codespaces. |
| Availability | Disponible para todos los usuarios de GitHub.com. | Disponible para todos los usuarios de GitHub.com. |
| Inicio | VS Code for the Web se abre al instante con una tecla presionada y puede empezar a usarlo inmediatamente, sin tener que esperar a una configuración o instalación adicionales. | Al crear o reanudar un codespace, se le asigna una máquina virtual y el contenedor se configura en función del contenido de un archivo devcontainer.json. Esta configuración puede tomar algunos minutos para crear el ambiente. Consulta Creación de un codespace para un repositorio. |
| Proceso | No hay ningún proceso asociado, por lo que no podrá compilar y ejecutar el código ni usar un terminal integrado. | Con GitHub Codespaces, obtiene la eficacia de una máquina virtual dedicada en la que puede ejecutar y depurar la aplicación, y puede usar el terminal exactamente como lo haría en el entorno local. |
| Extensiones | Solo aparecerá un subconjunto de extensiones que se pueden ejecutar en la web en la vista Extensiones y se puede instalar. Consulta Uso de extensiones. | Con GitHub Codespaces, puede usar la mayoría de las extensiones del Visual Studio Code Marketplace. |
Utilizar el control de código fuente
Cuando se usa VS Code for the Web, todas las acciones se administran a través de la vista "Control de código fuente", que se encuentra en la barra de actividad del lado izquierdo. Para obtener más información sobre la vista "Control de versiones", consulte Control de versiones en la documentación de VS Code.
Dado que VS Code for the Web usa la extensión repositorios de GitHub para impulsar su funcionalidad, puede cambiar las ramas sin necesidad de guardar los cambios. Consulte Repositorios de GitHub en la VS Code documentación.
Creación de una rama
-
Si la rama actual no se muestra en la barra de estado, en la parte inferior de tu codespace, haga clic derecho en la barra de estado y seleccione Source control (Control de código fuente).
-
Haz clic en el nombre de rama en la barra de estado.
-
En el menú desplegable, haz clic en la rama a la que deseas cambiar o escribe el nombre de una rama nueva y haz clic en Crear nueva rama.
Confirmación de los cambios
-
En la barra de actividad, haga clic en la vista Control de código fuente.
-
Para almacenar provisionalmente los cambios, haga clic junto al archivo que ha cambiado o junto a Cambios si ha cambiado varios archivos y desea almacenarlos provisionalmente.
-
En el cuadro de texto, teclea un mensaje de confirmación que describa el cambio que hiciste.
-
Haz clic en Commit & Push.
Tus cambios se enviarán automáticamente a tu rama en GitHub.
Crea una solicitud de incorporación de cambios
-
Después de confirmar los cambios en la copia local del repositorio, haz clic en el icono de solicitud de incorporación de cambios situado en la parte superior de la barra lateral "Control de código fuente".
-
Verifica que el repositorio y la rama local desde la que estás haciendo la fusión y la rama y repositorio remotos hacia los que estés haciendo la fusión sean correctos. Después, asigna un nombre y descripción a la solicitud de cambios.
-
Haga clic en Crear.
Trabajar con un pull request existente
Puede usar VS Code for the Web para trabajar con una solicitud de incorporación de cambios existente.
- Vaya a la solicitud de incorporación de cambios que desea abrir en VS Code for the Web.
- Presione
.para abrir la solicitud de incorporación de cambios en VS Code for the Web. - Una vez que haya realizado los cambios, confírmelos siguiendo los pasos descritos en Confirmación de los cambios. Tus cambios se confirmarán directamente en la rama, no es necesario subirlos.
Uso de extensiones
VS Code for the Web admite VS Code extensiones que se han creado o actualizado específicamente para ejecutarse en la web. A estas extensiones se les conoce como "extensiones web". Para obtener información sobre cómo puede crear una extensión web o actualizar la extensión existente para que funcione para la web, consulte Extensiones web en la VS Code documentación.
Las extensiones que pueden ejecutarse en VS Code for the Web aparecerán en la vista Extensiones y se pueden instalar. Si utilizas la sincronización de ajustes, cualquier extensión compatible también se instala automáticamente. Para obtener información, consulte Configuración sincronizada en la VS Code documentación.