You should definitely try: Great convenience auto-connect to our EC2 instance using VScode

Cumhur Akkaya
6 min readJul 19, 2023

--

In this article, I will talk about a feature of VScode (Visual Studio Code) that I am sure you will like very much. We will automatically connect to Remote Instance using the Remote SSH plug-in in VScode. We will set it once and then we will automatically connect to our EC2 instance with one click.

Also, we will download and upload files without typing commands, just drag and drop files. We will create or delete files in remote EC2 instance with the help of a mouse.

If you haven’t used it before, you will love it.

Now let’s do it step by step.

Topics we will cover:

1. İnstalling Remote SSH plug-in

2. Setting security group of EC2 instance

3. Creating and Adjusting config file

4. Connecting to our EC2 instance with VScode

5. Checking the files and folders inside the EC2 instance using VScode terminal

6. Downloading and Uploading files to our local computer using VScode.

7. As a result

8. Next post

9. References

If you like the article, I will be happy if you click on the Medium Following button to encourage me to write more, and not miss future articles.

Your clap, follow, or subscribe, they help my articles to reach the broader audience. Thank you in advance for them.

1. İnstalling Remote SSH plug-in

  1. Firstly, set up the Remote SSH plug-in to VScode by clicking on the install button, as shown in Figure 1. (1)
Figures 1

2. Setting security group of EC2 instance

Go to AWS console EC2 menu and launch an EC2 instance that you will connect with VScode, as shown in Figure 2.

Figures 2

Make sure the SSH 22 port of the security group of the EC2 instance is open, as shown in Figure 3. Then, copy public IP address of running ec2 instance, as shown in Figure 2.

Figures 3

3. Creating and Adjusting config file

Create a file named config in ~/.ssh/ directory (user’s home directory) and paste the following codes into it. In Windows OS for me is; ~/.ssh/ = C:\Users\A\.ssh\ as shown in Figure 4.

# Read more about SSH config files: https://linux.die.net/man/5/ssh_config
Host Development-Server
HostName 44.200.0.222
IdentityFile C:\Users\A\.ssh\cumhurkey.pem
User ec2-user

Host *
IdentitiesOnly=yes

Host *
TCPKeepAlive yes
ServerAliveInterval 120

HostName” is public IP address of running ec2 instance.

IdentityFile” is the path of your key.pem that using it on AWS.

User” is the name of the user. Attention: If you are using Ubuntu instance, this should be “ubuntu”. For the EC2 instance, it is “ec2-user”.

TCPKeepAlive yes” This section prevents interruptions from EC2 instances.

Figure 4

Copy and paste your key.pem that using on AWS to the folder with the config file in it, as shown in Figure 5.

Figure 5

Important note: Make sure the key.pem file permissions are as shown in Figure 6. (chmod 400). Otherwise, you will get Could not establish to ec2-usererror.

Figure 6

4. Connecting to our EC2 instance with VScode

Click on the icon in VScode as shown in Figure 7.

Figure 7

Select “connect to host” in the popup window, as shown in Figure 8. (1)

Figure 8

Select “Developmet-Server” in the popup window, as shown in Figure 9.

Figure 9

A new VScode window will open where it will try to connect to the remote instance, as shown in Figure 10.

Figure 10

Select “Linux” in the popup window, as shown in Figure 11.

Figure 11

Select “Continue” in the popup window, as shown in Figure 12.

Figure 12

Our connection to the EC2 Instance is done, as shown in Figure 13.

Figure 13

5. Checking the files and folders inside the EC2 instance using VScode terminal

We can open a terminal and check the contents of the instance, for this click on the Terminal menu and then select New terminal, as shown in Figure 14. (2)

Figure 14.

In the terminal section that opens, we can control the files and folders in EC2 instance using Linux commands, as shown in Figure 15.

Figure 15

6. Downloading and Uploading files to our local computer using VScode.

Undoubtedly one of my favorite features of VScode is that it allows downloading and uploading files without typing commands. For this, click on the Explorer icon (3) and then “Open folder” button, as shown in Figure 16.

Figure 16

Select the directory that you will work in and click on “OK”, as shown in Figure 17.

Figure 17

The VScode window refreshes and the folder directory you selected opens, as shown in Figures 18–19.

Figure 18
Figure 19

For downloading and uploading files without typing commands, just drag and drop files. You can also create or delete files in remote EC2 instance with the help of a mouse as shown in Gif 1.

Gif 1 - Downloading and uploading files using VScode

7. As a result

You should definitely try to connect to our EC2 instant using VScode.

VScode is an easy, fast, and simple solution for working with remote computers.

We will automatically connect to Remote Instance using the Remote SSH plug-in. We set it once and then we automatically connected to our EC2 instance with one click. Also, we downloaded and uploaded files without typing commands, just drag and drop files. We created or deleted files in remote EC2 instance with the help of a mouse.

These features are not even comparable to Nano Vim and other editors. VScode provides great comfort for users.

If you liked the article, I would be happy if you click on the Medium Following button to encourage me to write and not miss future articles.

Your clap, follow or subscribe, they help my articles to reach the broader audience. Thank you in advance for them.

For more info and questions, please contact me on Linkedin or Medium.

8. Next post

We will run VScode on a Linux EC2 instance and use the same features there.

I hope you enjoyed reading this article. Don’t forget to follow my Medium or LinkedIn account to be informed about new articles. I wish you growing success in the DevOps and the Cloud way.

Happy Clouding…

--

--

Cumhur Akkaya

✦ DevOps/Cloud Engineer, ✦ Believes in learning by doing, ✦ Dedication To Lifelong Learning, ✦ Tea and Coffee Drinker. ✦ Linkedin: linkedin.com/in/cumhurakkaya