¿Cómo Programar con Visual Studio Code desde el Navegador?

A partir de ahora, si visitas VSCode.dev, vas a encontrar una versión ligera de Visual Studio Code que se ejecuta completamente en el navegador. Abre una carpeta en su máquina local y comienza a programar.

Esta nueva metodología de poder utilizar Visual Studio Code no requiere instalación ninguna instalación.

Visual Studio Code finalmente llega al navegador y ahora es totalmente utilizable desde tu navegador web favorito. Con la activación de vscode.dev llega una herramienta de desarrollo que puede ejecutarse completamente sin servidor en un navegador.

Bien, ¿Qué podemos hacer con Visual Studio Code en la Web?

? COMIENZA A UTILIZAR VISUAL STUDIO CODE EN EL NAVEGADOR

? Si quieres conocer los mejores editores para programar / Editores Programar Python / Editores Programar Java / Editores Programar PHP

Desarrollo local con herramientas en la nube

Los navegadores modernos que admiten la API de acceso al sistema de archivos (chrome y Edge en la actualidad) permiten que las páginas web accedan al sistema de archivos local (previo permiso).

Esta sencilla puerta de enlace a la máquina local abre rápidamente algunos escenarios interesantes para usar Visual Studio Code en la Web como una herramienta de desarrollo local de instalación cero, como:

  • Visualizar y editar archivos en local.
  • Tomar notas rápidamente (¡y obtén una vista previa!) en Markdown. Incluso si te encuentras en una máquina restringida donde no se puede instalar el software de Visual Studio Code, es posible que puedas usar vscode.dev para ver y editar archivos locales.
  • Crear aplicaciones HTML, JavaScript y CSS del lado del cliente junto con las herramientas del navegador para la depuración.
  • Editar código en máquinas de menor potencia como Chromebooks, donde no se puede instalar Visual Studio Code con facilidad.
  • Desarrollar en iPad: Vas a poder cargar/descargar archivos (e incluso almacenarlos en la nube usando la aplicación Archivos) y también abrir repositorios de forma remota con la extensión incorporada de repositorios de GitHub.

Si tu navegador no es compatible con las API del sistema de archivos local, aún vas a poder abrir archivos individuales cargándolos y descargándolos a través del navegador.

Una experiencia de desarrollo más fresca

Dado que Visual Studio Code para la Web se ejecuta completamente dentro del navegador, algunas experiencias serán más limitadas, en comparación con lo que se puede hacer en la aplicación de escritorio.

Por ejemplo, el terminal y el depurador no estarán disponibles, lo que tiene sentido ya que no se puede compilar, ejecutar y depurar una aplicación Rust o Go dentro de la zona de pruebas del navegador (aunque las tecnologías emergentes como Pyodide y los contenedores web pueden cambiar esto algún día).

Un poco más matizadas que en el escritorio son las experiencias de edición y la navegación entre el código; generalmente funcionan con servicios de lenguajes y compiladores que esperan un sistema de archivos, tiempo de ejecución y entorno informático.

En el navegador, estas experiencias están impulsadas por servicios de idiomas que se ejecutan completamente en el navegador (sin sistema de archivos y sin tiempos de ejecución) que proporcionan la tokenización de código fuente, el color de la de sintaxis y mucho más.

Como resultado, cuando estás en el navegador, las experiencias que se han logrado conseguir para Visual Studio Code son:

Para la mayoría de los lenguajes de programación, vscode.dev brinda la sintaxis de colores en el código, las terminaciones basadas en texto y el color por pares. Usando un árbol de sintaxis de Tree-sitter.

