Developing through SSH

[00:00:00]
>> Burke Holland: Remote development comes in three flavors. It's brand new, and it's really exciting. The first one SSL, or SSH, excuse me. So this allows you to develop on a server that you're not on. Now, why would you do this? Some people, and there's somebody behind this camera right now, watching this, that knows exactly what I'm talking about.

[00:00:20]
They have to develop in a secure environment. Snd the way they do that is they SSH into a server, they remote desktop into a server, and that's how they develop. But there is a use case for that, we have secure scenarios. So the first thing I want to show you, it's not your exercises.

[00:00:36]
But the first thing I want to show you is remote development on a remote server. So what I'm gonna do is, I'm going to open up the command palatte with Cmd or Ctrl+Shift+P. And I'm just gonna say remote development. And you can see here we've got Remote-Containers and we've got Remote-SSH.

[00:00:53]
So what I wanna do is connect to a host. Now, I've created a virtual machine that's running in Azure. That is running one of my side projects called the URL list. So to connect to that I'm gonna stay connected to host. And I've already added a host in here.

[00:01:10]
If we say, configure SSH Hosts, that's gonna give us a file. And you can see here that I've added that host here. And this is the host name. The other way I can get to this is by clicking this little icon in the left hand corner and saying connect to host.

[00:01:26]
And then let's connect to the urlist-dev-machine. This is gonna reload Visual Studio Code, and you can see setting up SSH host. And we can look at the details here. And what it's doing right now is it is installing a little server on that server. And then it is installing any of the extensions that I'm going to need on that other side in order to properly work with this project, like it's in my local VS Code, even though it absolutely isn't, all right?

[00:01:58]
So now we are connected you can see that here, so what are we wanna do? We wanna open the project. How do we do that? Well, we say open folder and look were we are. We are on the server. It looks like we are on my machine but we are not.

[00:02:11]
We are remotely developing on the server. So now I can go down to dev, and I can go to my file here or my folder here and then I'm gonna load in this back end C#. So this project is written in C#. And I'm gonna load in this folder here.

[00:02:26]
I'm gonna say okay. And it's going to open the dictionary application. I have no idea why. All right, so this is my application is now loaded. And this is an Azure Functions Project. I don't have any of that installed. But I don't need to because it's all installed on the server.

[00:02:48]
So I'm gonna say yes here and it's gonna add in all the configuration. And now what I want to do is I want to run this application. So in order to do that, what I need to do first is if you're a C# developer, you know this, I need to do something called a restore.

[00:03:05]
If you are not a C# developer don't worry about it. Just know you need to pull down dependencies for the project to make sure that you've got them. So if we look over here, actually I already have on this remote machine, I've already got the extension for C# installed.

[00:03:20]
It's on the machine already. So what I'm gonna do is just Cmd+Shift+P and I'm gonna say, restore. And that's gonna do a .NET Restore Project here and do a .NET Restore. And it will begin to do a restore using the .NET framework. And it's gonna pull down all of the dependencies that we need to run this.

[00:03:39]
Now where is it pulling it down, to my machine? No, the server. It's look like we're on my machine, we are not on my machine. All right, so it didn't need any, it's done here. So now we can run this thing. So let's do that. So I'm going to come here.

[00:03:53]
And just for a little bit of context here I created an application called the URL list. And what it does is it allows you to manage lists of URLs. So for instance, I'm going to log in here. If I wanted to create a list of all my favorite VS Code extensions, I could do that by creating a list.

[00:04:13]
And here's some of them. So I've added some VS Code extensions, one VS Code extension right here. But I've got some other lists that have more stuff on them. And then you can view it by just sending someone a simple URL. It's a simple idea. But it's a Vue application with a server list API.

[00:04:28]
What we're doing on this remote server, we're running this API in development. All light, so let's go back here to VS Code. And all of this is pre-configured on the server. I'm just going to hit the green button here and it's going to fire up our application. And it is gonna fire up our project.

[00:04:52]
Now these are all the different end points that I can call. All right so I'm gonna just call this get here, get links right here. So I'm gonna click on this right here.
>> Burke Holland: It's not working. Why isn't it working? Why does that not work?
>> [INAUDIBLE]
>> Burke Holland: Cuz it's on my computer.

[00:05:18]
This is localhost. This application is not running on my computer. It's running on another computer. So what do we do? We come back over here. We look at our remote development extension in the activity bar, and we wanna forward a port. So I'm going to click forward report.

[00:05:38]
And I believe it was 7071 and then name it functions. And it's gonna set up port forwarding. And now, watch this, even though this is not my machine, it thinks that it is. In fact, if I do,
>> Burke Holland: Hit the API, and there it is. So even though this is not my local host, my machine now thinks that it is.

[00:06:10]
So I can interact with this machine, like it's local. I can debug it. I can run it locally. And all of that is happening on a another server. That is a pretty magical thing. However, it is a pretty specific use case. Most of us do not develop on servers, we develop locally.

[00:06:26]
So I want to introduce a different scenario for you. The other one is containers. So let's go ahead and disconnect from this. I'm gonna close this instance of VS Code. I have here in my project in my start folder a Azure functions project. I'm gonna go ahead and remove this so we can start from scratch.

[00:06:51]
Then let's reopen this as a workspace. See, open workspace. Ask me which one, let's go to dev. That's the right one, and then let's open remote development, start. And here is our workspace file. There we go.