Become a VS Code Power User

Basic Structure of a Task

Steve Kinney
Temporal
Become a VS Code Power User

Lesson Description

The "Basic Structure of a Task" Lesson is part of the full, Become a VS Code Power User course featured in this preview video. Here's what you'd learn in this lesson:

Steve explains that tasks are a way to run repeated commands or tasks from within VS Code. He explains the anatomy of a task, including the label, command, problem matcher, and additional metadata. He also mentions that tasks can be customized and saved in the tasks.json file, which can be checked into version control.

Preview
Close

Transcript from the "Basic Structure of a Task" Lesson

[00:00:00]
>> Steve Kinney: All right, so tasks. Tasks are a way. How do I explain this without using the word in the definition? Tasks are a way to run tasks, any of the repeated things, if you find yourself going to the command line to do thing, maybe that should be task, right?

[00:00:17]
Thing could be NPM run dev. Thing could be NPM run build. Thing could be NPM start, NPM lint, whatever, it could be some other like Shell command that you run. It could be, I don't know, rails. What do you start rails out with these days?
>> Speaker 2: Well, there's rails s or docker compose up or,

[00:00:43]
>> Steve Kinney: Either one, right? We'll deal with the Docker Compose one in a second. But, yeah, Rails s, it used to be a Rails developer, I swear. Those could all be tasks. So we're gonna look a little bit at tasks. And kind of look at the anatomy and then we'll do a few of them.

[00:01:03]
But like, it is one of those things, if I just start writing them, I think it'll be more confusing than if we talk about a little bit first. This is a task, like everything else today, hit JSON, right? With a little bit of regex at some point too.

[00:01:21]
Don't worry, everything in this course is really just Jason and regex at the end of the day. Let's talk about the ones that are easy. Label, that is the label.
>> Steve Kinney: Command, that is what you wanna run. Now there's two different ways to do this. But we're starting with the easiest one is run a shell command.

[00:01:41]
What do you think this command does? It runs that. Problem Matcher is a regex that will basically scan the standard out or standard error output. And then if based on, there are some built-in ones, TSC is, in this case, the typescript compiler, right, that knows the output of the task, here for pilots, one for EsLint, there's a few others.

[00:02:09]
Which is basically, if it says, error in this file, line this column that, it is simply a regex that says the VS code. Hey, show a little warning sign in the editor in this file, unline that. And for every given tool, the output's gonna be a little different, so you have a different problem matcher.

[00:02:28]
But for the common ones, like the typescript compiler, like Jest, like ESLint, there are pre-baked ones. Some of them exist in extensions, some of them are just in there by default. I think at one point or another, I put, built-in problem matchers, I did the thing. I predicted the question in advance.

[00:02:46]
These are the built-in ones, other ones can come from exceptions, so ESLint, TSC, JSHint. Like I said, if you have the JEST extension, I think this is a JeSt one, so on and so forth. And then some bonus metadata. Is this a build task? In this case, is it the default build task?

[00:03:06]
So if we wanna say, run the build task, this is what it is, right? Could you go to the command line and type NPM Run build? Yes, you could, right? But the nice part here is, you can do a bunch of really clever things that we'll talk about in a second.

[00:03:21]
We'll have some examples apps where you can play around this if you want, but to be clear, most of the real practical part of this is bespoke to your application, right, whatever script that you run. But the really cool thing about this is, one thing that i hate the most in the world is, when I have to open up multiple terminal tabs, don't talk to me about Tmux or Screen, I am aware they exist.

[00:03:43]
We'll put this out in the background, but if I have to do multiple things and multiple terminals to start up webpack, to start up my Express server, to do this other thing, right? Like I don't want to, yeah.
>> Speaker 3: For the tasks, are they local to your workspace only?

[00:03:58]
>> Steve Kinney: Did you check them into version control?
>> Speaker 3: Yeah,
>> Steve Kinney: So, yeah, it's up to you. And because it's a different file than that settings.json, you could choose to not check in settings.json, but you almost always wanna check in the task subjects.
>> Speaker 3: Yeah, cuz it wouldn't be kind of like you're hoarding something that's,-

[00:04:16]
>> Steve Kinney: All the productivity. Now it depends, do you want to appear faster than your peers? Do not check it into version control. Do you want to share the wealth? Check it into version control? It depends on, like, how toxic you want to be, right? And so, at temporal if you wanna run a workflow, you got to spin up the workflow, and then some number of workers.

[00:04:39]
And I don't wanna do that across multiple tabs, I don't wanna screen or tmux it. I don't wanna play weird things where I do Command Z or whatever. I don't wanna do it or control, whatever. I don't wanna do any of that. And so, what I can do is set up a bunch of these tasks.

[00:04:54]
Let's just look at some other ones and then we'll play around with it. Cuz I think, talking about it first is actually better. This is a simple shell task. There are process ones where it's like, you don't have access to do whatever you want in the shell, right?

[00:05:11]
Safer if you can get away with it, obviously more flexible. This one will actually just run Node. So there's no ability to grab environment variables that could accidentally be your open open AI key, whatever. This is a little more constrained one, and you can see, there's the command, there are the arguments, right?

[00:05:30]
When you run this task, what's gonna happen? It's gonna run node app.js, right? And you could put other things in here like, --inspect breakpoints, inspect brk, whatever. You can put in whatever command line tools, you can set environment variables. So if you want to run it under production versus under test.

[00:05:51]
You can set up all those things so then you can hit the command palette and call it a day. And I guess if you use gulpogrunt, there are some of those, I can't speak to them, so that's fine.

Learn Straight from the Experts Who Shape the Modern Web

  • In-depth Courses
  • Industry Leading Experts
  • Learning Paths
  • Live Interactive Workshops
Get Unlimited Access Now