Se han podido agregar experiencias adicionales [proporcionar experiencias adicionales como Esquema / Ir a símbolo y la Búsqueda de símbolo para lenguajes populares como C / C ++, C #, Java, PHP, Rust y Go.

Las experiencias de TypeScript, JavaScript y Python funcionan con servicios de lenguaje que se ejecutan de forma nativa en el navegador. Con esos lenguajes de programación, vas a obtener muy buenas experiencia, con resaltado semántico, indicación de errores de sintaxis y más.

Para muchos lenguajes “webby” como JSON, HTML, CSS, LESS o Markdown, la experiencia de codificación en Visual Studio Code es casi idéntica a la del escritorio (¡Incluida la vista previa de Markdown!).

Extensiones

La mayoría de las extensiones de personalización de la interfaz de usuario, como temas, mapas de teclas y fragmentos de código, funcionan en Visual Studio Code Dev Online e incluso se puede habilitar la itinerancia entre el navegador, el escritorio y los espacios de código de GitHub a través de la sincronización de configuración.

Las extensiones que ejecutan código Node y usan módulos específicos del sistema operativo o que se envían a ejecutables locales, aún se muestran en los resultados de búsqueda, pero están claramente marcadas como no disponibles.

Dicho esto, hay un número creciente de extensiones que se han actualizado para funcionar en el navegador y cada día irán apareciendo más.

Nota: Si eres un autor de extensión y deseas que tu extensión esté disponible en el navegador. Consulta la siguiente guía de creación de extensiones web para Visual Studio Code.

Por ejemplo, la extensión Luna Paint: Editor de Imágenes te permite editar imágenes rasterizadas directamente en Visual Studio Code.

Luna Paint incluye herramientas de diseño enriquecidas (como herramientas de capas) a Visual Studio Code y por supuesto, puedes guardar las imágenes resultantes dentro de tu su disco local.

La extensión de GitHub Issue Notebooks te permite agregar Blocs de Notas a GitHub Issues. Así, se pueden intercalar consultas, resultados e incluso Markdown que describe el propósito de las consultas desde un único editor.

? COMIENZA A UTILIZAR VISUAL STUDIO CODE ONLINE


Artículos Relacionados

Relacionado

40 Cursos Gratis de Udemy: Desarrollo Web, Python (cupón finalizado)

Recién llega la primavera y vamos con una publicación más, que incluye los cursos del Lunes; hoy tenemos, 9 cursos en español (Typescript, Javascript, React, Vue, Firebase, Swift, Azure, HTML y CSS, Power Bi). Más 31 cursos en inglés: Javascript, Typescript, React, Python, R, Java, Drupal, Android y Kotlin, Básicos de Visual Studio Code, Bootstrap, Gitlab, Maya 3D, Photoshop, Marketing en Facebook e Instagram, SEO. Iniciación ¡SEGUIR LEYENDO!

Segunda actualización de Java para Visual Studio Code en 2020

En esta actualización, le mostraremos las nuevas formas de administrar sus dependencias y configurar el JDK múltiple. Aprender las herramientas adicionales que se pueden aprovechar para utilizar frameworks y mejorar los tiempos de ejecución. Además, existen algunos cambios más dentro de esta actualización. Gestión de dependencias Ya sea que use o no una herramienta de compilación, Java Dependency Viewer ahora proporciona una manera mejor de manejar ¡SEGUIR LEYENDO!

Extensión de Adobe XD para Visual Studio Code: Crea y revisualiza paquetes de sistemas de diseño

Una nueva e impresionante extensión de Adobe XD para Visual Studio Code, nos permite utilizar Adobe XD sin salir del editor. Los sistemas de diseño son el vínculo entre diseño y el desarrollo. Para construir un sistema exitoso, personalizado y ampliamente adoptado, tanto los diseñadores como los desarrolladores deben tener un hueco a la hora de la creación. La nueva extensión de Adobe XD para Visual ¡SEGUIR LEYENDO!

5 Mejores Alternativas de Visual Studio Code para Linux en 2024

¡Editores de código interesantes que podrían reemplazar a Visual Studio Code en 2024! Aquí te traigo algunos nuevos editores de código destacables que se lanzaron para Linux, como por ejemplo Lite XL hasta otras opciones como Pulsar. 5 Alternativas al editor de código Visual Studio Code Comencemos, he compilado esta lista de los próximos editores de código para Linux que tienen una gran capacidad y aspiraciones ¡SEGUIR LEYENDO!

23 Mejores Cursos Gratis de Editores de Texto

Los mejores cursos gratuitos para aprender a utilizar como un auténtico profesional los mejores editores de texto. Con estos cursos, vas a conocer los mejores trucos, plugins, extensiones y flujos de trabajo con los que optimizar tu trabajo sobre algunos de los editores de texto más utilizados del mundo. Mejores Editores / Editores Python / Editores Java / Editores Markdown Los Mejores Cursos de Editores de ¡SEGUIR LEYENDO!

78 Cursos Gratuitos de Python, Ciberseguridad, Crear Apps (cupón finalizado)

Los cursos de hoy se dividen en cursos en español y cursos en inglés. En concreto, 37+1 cursos en español y 41 en inglés. Sigue activa la oferta de Libros de Python / [EN] Desarrollador Python (20 curso de python por 16,37 €) ? Curso gratis en español Aplicaciones web, C, C#, Python, SQL Server, Xamarin, Unity, etc. Programación ¡A Programar! Una introducción a la programación ¡SEGUIR LEYENDO!

Cursos de Programación gratuitos de Youtube 2022 (Mayo)

Aprende sobre Inteligencia Artificial VER EN YOUTUBE por DotCSV Curso .Net 6 VER EN YOUTUBE por The Coder Cave Curso Angular VER EN YOUTUBE por Píldoras Informáticas (actualizado) Curso App Inventor VER EN YOUTUBE por Programador Novato Curso Arduino VER EN YOUTUBE por Programador Novato Curso C# VER EN YOUTUBE por Píldoras Informáticas (actualizado) Curso CSS3 desde cero VER EN YOUTUBE por AlexCG Design (actualizado) Curso ¡SEGUIR LEYENDO!