Qué es Visual Studio Code Dev: La Revolución del IDE Basado en el Navegador

¡Ha llegado la era del desarrollo remoto y basado en navegador! Con VSCode.dev, ahora puedes programar directamente desde tu navegador, aprovechando las máquinas virtuales (VMs) remotas como entornos de desarrollo.

Activo desde 2021 como ya te compartí por entonces, el editor online de Visual Studio Code DEV ahora incluye nuevas e importantes características.

A continuación, vamos a explorar las características y beneficios de esta poderosa y actualizada herramienta.

Una Breve Vista General de VSCode.dev

VS Code es uno de los IDEs más populares debido a su equilibrio entre simplicidad y extensibilidad.

Bien sea que necesites un editor de texto ligero o una plataforma de desarrollo completa, VS Code cumple con ambas opciones.

VSCode.dev, la versión basada en navegador, lleva este poder al siguiente nivel al permitirte trabajar directamente desde tu navegador y conectándote sin problemas con entornos de desarrollo remotos.

Configuración de una Máquina Virtual Remota con VSCode.dev

Para comenzar con el desarrollo remoto en VSCode.dev, necesitarás tres cosas:

  1. Una máquina virtual remota con la herramienta de línea de comandos de VS Code instalada.
  2. Una cuenta de GitHub o Microsoft para gestionar permisos.
  3. El cliente de navegador VSCode.dev para establecer la conexión.

Aquí tienes una guía rápida para configurarlo:

  1. Instala la herramienta de línea de comandos de VS Code en tu VM remota (estoy usando una instancia Debian en Google Cloud Platform, pero cualquier VM funciona).
    $ code tunnel
    
  2. Crea un túnel: Después de iniciar el servidor, VSCode proporcionará una URL (por ejemplo `https://vscode.dev/tunnel/dev3`).

  3. Inicia sesión: Accede con tu cuenta de GitHub a través del menú Remote Explorer para otorgar permisos.

Accediendo y Gestionando Tu Entorno Remoto

Una vez conectado, podrás navegar por el sistema de archivos de la VM remota directamente en VSCode.dev.

Por ejemplo, abre un proyecto (como una aplicación .NET) y añádelo a tu espacio de trabajo para comenzar a trabajar de inmediato.

  • Confía en los Autores: Al abrir una carpeta, se te pedirá que confirmes si confías en los autores del proyecto. Selecciona «Sí» para continuar.
  • Explorador de Archivos: Podrás navegar por directorios remotos igual que lo harías en una instalación local de VS Code.

Instalación de Extensiones y Mejora de Tu Flujo de Trabajo ️

Al igual que en la versión de escritorio de VS Code, puedes instalar extensiones para ampliar la funcionalidad. Por ejemplo, para desarrollo en C#:

  1. Abre el menú de Extensiones.
  2. Busca C# e instala la extensión oficial de Microsoft C#.

Esto activará resaltado de sintaxis, autocompletado y otras características específicas de proyectos en C#.

Ejecutando y Depurando Tu Código Remotamente ‍♂️

Uno de los desafíos del desarrollo remoto es ejecutar y depurar aplicaciones. VSCode.dev facilita esto al permitirte ejecutar código y ver la salida en vivo directamente en tu navegador.

  1. Abre un archivo como Program.cs.
  2. Usa el botón Run para iniciar tu aplicación.
  3. Verás la salida de la consola y podrás acceder a la aplicación a través de una URL proporcionada.

Para detener el servidor, usa el botón Command en la parte superior de la pantalla.

Trabajando con Proyectos de Kotlin en VSCode.dev ☕

Si te interesa el desarrollo en Kotlin, VSCode.dev también lo soporta. Así es cómo importar y ejecutar un proyecto de Kotlin:

  1. Importa el proyecto de Kotlin desde GitHub.
  2. Instala las extensiones de Kotlin y Gradle.
  3. Haz clic derecho sobre el archivo build.gradle.kts, selecciona Gradle y ejecuta la tarea Run.

Podrás ver la aplicación y hacer ediciones en tiempo real, tal como lo harías en una máquina local.

Usando GitHub Codespaces para el Desarrollo Remoto

GitHub Codespaces proporciona otra opción para el desarrollo remoto con VSCode.dev. Puedes usarlo para ejecutar proyectos directamente en la nube sin preocuparte por la configuración de la VM.

  1. Abre VSCode.dev y ve al menú Remote Explorer.
  2. Selecciona GitHub Codespaces y Create a Space.
  3. Elige tu repositorio y configura el entorno (por ejemplo, Java con Maven o Spring).

Codespaces proporciona un IDE completo en la nube con soporte integrado para tareas de desarrollo, como ejecutar aplicaciones Java con SDKMan.


Conclusión

VSCode.dev lleva la flexibilidad del desarrollo remoto a tu navegador.

Ya sea que estés trabajando en un script simple o en un proyecto complejo con varios desarrolladores, VSCode.dev te permite interactuar sin problemas con entornos basados en la nube.

Todo un cambio de juego para el desarrollo remoto, colaborativo y nativo de la nube.

VSCode.dev ofrece toda la potencia de un IDE local con la comodidad adicional de poder trabajar desde cualquier lugar.

Perfecto para desarrolladores que buscan una solución flexible y poderosa para el desarrollo remoto.


Descubre más desde CIBERED

Suscríbete y recibe las últimas entradas en tu correo electrónico.

Deja un comentario