One place for hosting & domains

      Plugin

      Comment utiliser Visual Studio Code pour le développement à distance via le plugin Remote-SSH


      Introduction

      Visual Studio Code est un environnement de développement intégré (IDE) populaire pour les développeurs. Son grand choix de plugins, sa conception minimale et son support cross-platform en font une solution idéale pour les développeurs de tous niveaux. Ce tutoriel met l’accent sur l’utilisation du plugin Remote-SSH pour activer le développement de logiciels à distance. Avec ce plugin, vous pouvez éditer des fichiers sur votre poste de travail local, mais aussi exécuter des tâches de développement telles que l’exécution de programmes, les tests unitaires ou l’analyse statique sur un serveur distant.

      Il existe de nombreuses raisons pour lesquelles cela peut vous être bénéfique. Par exemple, vous pouvez avoir un poste de travail Windows et vouloir développer sur Windows, mais votre code tournera au final sur Linux. Vous pouvez avoir besoin de davantage de mémoire vive ou de puissance de traitement que n’en possède votre machine actuelle, ou vous souhaitez maintenir le code à l’écart de votre machine personnelle en raison d’une politique d’entreprise, ou du désir de préserver votre poste de travail.

      Dans ce tutoriel, vous allez activer le plugin Remote-SSH, configurer Visual Studio Code pour exécuter le code sur le serveur distant, et exécuter le code de votre installation locale de Visual Studio Code sur le serveur distant.

      Conditions préalables

      Pour suivre ce guide, vous aurez besoin des éléments suivants :

      • Une machine de développement locale fonctionnant sous Windows, MacOSX ou Linux. Ce tutoriel ne fonctionnera pas sur les dispositifs ChromeOS.
      • Visual Studio Code, que vous pouvez télécharger et installer depuis le site web officiel.
      • Une paire de clés SSH générée :
      • Un serveur Ubuntu 18.04 configuré en suivant le guide de configuration initiale du serveur Ubuntu 18.04, comprenant un utilisateur non root sudo activé et un pare-feu.

      Étape 1 — Installation du plugin Remote-SSH

      Extensions Marketplace​​​ est l’endroit où vous pouvez télécharger les extensions prises en charge et les extensions tierces pour une variété d’outils et de langages de programmation différents. C’est là que vous allez rechercher le plugin Remote-SSH en vue de l’installer.

      Sur le côté gauche de l’IDE, il existe une rangée verticale de cinq icônes. L’icône du bas, qui ressemble à quatre carrés dans une boîte avec le carré supérieur droit qui explose, est l’icône d’Extensions Marketplace :

      Emplacement de l'icône Extensions Marketplace

      Vous pouvez également accéder à cette section en appuyant sur Ctrl+Shift+X. Lorsque vous ouvrirez cette page, vous verrez des suggestions de plugins à télécharger et à installer.

      Une fois que vous avez ouvert Extensions Marketplace, tapez Remote-SSH dans la barre de recherche d’Extensions Marketplace. Lorsque vous trouvez le plugin, sélectionnez-le et cliquez ensuite sur le bouton vert Install pour installer l’extension.

      Recherche du plugin Remote SSH

      L’extension est maintenant installée. Ensuite, vous allez configurer l’extension afin de pouvoir vous connecter à votre serveur.

      Étape 2 — Configuration du plugin Remote-SSH et connexion à votre serveur

      Maintenant que vous avez installé le plugin, vous pouvez le configurer pour vous connecter à un serveur. Pour ce faire, vous aurez besoin des éléments d’information suivants :

      • L’IP ou le nom d’hôte du serveur.
      • Le nom d’utilisateur avec lequel vous allez vous connecter.
      • La clé privée que vous utiliserez pour authentifier votre utilisateur.

      Vous utiliserez ces informations pour créer un fichier de configuration SSH que Visual Studio Code peut utiliser pour SSH vers le serveur afin de synchroniser les fichiers et d’exécuter le code en votre nom. Vous allez créer cette configuration en utilisant Visual Studio Code.

      Maintenant que vous avez installé le plugin Remote-SSH, vous verrez une petite boîte verte dans le coin en bas à gauche de l’interface Visual Studio Code. Si vous survolez la boîte avec le pointeur de votre souris, la fenêtre contextuelle indiquera Open a remote window. Le bouton ressemble à un signe “supérieur à” situé un peu au-dessous d’un signe “inférieur à” (><), comme l’illustre l’image suivante :

      Bouton vert de l'interface Open a remote window

      Cliquez sur le bouton, et une boîte de dialogue apparaît en haut, au centre. Sélectionnez Remote-SSH : Open Configuration File… dans la liste :

      Selecting Configure SSH in the UI

      L’invite suivante vous demandera quel fichier de configuration vous voulez ouvrir. Si vous êtes sous Windows, vous verrez deux emplacements : un dans votre répertoire utilisateur personnel, et un dans l’emplacement d’installation pour SSH. Vous devez utiliser le fichier dans votre répertoire utilisateur lors de la configuration du serveur.

      Sélectionnez le fichier et votre éditeur ouvrira le fichier config. Ajoutez le code suivant au fichier pour définir la connexion à votre serveur, en remplaçant les sections surlignées par les informations de votre serveur :

      config

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

      Voici comment fonctionne ce fichier de configuration :

      • Host : spécifie un nom pour votre hôte. Cela vous permet d’utiliser un nom ou abrégé au lieu de l’adresse IP complète ou du nom d’hôte lors de la connexion au serveur.
      • HostName : le nom d’hôte réel du serveur, qui est soit une adresse IP, soit un nom de domaine entièrement qualifié.
      • User : l’utilisateur que vous voulez utiliser pour vous connecter.
      • IdentityFile: : le chemin vers votre clé privée SSH. Sur les systèmes Mac et Linux, vous le trouverez dans votre répertoire personnel, dans un répertoire .ssh caché, généralement appelé id_rsa. Si vous êtes sous Windows, vous avez spécifié un emplacement pour enregistrer ce fichier lorsque vous l’avez créé en utilisant putty-gen.

      Spécifiez les valeurs appropriées dans votre fichier et enregistrez le fichier.

      Visual Studio Code est maintenant configuré et prêt à vous connecter à votre serveur. Cliquez sur le bouton vert Open a remote window​​​​​​ dans le coin inférieur gauche et sélectionnez Remote-SSH : Connect to Host…

      Connexion au serveur depuis Visual Studio Code

      Une fois que vous avez fait tout cela, les serveurs disponibles et configurés apparaîtront dans le menu déroulant. Sélectionner le serveur auquel vous voulez vous connecter à partir de cette liste.

      Si c’est la première fois que vous vous connectez à ce serveur depuis votre machine, vous serez probablement invité à utiliser la boîte de dialogue de vérification des empreintes digitales SSH, comme celle qui figure dans l’image suivante :

      Confirmer votre empreinte digitale SSH

      Cela permet de s’assurer que vous vous connectez réellement au serveur auquel vous pensez. Vous pouvez le vérifier en vous connectant manuellement à votre serveur et en exécutant ssh-keygen -l -f /etc/ssh/ssh_host_key.pub pour visualiser l’empreinte digitale du serveur. Si cette empreinte digitale est la même que celle qui vous est présentée dans Visual Studio Code, alors vous vous connectez effectivement au serveur auquel vous pensez, vous pouvez donc cliquer sur Continue.

      Visual Studio Code ouvre par défaut une nouvelle fenêtre lorsqu’une nouvelle connexion est établie. Une nouvelle fenêtre apparaîtra avec l’écran d’accueil. Vous saurez que votre connexion a réussi si vous voyez SSH : your_ip_address_or_hostname dans la boîte verte, située dans le coin inférieur gauche. Cela signifie que Visual Studio Code est connecté et communique avec votre serveur distant.

      Connexion SSH réussie

      Maintenant que vous êtes connecté, vous pouvez exécuter des commandes et du code à partir de votre éditeur.

      Étape 3 — Exécution de code sur le serveur distant

      Le plugin Remote-SSH est configuré, et il est temps d’exécuter du code sur votre machine distante. Ouvrez une fenêtre de terminal en sélectionnant Terminal dans la barre de navigation en haut de la fenêtre Visual Studio et en cliquant sur New Terminal. Vous pouvez également ouvrir un terminal en appuyant sur CTRL+Shift+`. Le terminal qui est ouvert est un terminal sur votre serveur distant, et non un terminal sur votre machine locale.

      Lorsque le terminal s’ouvre, lancez la commande suivante pour afficher l’adresse IP de votre serveur afin de vérifier que vous êtes connecté à votre serveur distant :

      Vous verrez la sortie suivante dans votre 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 ...

      Pour tester la capacité d’exécution de code distant, créez un nouveau fichier Python appelé hello.py dans votre éditeur. Lorsque vous êtes connecté à votre serveur distant, tous les fichiers créés par Visual Studio Code sont enregistrés sur ce serveur, et non sur votre machine locale.

      Ajoutez le contenu suivant au fichier :

      hello.py

      print("Hello Sammy!")
      

      Pour exécuter ce programme sur votre serveur, ouvrez un terminal dans Visual Studio Code à partir du menu navigation ou en appuyant sur la séquence de touches CTRL+Shift+`. Comme cette session de terminal est connectée à votre serveur distant, exécutez la commande suivante dans le terminal pour exécuter votre programme hello.py :

      La sortie de votre programme sera affichée.

      Exécuter votre script Python

      Vous pouvez également exécuter le fichier à partir du menu contextuel Debug en sélectionnant Run without Debugging.

      Remarque : Si vous avez des extensions de développement installées dans Visual Studio Code, telle que l’extension Python, vous devrez réinstaller ces extensions sur votre serveur via Extensions Marketplace. Si vous avez déjà installé ces plugins dans Visual Studio Code, lorsque vous les recherchez à nouveau, le Marketplace indiquera Install on SSH: hostname. Faites toujours attention au contexte de développement dans lequel vous vous trouvez, car c’est là que Visual Studio Code installera vos plugins et créera vos fichiers. Si vous essayez d’exécuter votre code sans que ces plugins soient installés, des boîtes de dialogue d’erreur apparaîtront dans le coin inférieur droit de l’écran, vous invitant à les installer sur votre serveur distant. Une fois que vous les aurez installés, vous devrez probablement recharger Visual Studio Code. Lorsque vous le relancerez, il continuera à fonctionner sur le serveur distant sans que vous ayez à vous reconnecter manuellement.

      Conclusion

      Le code Visual Studio est maintenant configuré pour le développement sur un serveur distant utilisant SSH. L’exécution à distance avec un IDE offre de nombreux avantages, notamment la possibilité de tester rapidement le fonctionnement de votre code sur différents systèmes d’exploitation et pour différentes spécifications matérielles. Tant que vous disposez d’une connexion Internet, vous pouvez vous connecter à votre serveur et travailler sur votre code depuis n’importe quel ordinateur, et vous pourrez développer en utilisant un environnement Linux même si vous utilisez Windows comme système d’exploitation principal.



      Source link

      Como usar o Visual Studio Code para o desenvolvimento remoto por meio do plug-in Remote-SSH


      Introdução

      O Visual Studio Code é um Ambiente integrado de desenvolvimento (IDE) para desenvolvedores. Sua grande seleção de plug-ins, de design mínimo e suporte multiplataforma tornam-no uma ótima escolha para os desenvolvedores de todos os níveis. Este tutorial se concentra no uso do plug-in Remote-SSH para habilitar o desenvolvimento de softwares remotos. Com esse plug-in , você pode editar arquivos na sua estação de trabalho local, mas executar tarefas de desenvolvimento, como a execução do programa, testes de unidade ou análise estática, em um servidor remoto.

      Há muitas razões para que isso seja benéfico para você. Por exemplo, você pode ter uma estação de trabalho Windows e querer desenvolver no Windows, mas seu código acabará sendo executado no Linux. Você pode precisar de mais RAM ou poder de processamento do que sua máquina atual tem disponível, ou querer manter o código fora da sua máquina pessoal devido a uma política de empresa ou pela vontade de manter sua estação de trabalho inalterada.

      Neste tutorial, você irá habilitar o plug-in Remote-SSH, configurar o Visual Studio Code para executar o código no servidor remoto e executar o código de sua instalação local do Visual Studio Code no servidor remoto.

      Pré-requisitos

      Para acompanhar este guia, você vai precisar do seguinte:

      • Uma máquina local de desenvolvimento executando o Windows, MacOSX ou Linux. Este tutorial não funcionará nos dispositivos ChromeOS.
      • O Visual Studio Code, que pode ser baixado e instalado no site oficial.
      • Um par de chaves SSH gerado:
      • Um servidor Ubuntu 18.04 configurado conforme o Guia de configuração inicial do servidor Ubuntu 18.04, incluindo um usuário não raiz habilitado para o sudo e um firewall.

      Passo 1 — Instalando o plug-in Remote-SSH

      O Marketplace de extensões é o local onde pode você pode baixar extensões compatíveis e de terceiros para uma variedade de ferramentas e linguagens de programação diferentes. É aqui que você procurará pelo plug-in Remote-SSH e o instalará

      No lado esquerdo da IDE, há uma linha vertical de cinco ícones. O ícone mais abaixo, que se parece com quatro quadrados em uma caixa, estando o do topo direito descolando, é o ícone para o Marketplace de extensões:

      Localização do ícone do Marketplace de extensões

      Você também pode acessar essa seção pressionando Ctrl+Shift+X. Quando a página for aberta, você verá os plug-ins sugeridos para baixar e instalar.

      Assim que tiver o Marketplace de extensões aberto, digite Remote-SSH na barra de busca Search Extensions in Marketplace. Quando encontrar o plug-in, selecione-o e, em seguida, clique no botão verde Install para instalar a extensão.

      Procurando pelo plug-in Remote-SSH

      A extensão agora está instalada. Em seguida, você configurará a extensão para que você consiga conectar-se ao seu servidor.

      Passo 2 — Configurando o plug-in Remote-SSH e conectando-se ao seu servidor

      Agora que o plug-in está instalado, você pode configurá-lo para que se conecte a um servidor. Para fazer isso, serão necessárias as seguintes informações:

      • O IP ou nome do host do servidor.
      • O nome de usuário com o qual você se conectará.
      • A chave privada que você usará para autenticar seu usuário.

      Você usará essas informações para criar um arquivo de configuração SSH, que o Visual Studio Code pode usufruir para usar o SSH no servidor para sincronizar os arquivos e executar códigos em seu nome. Essa configuração será criada usando o Visual Studio Code.

      Agora que você tem o plug-in Remote-SSH instalado, verá uma pequena caixa verde no canto inferior esquerdo da interface do Visual Studio Code. Se você passar o ponteiro do mouse pela caixa, o pop-up dirá Open a remote window (Abrir uma janela remota). O botão se parece com um sinal “maior que” abaixo de um sinal “menor que” ><, como o da seguinte imagem:

      Botão de UI verde para abrir uma janela remota

      Clique no botão e uma caixa de diálogo aparece no centro superior. Selecione Remote-SSH: Open Configuration File… da lista:

      Selecionando configurar SSH na UI

      O próximo prompt perguntará qual arquivo de configuração você deseja abrir. Se estiver no Windows, verá duas localizações: uma no seu diretório de usuário pessoal e outra na localização de instalação para o SSH. Você deve utilizar o arquivo no seu diretório de usuário enquanto estiver configurando o servidor.

      Selecione o arquivo e seu editor abrirá o arquivo config. Adicione o código a seguir ao arquivo para definir a conexão com seu servidor, substituindo as seções destacadas pelas informações do seu servidor:

      config

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

      Aqui está como este arquivo de configuração funciona:

      • Host: especifica um nome para seu host. Isso permite que você use como alternativa um nome curto ou uma abreviação, em vez do endereço IP completo ou nome do host ao se conectar ao servidor.
      • HostName: o nome real do host do servidor, que é um endereço IP ou um nome de domínio totalmente qualificado.
      • User: o usuário com o qual você deseja se conectar.
      • IdentityFile: o caminho para sua chave SSH privada. Em sistemas Mac e Linux, você encontrará isso em seu diretório base, em um diretório .ssh escondido, chamado normalmente de id_rsa. Se estiver no Windows, você terá especificado um local para salvar este arquivo quando o criou usando o putty-gen.

      Especifique os valores apropriados no seu arquivo e salve o arquivo.

      O Visual Studio Code está agora configurado e pronto para se conectar ao seu servidor. Clique no botão verde Open a remote window, no canto inferior esquerdo e selecione Remote-SSH: Connect to Host…

      Conectando-se ao servidor através do Visual Studio Code

      Assim que tiver feito isso, todos os servidores disponíveis e configurados aparecerão no menu suspenso. Selecione o servidor ao qual você deseja se conectar dessa lista.

      Se essa é a primeira vez que você se conecta a este servidor de sua máquina, provavelmente será exibido um diálogo de verificação do SSH Fingerprint, como a da seguinte imagem:

      Confirmando seu SSH Fingerprint

      Isso é para garantir que você esteja se conectando ao servidor correto. É possível verificar isso fazendo login manualmente e executando ssh-keygen -l -f /etc/ssh/ssh_host_key.pub para visualizar as impressões digitais do servidor. Se essa impressão for a mesma que aquela sendo apresentada a você no Visual Studio Code, então você de fato está se conectando ao servidor correto, logo, clique em Continue.

      Por padrão, o Visual Studio Code abre uma nova janela quando uma nova conexão é feita. Uma nova janela aparecerá com a tela de boas-vindas. Você saberá se sua conexão foi bem-sucedida caso veja SSH: your_ip_address_or_hostname na caixa verde no canto inferior esquerdo. Isso significa que o Visual Studio Code está conectado e se comunicando com seu servidor remoto.

      Conexão SSH bem-sucedida

      Agora que está conectado, execute comandos e códigos do seu editor.

      Passo 3 — Executando códigos no servidor remoto

      O plug-in Remote-SSH está configurado e é hora de executar algum código em sua máquina remota. Abra uma janela de terminal selecionando Terminal da barra de navegação no topo da janela do Visual Studio e clicando em New Terminal. Também é possível abrir um terminal pressionando CTRL+Shift+`. O terminal que é aberto é um terminal no seu servidor remoto, não um na sua máquina local.

      Quando o terminal abrir, emita o seguinte comando para visualizar o endereço IP do seu servidor para verificar se você está conectado ao seu servidor remoto:

      Você verá o seguinte resultado no seu 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 testar a capacidade de executar códigos remotos, crie um novo arquivo do Python chamado hello.py no seu editor. Quando estiver conectado ao seu servidor remoto, todos os arquivos criados através do Visual Studio Code serão salvos no servidor, não na sua máquina local.

      Adicione o conteúdo a seguir ao arquivo:

      hello.py

      print("Hello Sammy!")
      

      Para executar este programa no seu servidor, abra um terminal no Visual Studio Code por meio do menu de navegação ou pressionando a sequência de teclas CTRL+Shift+`. Como essa sessão de terminal está conectada ao seu servidor remoto, execute o seguinte comando no terminal para executar seu programa hello.py:

      O resultado do seu programa será exibido.

      Executando seu script em Python

      Também é possível executar o arquivo a partir do menu de contexto Debug, selecionando Run without Debugging.

      Nota: caso tenha qualquer extensão de desenvolvimento instalada no Visual Studio Code, como a extensão do Python, será necessário reinstalar essas extensões no seu servidor através do Marketplace de extensões. Caso já tenha instalado previamente esses plug-ins no Visual Studio Code, quando for procurar por eles novamente, o Marketplace dirá Install on SSH: hostname. Sempre tenha cuidado sobre qual o contexto de desenvolvimento em que você está, pois é aqui onde o Visual Studio Code instalará seus plug-ins e criará seus arquivos. Se tentar executar seu código sem esses plug-ins instalados, caixas de diálogo de erro aparecerão no canto inferior direito da tela, solicitando pela instalação deles no seu servidor remoto. Depois de instalá-los, eles provavelmente exigirão que você recarregue o Visual Studio Code. Quando você reiniciá-lo, ele continuará funcionando no servidor remoto, sem que você tenha que se reconectar manualmente.

      Conclusão

      Agora, você tem o Visual Studio Code configurado para o desenvolvimento em um servidor remoto usando o SSH. A execução remota com uma IDE traz muitos benefícios, incluindo a capacidade de testar rapidamente como seu código é executado em diferentes sistemas operacionais e diferentes especificações de hardware. Enquanto tiver uma conexão de Internet, você pode se conectar ao seu servidor e trabalhar em seu código de qualquer computador e será capaz de desenvolver usando um ambiente Linux, mesmo se estiver usando o Windows como seu sistema operacional primário.



      Source link

      How To Use Visual Studio Code for Remote Development via the Remote-SSH Plugin


      Introduction

      Visual Studio Code is a popular Integrated Developer Environment (IDE) for developers. Its large selection of plugins, minimal design, and cross-platform support make it a great choice for developers of all levels. This tutorial focuses on using the Remote-SSH plugin to enable remote software development. With this plugin you can edit files on your local workstation, but run development tasks such as program execution, unit tests, or static analysis on a remote server.

      There are many reasons why this may be beneficial to you. For example, you may have a Windows workstation and want to develop on Windows, but your code will eventually run on Linux. You may need more RAM or processing power than your current machine has available, or you want to keep code off of your personal machine due to a company policy, or the desire to keep your workstation prestine.

      In this tutorial, you’ll enable the Remote-SSH plugin, configure Visual Studio Code to execute code on the remote server, and execute code from your local Visual Studio Code installation on the remote server.

      Prerequisites

      In order to follow along with this guide, you’ll need:

      • A local development machine running Windows, MacOSX, or Linux. This tutorial will not work on ChromeOS devices.
      • Visual Studio Code, which you can download and install from the official web site.
      • An SSH key pair generated:
      • One Ubuntu 18.04 server set up by following the Ubuntu 18.04 initial server setup guide, including a non-root sudo-enabled user and a firewall.

      Step 1 — Installing the Remote-SSH Plugin

      The Extensions Marketplace is where you can download supported and third-party extensions for a variety of different tools and programming languages. This is where you will search for the Remote-SSH plugin and install it.

      On the left-hand side of the IDE there is a vertical row of five icons. The bottom icon, which looks like four squares in a box with the top right square exploding out, is the icon for the Extensions Marketplace:

      Extensions Marketplace Icon Location

      You can also access this section by pressing Ctrl+Shift+X. When you open this page you will see suggested plugins to download and install.

      Once you have the Extensions Marketplace open, type Remote-SSH in the Search Extensions in Marketplace search bar. When you find the plugin, select it and then click the green Install button to install the extension.

      Search for the Remote SSH Plugin

      The extension is now installed. Next, you’ll configure the extension so you can connect to your server.

      Step 2 — Configuring the Remote-SSH Plugin and Connecting To Your Server

      Now that you have the plugin installed you can configure it to connect to a server. To do so, you’ll need the following pieces of information:

      • The server’s IP or hostname.
      • The username you’ll connect with.
      • The private key you’ll use to authenticate your user.

      You’ll use this information to create an SSH configuration file that Visual Studio Code can use to SSH to the server to sync files and execute code on your behalf. You will create this configuration using Visual Studio Code.

      Now that you have the Remote-SSH plugin installed, you’ll see a small green box in the bottom left-hand corner of the Visual Studio Code interface. If you hover over the box with your mouse pointer, the popup will say Open a remote window. The button looks like a greater than sign slightly under a less than sign ><, like the one in the following image:

      Open a remote window green UI button

      Click the button, and a dialog box appears in the top center. Select Remote-SSH: Open Configuration File… from the list:

      Selecting Configure SSH in the UI

      The next prompt will ask you which configuration file you want to open. If you’re on Windows, you’ll see two locations: one in your personal user directory, and one in the installation location for SSH. You should use the file in your user directory when configuring the server.

      Select the file and your editor will open the config file. Add the following code to the file to define the connection to your server, replacing the highlighted sections with the information for your server:

      config

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

      Here’s how this configuration file works:

      • Host: This specifies a name for your host. This lets you use a short name or abbreviation instead of the full IP address or host name when connecting to the server.
      • HostName: The actual hostname of the server, which is either an IP address or a fully qualified domain name.
      • User: The user you want to use to connect with.
      • IdentityFile: The path to your SSH private key. On Mac and Linux systems, you’ll find this in your home directory in a hidden .ssh directory, typically called id_rsa. If you are on Windows you will have specified a location to save this file when you created it using putty-gen.

      Specify the appropriate values in your file and save the file.

      Visual Studio Code is now configured and ready to connect to your server. Click on the green Open a remote window button in the bottom left-hand corner and select Remote-SSH: Connect to Host…

      Connecting to the Server from Visual Studio Code

      Once you’ve done this all the availble and configured servers will appear in the dropdown menu. Select the server that you want to connect to from this list.

      If this is the first time you have connected to this server from your machine, you’ll likely be prompted with the SSH Fingerprint verification dialog, like the one in the following image:

      Confirming your SSH Fingerprint

      This is to ensure that you are really connecting to the server you think you are. You can verify this by logging in to your server manually and running ssh-keygen -l -f /etc/ssh/ssh_host_key.pub to view the fingerprint of the server. If this fingerprint is the same as the one being presented to you in Visual Studio Code, then you are indeed connecting to the server you think you are so you can click Continue.

      Visual Studio Code defaults to opening a new window when a new connection is made. A new window will appear with the welcome screen. You’ll know that your connection was successful if you see SSH: your_ip_address_or_hostname in the green box in the bottom left-hand corner. This means that Visual Studio Code is connected and communicating with your remote server.

      Successful SSH connection

      Now that you’re connected, you can run commands and code from your editor.

      Step 3 — Executing Code on the Remote Server

      The Remote-SSH plugin is configured, and it’s time to run some code on your remote machine. Open a terminal window by selecting Terminal from the navigation bar at the top of the Visual Studio window and clicking New Terminal. You can also open a terminal by pressing CTRL+Shift+`. The terminal that is opened is a terminal on your remote server, not one on your local machine.

      When the terminal opens, issue the following command to view the IP address of your server to verify that you are connected to your remote server:

      You’ll see the following output in your 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 ...

      To test out the ability to run remote code, create a new Python file called hello.py in your editor. When you are connected to your remote server, all files created through Visual Studio Code will be saved to that server, not on your local machine.

      Add the following contents to the file:

      hello.py

      print("Hello Sammy!")
      

      To run this program on your server, open a terminal in Visual Studio Code from the navigation menu or by pressing the key sequence CTRL+Shift+`. Since this terminal session is connected to your remote server, run the following command in the terminal to execute your hello.py program:

      Your program’s output will be displayed.

      Executing your Python Script

      You can also execute the file from the Debug context menu by selecting Run without Debugging.

      Note: If you have any development extensions installed in Visual Studio Code, like the Python extension, you will have to reinstall these extensions on your server through the Extension Marketplace. If you have previously installed these plugins in Visual Studio Code, when you search for them again, the Marketplace will say Install on SSH: hostname. Always pay attention to what devlopment context you are in, because this is where Visual Studio Code will install your plugins and create your files. If you try to run your code without these plugins installed, error dialog boxes will appear in the bottom right-hand corner of the screen prompting you to install them on your remote server. After you have installed these they will likely require you to reload Visual Studio Code. When you relaunch it, it will continue working on the remote server without you having to manually reconnect.

      Conclusion

      You now have Visual Studio Code configured for development on a remote server using SSH. Remote execution with an IDE provides many benefits, including the ability to quickly test how your code runs on different operating systems and different hardware specifications. As long as you have an internet connection you could connect to your server and work on your code from any computer, and you’ll be able to develop using a Linux environment even if you run Windows as your primary operating system.



      Source link