Write Code in Containers with VS Code and Remote Containers

Who's keeping that security good? Who's keeping that security good? Hello world. My name is Michael Jolley and I'm the bald bearded builder. I wanna talk about Versus Code Extensions.

But first let's talk about some issues that we all have as developers. From onboarding to security, to this steady supply of new SDKs and CLIs we have to download. We'll start with onboarding. If you've ever joined a team or maybe somebody has joined your team, you've had that experience where, when you finally get your machine, you have to install everything. IDEs, databases, CLIs, SDKs, you know, there's just so much.

And then once you finally get it all installed, you're ready to contribute to the team and you press build and it doesn't work because somebody forgot to tell you about that environment variable you have to have. And then you get that figured out and you go and it actually builds and you're ready to go look at your app. And then it fails because it was an API key somebody forgot to clue you in on. And then let's talk about security. When we have all those dot nets and nodes and Python versions installed, who's keeping those all up to date because they're definitely security attack vectors for us.

And which one am I talking to when I type dot net in my terminal? Is it three, is it four, is it five? Where am I going here? And then you get the issue of consistent environments.

When the customer says something's wrong and you're like, it works on my machine, but believe it or not, they don't wanna hear that. So wouldn't it be nice if the environment we're developing in matches production?

And that's where today's extension comes in. Remote containers. It allows us to build in consistent environments. It allows us to bring new teammates up to speed even faster. And then it keeps us more secure because all those CLIs and SDKs live in the container and not on our local machine.

And they go away when the container goes away. Before we get into it, I wanna remind you that if you enjoy hanging out with other developers, having a good time and learning things, we are live on Twitch three days a week, Tuesday through Thursday at 2PM Eastern seven UTC. And we'd love to have you join us at twitch. Tvbaldbeardedbuilder. And now let's get back to the extension.

So how do we install it? Well, as always, I've left a link in the description if you wanna learn more about it. But the easiest way is to click that extension link in Code, search for remote containers and press the install button.

Now, how do we use it? Once it's installed, you can press the remote containers button in the far left bottom and choose to open a folder in a container. Choose your existing project. We're gonna choose a node project in this case. And then it's gonna give you a selection of base images you can use.

There's various flavors of node. There's rust, there's swift, there's go, there's Java, there's dot net. Anything you can think of, they've got the base image for that. Of And course you can bring your own image as well but we're gonna just choose a base node image to start with. One of the things you'll see really quick once you open up the terminal is that your terminal is the terminal from inside the container, which is really nice.

So if you're developing on a Windows machine, if you open the terminal, you'll see bash in this case because it's a Linux container, which is really nice to have that environment, your terminal matching the environment you're working in. Once you open the folder in a container, it's gonna create a new folder in the root of your project called .devcontainer.

This will have two files in it, a Docker file and a devcontainer. Json. The Docker file is just what you would expect. It's a very simple Docker file, but this is where you can add things like environment variables that need to be set up for every developer, API keys. If there are any kind of like SDKs or CLIs you wanna have installed, this is the place to do it.

Pre install that Google Cloud CLI so that it's available in the terminal, but not necessarily installed on everyone's local machine. The devcontainer. Json is more about developer experience.

So if you know there's a port that you wanna open for debugging, you can specify it there and it'll automatically map from the container to your host. And then if you have any commands you wanna run after the containers initially created like npm install or yarn install, you can specify that just to get your developers up to speed faster. Thirdly, if there are any extensions that are specific to the technologies you're using, you can specify them in here and it'll automatically install them when they create the container, which is really nice. They don't have to have say Veeder installed or ESLint or prettier extensions installed. But when they start up that container, if you've specified that they need that prettier extension or Veeder, it'll automatically install it and have it in their environment and it'll go away as soon as they close that workspace.

Debugging works exactly like you'd expect. Matter of fact, it behaves just like you're on your local machine. If you need to hit something on port 3,000, go to port 3,000. Whatever you exposed in that devcontainer. Json will be exposed to the host and behave as if you were running the code locally.

And if you forgot to specify something in that devcontainer. Json, you can add it later. You can run it on the fly as a matter of fact. One thing that's really cool is you can actually hit break points inside the container by hitting things on the host, which makes it really nice. Do you use the remote containers extension?

I would love to know what you're using it for. I put it in place in all of my projects now and I can't imagine living without it. I don't wanna install that stuff on my machine. Matter of fact, I should probably title this video, hashtag not on my machine.

Listen, if you enjoyed this video be sure to hit the like button. And if you wanna see more about Versus Code extensions be sure to subscribe and hit that bell to know when we release new videos until next time.