One place for hosting & domains

      complemento

      Cómo usar Visual Studio Code para desarrollo remoto a través del complemento Remote-SSH


      Introducción

      Visual Studio Code es un entorno de desarrollo integrado (IDE) popular para desarrolladores. Su gran selección de complementos, su diseño minimalista y la compatibilidad con diferentes plataformas hacen que sea una excelente opción para desarrolladores de todos los niveles. Este tutorial se centra en el uso del complemento Remote-SSH para habilitar el desarrollo remoto de software. Con este complemento, puede editar archivos en su estación de trabajo local y, a la vez, llevar adelante tareas de desarrollo como la ejecución de programas, pruebas de unidad o análisis estáticos en un servidor remoto.

      Hay muchas razones por las cuales esto puede ser beneficioso. Por ejemplo, es posible que tenga una estación de trabajo de Windows y desee realizar desarrollos con Windows, y que su código eventualmente funcione en Linux. Puede necesitar más memoria RAM o potencia de procesamiento que la que tiene su equipo actual, o querer mantener el código fuera de su equipo personal debido a una política empresarial o al deseo de mantener su estación de trabajo libre.

      A través de este tutorial, habilitará el complemento Remote-SSH, configurará Visual Studio Code para ejecutar código en el servidor remoto y ejecutará código desde su instalación local de Visual Studio Code en el servidor remoto.

      Requisitos previos

      Para seguir esta guía, necesitará lo siguiente:

      • Un equipo de desarrollo local con Windows, macOSX o Linux. Este tutorial no se aplica a dispositivos Chrome OS.
      • Visual Studio Code; puede descargarlo e instalarlo desde el sitio web oficial.
      • Un par de claves SSH generadas:
      • Un servidor Ubuntu 18.04 configurado siguiendo la guía de configuración inicial del servidor Ubuntu 18.04, incluyendo un usuario sudo no root y un firewall.

      Paso 1: Instalar el complemento Remote-SSH

      En el Mercado de extensiones, puede descargar extensiones compatibles y de terceros para diferentes herramientas y lenguajes de programación. Aquí buscará e instalará el complemento Remote-SSH.

      En el lado izquierdo del IDE hay una fila vertical de cinco iconos. El icono inferior (diseño de cuatro cuadrados en forma de cuadro, cuyo cuadrado superior derecho está apartado) es el del Mercado de extensiones:

      Ubicación del icono del Mercado de extensiones

      También puede acceder a esta sección pulsando Ctrl+Shift+X. Al abrir esta página, verá los complementos sugeridos para la descarga e instalación.

      Una vez que abra el Mercado de extensiones, escriba Remote-SSH en la barra de búsqueda de extensiones. Cuando encuentre el complemento, selecciónelo y luego haga clic en el botón verde Install para instalar la extensión.

      Búsqueda del complemento Remote-SSH

      La extensión quedará instalada. A continuación, configurará la extensión para poder establecer conexión con su servidor.

      Paso 2: Configurar el complemento Remote-SSH y establecer conexión con su servidor

      Ahora que instaló el complemento, puede configurarlo para establecer conexión con un servidor. Para hacerlo, necesitará la siguiente información:

      • El IP o el nombre de host del servidor.
      • El nombre de usuario con el que se conectará.
      • La clave privada que usará para autenticar su usuario.

      Usará esta información para crear un archivo de configuración de SSH que Visual Studio Code pueda usar para establecer una conexión SSH con el servidor, y así sincronizar archivos y ejecutar código en representación de usted. Creará esta configuración usando Visual Studio Code.

      Ahora que instaló el complemento Remote-SSH, verá un pequeño cuadro verde en la esquina inferior izquierda de la interfaz de Visual Studio Code. Si posa el mouse sobre el cuadro, se abrirá un elemento emergente con la leyenda Open a remote window. El botón tiene un signo “mayor que” ligeramente por debajo de un signo “menor que”, ><, como se muestra en la siguiente imagen:

      Botón verde de abrir una ventana remota de la IU

      Haga clic en el botón. Se mostrará un cuadro de diálogo en la parte superior central. Seleccione Remote-SSH: Open Configurar File… de la lista:

      Selección de configuración de SSH en la IU

      En el siguiente mensaje, se le preguntará qué archivo de configuración desea abrir. Si usa Windows, verá dos ubicaciones: una en su directorio personal de usuario y otra en el lugar de instalación de SSH. Al configurar el servidor, debe usar el archivo que se encuentra en el directorio de su usuario.

      Seleccione el archivo. Su editor abrirá el archivo config. Añada el siguiente código al archivo para definir la conexión con su servidor y sustituya las secciones resaltadas por la información de su servidor:

      config

      Host my_remote_server
          HostName your_server_ip_or_hostname
          User sammy
          IdentityFile /location/of/your/private/key
      

      Así es como funciona este archivo de configuración:

      • Host: especifica un nombre para su host. Esto le permite usar un nombre o una abreviatura en lugar de la dirección IP o el nombre de host completos cuando establezca conexión con el servidor.
      • HostName: nombre de host real del servidor, que es una dirección IP o un nombre de dominio plenamente cualificado.
      • User: usuario que desea usar para establecer conexión.
      • IdentityFile: ruta a su clave SSH privada. En los sistemas Mac y Linux, la encontrará en su directorio de inicio, en un directorio .ssh oculto que por lo general lleva el nombre id_rsa. Si usa Windows, habrá especificado una ubicación para guardar este archivo cuando lo creó usando putty-gen.

      Especifique los valores correspondientes en su archivo y guárdelo.

      De esta manera, Visual Studio Code quedará configurado y listo para establecer conexión con su servidor. Haga clic en el botón verde Open a remote window, en la esquina inferior izquierda, y seleccione Remote-SSH: Connect to host…

      Establecer conexión con el servidor desde Visual Studio Code

      Una vez que lo haga, todos los servidores disponibles y configurados se mostrarán en el menú desplegable. Seleccione el servidor con el que desea establecer conexión en esta lista.

      Si es la primera vez que establece conexión con el servidor desde su equipo, es probable que se muestre un cuadro de diálogo de verificación de la huella digital SSH, como el que aparece en la siguiente imagen:

      Confirmar su huella digital SSH

      Esto sirve para verificar que se establezca conexión con el servidor que desea. Puede hacerlo iniciando sesión en su servidor y ejecutando ssh-keygen -l -f /etc/ssh/ssh_host_key.pub para ver la huella digital del servidor. Si esta huella es la misma que la que se muestra en Visual Studio Code, efectivamente estará estableciendo conexión con el servidor que desea. Por lo tanto, podrá hacer clic en Continue.

      Visual Studio Code abre una nueva ventana por defecto cuando se realiza una nueva conexión. Se abrirá una ventana nueva con la pantalla de bienvenida. Si la conexión se estableció de forma correcta, verá SSH: your_ip_address_or_hostname en el cuadro verde de la esquina inferior izquierda. Esto significa que Visual Studio Code está conectado y se comunica con su servidor remoto.

      Conexión correcta de SSH

      Ahora que estableció la conexión, podrá ejecutar comandos y códigos desde su editor.

      Paso 3: Ejecutar código en el servidor remoto

      Ahora que el complemento Remote-SSH está configurado, es el momento de ejecutar código en su equipo remoto. Abra una ventana de terminal seleccionando Terminal, en la barra de navegación situada en la parte superior de la ventana de Visual Studio, y haciendo clic en New Terminal. También puede abrir una terminal presionando CTRL+Shift+`. La terminal que se abre corresponde a su servidor remoto, no a su equipo local.

      Cuando se abra la terminal, ejecute el siguiente comando para ver la dirección IP de su servidor y verificar que esté conectado a su servidor remoto:

      Verá el siguiente resultado en su terminal:

      Output

      1: lo: <LOOPBACK,UP,LOWER_UP> mtu 65536 qdisc noqueue state UNKNOWN group default qlen 1000 link/loopback 00:00:00:00:00:00 brd 00:00:00:00:00:00 inet 127.0.0.1/8 scope host lo valid_lft forever preferred_lft forever inet6 ::1/128 scope host valid_lft forever preferred_lft forever 2: eth0: <BROADCAST,MULTICAST,UP,LOWER_UP> mtu 1500 qdisc fq_codel state UP group default qlen 1000 link/ether 16:cb:05:5b:30:f1 brd ff:ff:ff:ff:ff:ff inet your_server_ip brd your_broadcast_address scope global eth0 valid_lft forever preferred_lft forever ...

      Para probar la capacidad de ejecutar código de forma remota, cree un nuevo archivo de Python denominado hello.py en su editor. Cuando establezca conexión con su servidor remoto, todos los archivos creados a través de Visual Studio Code se guardarán en ese servidor, no en su equipo local.

      Añada el siguiente contenido al archivo:

      hello.py

      print("Hello Sammy!")
      

      Para ejecutar este programa en su servidor, abra una terminal en Visual Studio Code desde el menú de navegación o mediante la secuencia de teclas CTRL+Shift+`. Debido a que esta sesión de la terminal está conectada a su servidor remoto, debe implementar el siguiente comando en la terminal para ejecutar su programa hello.py:

      Se mostrará el resultado de su programa.

      Ejecutar su script de Python

      También puede ejecutar el archivo desde el menú contextual Debug seleccionando Run without Debugging.

      Nota: Si instaló extensiones de desarrollo en Visual Studio Code, como la de Python, deberá volver a instalarlas en su servidor a través del Mercado de extensiones. Si instaló estos complementos en Visual Studio Code previamente, cuando los vuelva a buscar, en la sección del Mercado se mostrará el mensaje Install on SSH: hostname. Siempre preste atención al contexto de desarrollo en el que se encuentre, ya que en él Visual Studio Code instalará sus complementos y creará sus archivos. Si intenta ejecutar su código sin haber instalado estos complementos, en la esquina inferior derecha de la pantalla se mostrarán cuadros de diálogo de error en los que se solicitará instalarlos en su servidor remoto. Una vez que los instale, es probable que deba volver a cargar Visual Studio Code. Cuando vuelva a iniciarlo, seguirá trabajando en el servidor remoto sin necesidad de volver a establecer conexión manualmente.

      Conclusión

      De esta manera, habrá configurado Visual Studio Code para realizar tareas de desarrollo en un servidor remoto con SSH. La ejecución remota con un IDE proporciona muchos beneficios. Entre ellos, la capacidad de probar rápidamente la forma en que su código se ejecuta en distintos sistemas operativos y con diferentes especificaciones de hardware. Mientras disponga de una conexión a Internet, podrá conectarse a su servidor y trabajar en su código desde cualquier computadora además de realizar tareas de desarrollo usando un entorno de Linux aun cuando Windows sea su sistema operativo principal.



      Source link