Introducción a los espacios de código de Visual Studio: IDE en la nube
El IDE basado en la web de Visual Studio (anteriormente Visual Studio Online / VSO) ya está disponible para su uso. Basado en el popular editor de código de Visual Studio, ofrece una sensación familiar y un espacio de trabajo para escribir y trabajar con código fuente.. Esto también ofrece la extensibilidad de admitir extensiones de código de Visual Studio, aunque en este momento no sabemos cuántas extensiones de código VS o cuáles serán compatibles.
- Crear su primer Codespace de Visual Studio & Plan de facturación
- Editar, Confirmar y Sincronizar Cambios de código usando Espacios de código de Visual Studio
- Instalar extensiones en espacios de código de Visual Studio
- Recursos de espacios de código de Visual Studio en su suscripción de Azure
- Envolver
- Sobre el autor
Crear su primer Codespace de Visual Studio & Plan de facturación
Aquí encontrará una descripción general del inicio de sesión en Codespaces de Visual Studio (el IDE basado en la nube de Microsoft) y los primeros pasos con las herramientas.
- Comience abriendo un navegador web y navegando a https://online.visualstudio.com
- Una vez que haya iniciado sesión, por primera vez, verá una pantalla que muestra que no tiene ningún entorno, con un botón Crear espacio de código.
- Haga clic en el botón Crear espacio de código.
- Esto abrirá el panel Crear un plan de facturación. Usará esto para especificar un nuevo Plan de Facturación de espacios de código de Visual Studio para crear dentro de su suscripción de Azure.
Especifique los siguientes valores en este panel:- Suscripción: Elija la Suscripción de Azure a la que tiene acceso su inicio de sesión y en la que desea crear el nuevo Plan de facturación.
- Ubicación: Elija la región de Azure para alojar el Plan de facturación.
- De forma opcional, puede expandir Opciones avanzadas para mostrar la siguiente configuración:
- Nombre del plan: Especifique el nombre del Plan de facturación que se creará dentro de su suscripción de Azure.Grupo de recursos
- : Especifique el nombre del Grupo de recursos en el que se colocará el nuevo Plan de Facturación.
- Rellene los valores que desee y, a continuación, haga clic en Crear.
- Con el Plan de facturación recién creado, se abrirá automáticamente el panel Crear espacio de código.
- Para crear su primer espacio de código, rellene los valores necesarios y, a continuación, haga clic en Crear. Puede usar los siguientes valores para probar esto por primera vez.
- Nombre de espacio de código: Especifique un nombre para el nuevo espacio de código. Debe usar un nombre que se asemeje al proyecto o tarea para la que usará este entorno.
- Repositorio Git: Opcionalmente, especifique un repositorio Git para este espacio de código a clonar. Esto se puede especificar en dos formatos diferentes:
- URL del proyecto GitHub: Puede especificar la URL completa de la página de inicio de un proyecto GitHub. Tales como
https://github.com/build5nines/az-kung-fu. - Forma corta de GitHub: Puede especificar un nombre de repositorio de GitHub con formato delimitado por barras en el formato
organization/repo; comobuild5nines/az-kung-fu.
- URL del proyecto GitHub: Puede especificar la URL completa de la página de inicio de un proyecto GitHub. Tales como
- Tipo de instancia: Especifique el núcleo de la CPU y la configuración de memoria que se aprovisionarán para el espacio de códigos de Visual Studio.
- Suspender el espacio de código inactivo después de…: Especifique el tiempo hasta que el espacio de código se suspenda automáticamente cuando no esté en uso.
- El espacio de código de Visual Studio que se acaba de crear ahora se abrirá en el editor de código / IDE en línea.
Editar, Confirmar y Sincronizar Cambios de código usando Espacios de código de Visual Studio
Aquí hay una descripción general de cómo abrir el editor de espacios de código de Visual Studio, realizar algunos cambios de código y volver a confirmar esos cambios en el repositorio GitHub para un espacio de código.
-
En el panel Espacio de trabajo en el lado izquierdo de la pantalla, haga clic en un archivo del proyecto para abrirlo en el editor.
-
Realice algunos cambios en el archivo y, a continuación, guárdelos haciendo clic en el menú hamburguesa en la parte superior izquierda, seleccionando Archivo y, a continuación, Guardar.
Nota: Puede ver que hay varias opciones de menú disponibles en el editor de espacios de código de Visual Studio, y que es la misma experiencia de estilo de código VS que le ha llegado a encantar.
-
Para confirmar tus cambios en el Repositorio Git “local” de Visual Studio Online (que fue clonado desde GitHub), haz clic en la pestaña Control de código Fuente en el lado izquierdo de la ventana, luego usa la interfaz de usuario para agregar cambios y confirmarlos.
-
Una vez confirmados los cambios, puedes sincronizarlos con el Repositorio de GitHub haciendo clic en la elipse (…) dentro de la pestaña Control de código fuente y, a continuación, seleccionando la opción Sincronizar.
-
Se le pedirá una confirmación de que desea “empujar y tirar confirmaciones hacia y desde’origin/master'”. Haga clic en Aceptar para continuar con la acción de sincronización.
-
La primera vez que lo hagas, Visual Studio Online abrirá una nueva pestaña del navegador en la página de autorización de GitHub para que puedas autorizar los espacios de códigos de Visual Studio con los permisos necesarios que necesita en GitHub para tu cuenta.
-
hacer Clic en el botón Autorizar se autorizará a Visual Studio Codespaces para acceder a tu Cuenta de GitHub.
-
Una vez autorizados los espacios de código de Visual Studio, completará la operación de sincronización con el Repositorio de GitHub. Ahora puedes navegar a GitHub para ver que la confirmación se ha sincronizado.
Instalar extensiones en espacios de código de Visual Studio
El editor de espacios de código de Visual Studio basado en la web se basa en el código de Visual Studio (VS Code). Como tal, comparte muchas cosas, incluida una interfaz / experiencia de usuario familiar y la capacidad de instalar extensiones de código VS. Esto le permite utilizar esencialmente el mismo editor de código VS con Extensiones instaladas desde su navegador web, en cualquier dispositivo.
Puede instalar Extensiones en espacios de código de Visual Studio de la misma manera que instala extensiones en Código VS.
- Abra la pestaña Extensiones haciendo clic en el icono situado en el lado izquierdo del editor
- Busque y localice las extensiones que desee.
- Haga clic en el botón Instalar de la extensión para instalarla en el editor de espacios de código de Visual Studio.
Recursos de espacios de código de Visual Studio en su suscripción de Azure
Cuando crea un Plan de Facturación de espacios de código de Visual Studio, ese plan se factura con su suscripción de Azure. Esto significa que el Plan de facturación se crea dentro de su suscripción de Azure y reside junto con todos los demás recursos de Azure.
-
VS Codespaces Plan de Facturación dentro de Azure -
VS Codespaces Plan de Facturación dentro del Grupo de Recursos
Envolver
Como se puede ver de Visual Studio Codespaces (anteriormente Visual Studio Online) es bastante fácil para empezar con. Además, el uso de la interfaz de usuario y la experiencia del IDE de código de Visual Studio hace que el editor de espacios de código VS sea familiar de usar. ¡Incluso puede instalar extensiones en espacios de código de Visual Studio!
¡Feliz codificación!
P.D. Anunciado originalmente en mayo de 2019 como Visual Studio Online (VSO), es increíble obtener finalmente acceso público y poder comenzar a probar / usar los espacios de códigos de Visual Studio.
Sobre el autor
Chris es el fundador de Build5Nines.com y un MVP de Microsoft en Azure & IoT con 20 años de experiencia diseñando y creando sistemas empresariales en la nube &. También tiene Certificación de Microsoft: Arquitecto de soluciones de Azure, desarrollador, Entrenador Certificado de Microsoft (MCT) y Defensor de la nube. Tiene una pasión por la tecnología y por compartir lo que aprende con otros para ayudarlos a aprender más rápido y ser más productivos.
