﻿1
00:00:04,970 --> 00:00:10,370
‫OK. I'm super excited about this assignment for you because bind mounts can be really cool.

2
00:00:10,490 --> 00:00:17,900
‫They're particularly cool for local development or local testing. Because as we've explained before,

3
00:00:18,410 --> 00:00:24,470
‫they're going to allow you to edit files on your host operating system, and then they're actually running

4
00:00:24,500 --> 00:00:29,480
‫or being used inside the container to do things in a much easier way.

5
00:00:29,480 --> 00:00:34,940
‫In this example, we're actually going to be using something called a "Static Site Generator" and this

6
00:00:34,940 --> 00:00:36,330
‫isn't specifically

7
00:00:36,350 --> 00:00:38,690
‫a web developer assignment.

8
00:00:38,690 --> 00:00:41,990
‫We're not actually going to be doing much other than editing a line of text.

9
00:00:41,990 --> 00:00:47,180
‫Really, what this is about, is getting used to the idea of taking host data, that you have on your host

10
00:00:47,180 --> 00:00:53,900
‫machine, and then mounting that into a container, then changing it on the host and watching it be

11
00:00:53,900 --> 00:00:55,440
‫reflected inside the container.

12
00:00:55,490 --> 00:00:56,140
‫Right.

13
00:00:56,180 --> 00:01:02,480
‫In this case, this is a pretty common example. A web developer has source code and HTML and all

14
00:01:02,480 --> 00:01:08,150
‫that, on their host and they normally would have to download all the special tools they need on the host,

15
00:01:08,150 --> 00:01:08,720
‫Right?

16
00:01:08,750 --> 00:01:13,310
‫We would need the programming language tools, a web server, some sort of file watcher that detects

17
00:01:13,310 --> 00:01:16,460
‫changes and restarts things, and all these tools, right?

18
00:01:16,460 --> 00:01:21,230
‫That's normally a big thing for web developers is to figure out how to make all that work on their

19
00:01:21,230 --> 00:01:23,570
‫particular operating system and all the right versions.

20
00:01:23,750 --> 00:01:29,630
‫But the cool thing is in Docker Hub, so many of these problems have gone away because the stacks of those

21
00:01:29,630 --> 00:01:34,360
‫components are all inside a single container, and somebody has done all the hard work for you.

22
00:01:34,370 --> 00:01:37,460
‫In this case, we're going to actually be using Jekyll,

23
00:01:37,460 --> 00:01:39,560
‫and like I mentioned earlier, it's an SSG.

24
00:01:39,560 --> 00:01:47,780
‫Those are really very basic tools that allow you to create markdown, which is basically plain text.

25
00:01:47,780 --> 00:01:51,530
‫Then it takes those and generates it into an HTML website.

26
00:01:51,530 --> 00:01:57,200
‫It's really great for small blogs or simple websites where you don't want to have to be an HTML guru,

27
00:01:57,500 --> 00:02:00,460
‫and you just want to write something simple and have it posted on the web.

28
00:02:00,470 --> 00:02:06,710
‫This is also whenever you see sites run by GitHub, known as GitHub Pages, Jekyll is also the tool that

29
00:02:06,710 --> 00:02:07,700
‫they use.

30
00:02:07,700 --> 00:02:12,910
‫In this case, you're going to jump into the bind mount sample directory, as listed here on the slide.

31
00:02:13,490 --> 00:02:19,220
‫You're going to see some files there. You're going to edit those with your editor of choice, whether

32
00:02:19,220 --> 00:02:24,970
‫it's Visual Studio Code, or Atom, or Vim, or Sublime Text or whatever you like.

33
00:02:25,130 --> 00:02:30,260
‫We're going to have a container running in the background that's running Jekyll and watching those

34
00:02:30,260 --> 00:02:35,510
‫files on your host, and detecting updates, and then automatically updating the web server that's built

35
00:02:35,510 --> 00:02:36,560
‫into the container.

36
00:02:36,920 --> 00:02:40,090
‫To get you started, here is the command you can actually use.

37
00:02:40,220 --> 00:02:45,560
‫You want to jump into that bind mount sample directory, and then run this particular docker run command,

38
00:02:45,800 --> 00:02:51,730
‫which will open up your default localhost and actually map that directory.

39
00:02:51,740 --> 00:02:59,690
‫Remember, the pwd will map that into the site directory inside the container, which is what we've set

40
00:02:59,690 --> 00:03:00,000
‫up here.

41
00:03:00,010 --> 00:03:04,280
‫Then I've made you a custom, Jekyll container that's really easy to use and it's using all the latest

42
00:03:04,280 --> 00:03:05,100
‫versions.

43
00:03:05,120 --> 00:03:11,630
‫So what you should see is you should be able to run that, open up your browser localhost, see the

44
00:03:11,630 --> 00:03:16,910
‫website there with the basic web page. That's actually using the default template. Then you're going

45
00:03:16,910 --> 00:03:22,670
‫to just quickly jump into the post directory that's inside that bind mount sample.

46
00:03:22,670 --> 00:03:24,840
‫You can actually see it here.

47
00:03:28,370 --> 00:03:29,080
‫On my screen,

48
00:03:29,080 --> 00:03:35,000
‫I actually have it in my Visual Studio code. So these will be the files inside that directory.

49
00:03:35,000 --> 00:03:40,340
‫You'll just go into this file here, which is a markdown file, and it's OK if you're not a markdown

50
00:03:40,580 --> 00:03:48,410
‫guru. You just need to change something in here, and then jump over to your web browser and notice

51
00:03:48,410 --> 00:03:52,190
‫how it's reflected automatically as an update once you save the file.

52
00:03:52,250 --> 00:03:57,770
‫Of course, I highly recommend looking at the logs inside Docker to see what it's doing, because it

53
00:03:57,770 --> 00:04:01,610
‫will actually tell you every time a file is changed and it's reloaded the server.

54
00:04:01,610 --> 00:04:06,800
‫If you get stuck or for this doesn't make sense you, just watch my answers lecture video right after

55
00:04:06,800 --> 00:04:07,230
‫this.

56
00:04:07,250 --> 00:04:10,360
‫I'm going to run through this and you can follow along if you get stuck.

57
00:04:10,670 --> 00:04:11,180
‫Good luck.

