1
00:00:00,390 --> 00:00:03,832
Before we can write some code, we need to open some files.

2
00:00:03,832 --> 00:00:07,107
Doing that as quickly and efficiently as possible lets

3
00:00:07,107 --> 00:00:08,467
you get right to work.

4
00:00:08,467 --> 00:00:13,766
Clicking on the File menu reveals the familiar open file option. That

5
00:00:13,766 --> 00:00:17,879
works great if you only want to quickly open and edit

6
00:00:17,879 --> 00:00:18,986
a single file.

7
00:00:18,986 --> 00:00:21,503
If you're working on an entire application,

8
00:00:21,503 --> 00:00:26,125
then you'll likely need to open more than just one file.

9
00:00:26,125 --> 00:00:30,366
I generally store my projects in a single folder and open the

10
00:00:30,366 --> 00:00:32,62
entire folder in VS Code.

11
00:00:32,62 --> 00:00:36,903
With the entire folder open, you can easily navigate subfolders

12
00:00:36,903 --> 00:00:39,636
and edit any files in those folders.

13
00:00:39,636 --> 00:00:44,472
In the VS Code documentation, Microsoft often uses the terms

14
00:00:44,472 --> 00:00:47,474
folder and workspace interchangeably.

15
00:00:47,474 --> 00:00:52,562
A single folder is a workspace, but you can also have workspaces

16
00:00:52,562 --> 00:00:57,166
that consist of multiple root folders. That requires you to

17
00:00:57,166 --> 00:01:01,528
create a workspace file that stores a reference to each

18
00:01:01,528 --> 00:01:03,466
folder in the workspace.

19
00:01:03,466 --> 00:01:08,667
You would open a project like that using the Open Workspace

20
00:01:08,667 --> 00:01:10,192
from File option.

21
00:01:10,192 --> 00:01:14,750
I've already got a folder open in this instance of VS Code.

22
00:01:14,750 --> 00:01:19,379
I can view it by clicking on the explorer icon at the top of the

23
00:01:19,379 --> 00:01:21,583
activity bar here on the left.

24
00:01:21,583 --> 00:01:26,575
Expandable subfolders are displayed at the top and

25
00:01:26,575 --> 00:01:29,734
individual files at the bottom.

26
00:01:29,734 --> 00:01:34,224
The project I've opened is a website for a fictional travel

27
00:01:34,224 --> 00:01:36,702
agency named explore-california.

28
00:01:36,702 --> 00:01:40,580
I'll be using some of the files in the project just to demonstrate

29
00:01:40,580 --> 00:01:43,86
some VS Code features throughout the course.

30
00:01:43,86 --> 00:01:48,21
Single-clicking on a file opens it in the editor pane.

31
00:01:48,21 --> 00:01:53,673
Notice that the name of the file on the editor tab is italicized.

32
00:01:53,673 --> 00:01:59,419
Single-clicking on a different file replaces the open file on

33
00:01:59,419 --> 00:02:02,05
that tab with the new file.

34
00:02:02,05 --> 00:02:09,16
I can open a file and pin it to a tab by double-clicking on it.

35
00:02:09,16 --> 00:02:14,91
If I wanted to add another root folder to this workspace,

36
00:02:14,91 --> 00:02:24,844
I can go back to the File menu and select "Add Folder to Workspace."

37
00:02:24,844 --> 00:02:34,506
I'll choose this mobile-app folder to add to the workspace.

38
00:02:34,506 --> 00:02:39,713
You can now see I have two root folders in my workspace.

39
00:02:39,713 --> 00:02:45,489
I can save this configuration by going back to the File menu and

40
00:02:45,489 --> 00:02:47,964
choosing "Save Workspace As."

41
00:02:47,964 --> 00:02:59,702
I'll choose the default name of explore-california.code-workspace.

42
00:02:59,702 --> 00:03:04,818
I'm now going to quickly close VS Code and show you another option

43
00:03:04,818 --> 00:03:08,336
for opening a project that I use quite a bit.

44
00:03:08,336 --> 00:03:12,908
I'm often working in a terminal and decide to open a project.

45
00:03:12,908 --> 00:03:16,345
You can do that by just typing code followed by what

46
00:03:16,345 --> 00:03:17,490
you want to open.

47
00:03:17,490 --> 00:03:21,231
You can open the current directory by just typing a dot.

48
00:03:21,231 --> 00:03:32,532
I'm going to type the name of the workspace file I just created

49
00:03:32,532 --> 00:03:37,271
to open my entire project.

50
00:03:37,271 --> 00:03:43,314
I'm quickly back in my pre-configured workspace and ready

51
00:03:43,314 --> 00:03:45,904
to write some more code.

52
00:03:45,904 --> 00:03:49,245
Now that you see how to open your projects in VS Code,

53
00:03:49,245 --> 00:03:52,557
let's see some options for navigating your files and

54
00:03:52,557 --> 00:03:56,00
executing commands with the command palette.