﻿1
00:00:04,970 --> 00:00:10,370
‫ตกลง. ฉันตื่นเต้นสุด ๆ กับงานนี้สำหรับคุณเพราะการผูกเมาท์นั้นเจ๋งจริงๆ

2
00:00:10,490 --> 00:00:17,900
‫มันยอดเยี่ยมมากสำหรับการพัฒนาท้องถิ่นหรือการทดสอบในท้องถิ่น

3
00:00:18,410 --> 00:00:29,480
‫เพราะอย่างที่เราอธิบายไว้ก่อนหน้านี้พวกเขาจะอนุญาตให้คุณแก้ไขไฟล์ในระบบปฏิบัติการโฮสต์ของคุณจากนั้นพวกเขากำลังทำงานหรือใช้งานจริงภายในคอนเทนเนอร์เพื่อทำสิ่งต่างๆในวิธีที่ง่ายกว่า

4
00:00:29,480 --> 00:00:34,940
‫ในตัวอย่างนี้เราจะใช้สิ่งที่เรียกว่า "เครื่องมือสร้างเว็บไซต์แบบคงที่"

5
00:00:34,940 --> 00:00:38,690
‫และนี่ไม่ใช่การมอบหมายนักพัฒนาเว็บโดยเฉพาะ

6
00:00:38,690 --> 00:00:41,990
‫พวกเราไม่ได้ทำอะไรมากไปกว่าการแก้ไขข้อความ

7
00:00:41,990 --> 00:00:55,440
‫ที่จริงแล้วสิ่งนี้เกี่ยวกับการทำความคุ้นเคยกับแนวคิดของการรับข้อมูลโฮสต์ที่คุณมีในเครื่องโฮสต์ของคุณและจากนั้นติดตั้งลงในคอนเทนเนอร์แล้วเปลี่ยนมันในโฮสต์

8
00:00:55,490 --> 00:00:56,140
‫ขวา.

9
00:00:56,180 --> 00:01:02,480
‫ในกรณีนี้นี่เป็นตัวอย่างที่พบได้บ่อย นักพัฒนาเว็บมีซอร์สโค้ดและ

10
00:01:02,480 --> 00:01:08,720
‫HTML และทั้งหมดนั้นบนโฮสต์ของพวกเขาและโดยปกติพวกเขาจะต้องดาวน์โหลดเครื่องมือพิเศษทั้งหมดที่พวกเขาต้องการบนโฮสต์ใช่ไหม?

11
00:01:08,750 --> 00:01:13,310
‫เราต้องการเครื่องมือภาษาการเขียนโปรแกรมเว็บเซิร์ฟเวอร์ตัวตรวจจับไฟล์บางประเภทที่ตรวจจับการเปลี่ยนแปลงและรีสตาร์ทสิ่งต่าง ๆ

12
00:01:13,310 --> 00:01:16,460
‫และเครื่องมือเหล่านี้ใช่ไหม

13
00:01:16,460 --> 00:01:23,570
‫ปกติแล้วสิ่งสำคัญสำหรับนักพัฒนาเว็บคือการหาวิธีทำให้ทุกอย่างทำงานบนระบบปฏิบัติการของตนและรุ่นที่ถูกต้องทั้งหมด

14
00:01:23,750 --> 00:01:29,630
‫แต่สิ่งที่ยอดเยี่ยมอยู่ใน Docker Hub

15
00:01:29,630 --> 00:01:34,360
‫ปัญหาเหล่านี้มากมายได้หายไปแล้วเนื่องจากสแต็กของส่วนประกอบเหล่านั้นอยู่ในภาชนะเดียว

16
00:01:34,370 --> 00:01:37,460
‫ในกรณีนี้เราจะใช้ Jekyll จริง ๆ

17
00:01:37,460 --> 00:01:39,560
‫และอย่างที่ฉันบอกไปก่อนหน้านี้ว่ามันคือ SSG

18
00:01:39,560 --> 00:01:47,780
‫สิ่งเหล่านี้เป็นเครื่องมือพื้นฐานที่ช่วยให้คุณสร้าง markdown ซึ่งเป็นข้อความธรรมดา

19
00:01:47,780 --> 00:01:51,530
‫จากนั้นนำสิ่งเหล่านั้นมาสร้างเป็นเว็บไซต์ HTML

20
00:01:51,530 --> 00:01:57,200
‫มันยอดเยี่ยมมากสำหรับบล็อกเล็ก ๆ หรือเว็บไซต์ง่ายๆที่คุณไม่ต้องการเป็นกูรู HTML

21
00:01:57,500 --> 00:02:00,460
‫และคุณแค่ต้องการเขียนอะไรที่ง่ายและโพสต์ลงบนเว็บ

22
00:02:00,470 --> 00:02:07,700
‫นี่คือทุกครั้งที่คุณเห็นเว็บไซต์ที่ดำเนินการโดย GitHub หรือที่รู้จักกันในชื่อ GitHub Pages Jekyll ก็เป็นเครื่องมือที่พวกเขาใช้เช่นกัน

23
00:02:07,700 --> 00:02:12,910
‫ในกรณีนี้คุณจะกระโดดเข้าไปในไดเรกทอรีตัวอย่างผูกติดดังที่แสดงไว้ที่นี่บนสไลด์

24
00:02:13,490 --> 00:02:19,220
‫คุณจะเห็นไฟล์ที่นั่น คุณกำลังจะแก้ไขสิ่งเหล่านี้ด้วยโปรแกรมแก้ไขที่คุณเลือกไม่ว่าจะเป็นรหัส Visual Studio

25
00:02:19,220 --> 00:02:24,970
‫หรือ Atom หรือ Vim หรือ Sublime Text หรืออะไรก็ตามที่คุณต้องการ

26
00:02:25,130 --> 00:02:30,260
‫เรากำลังจะมีคอนเทนเนอร์ที่ทำงานในพื้นหลังที่กำลังเรียกใช้

27
00:02:30,260 --> 00:02:36,560
‫Jekyll และดูไฟล์เหล่านั้นบนโฮสต์ของคุณและตรวจจับการอัปเดตจากนั้นอัปเดตเว็บเซิร์ฟเวอร์ที่อยู่ในคอนเทนเนอร์โดยอัตโนมัติ

28
00:02:36,920 --> 00:02:40,090
‫เพื่อให้คุณเริ่มต้นได้นี่คือคำสั่งที่คุณสามารถใช้ได้จริง

29
00:02:40,220 --> 00:02:45,560
‫คุณต้องการข้ามไปยังไดเรกทอรีตัวอย่าง bind mount นั้นจากนั้นรันคำสั่ง

30
00:02:45,800 --> 00:02:51,730
‫run docker เฉพาะซึ่งจะเปิด localhost เริ่มต้นของคุณและแมปไดเรกทอรีจริง

31
00:02:51,740 --> 00:03:00,000
‫โปรดจำไว้ว่า pwd จะจับคู่นั้นกับไดเรกทอรีของไซต์ภายในคอนเทนเนอร์ซึ่งเป็นสิ่งที่เราตั้งไว้ที่นี่

32
00:03:00,010 --> 00:03:05,100
‫ถ้าอย่างนั้นฉันได้ทำให้คุณเป็นคนกำหนดเองภาชนะบรรจุ Jekyll นั้นใช้งานง่ายและมันใช้รุ่นล่าสุดทั้งหมด

33
00:03:05,120 --> 00:03:16,910
‫ดังนั้นสิ่งที่คุณควรเห็นคือคุณควรจะสามารถเปิดใช้งานได้เปิดเบราว์เซอร์ในพื้นที่ของคุณดูเว็บไซต์ที่มีหน้าเว็บพื้นฐาน

34
00:03:16,910 --> 00:03:16,910
‫ที่จริงแล้วใช้เทมเพลตเริ่มต้น

35
00:03:16,910 --> 00:03:22,670
‫จากนั้นคุณจะกระโดดเข้าสู่สารบบโพสต์ที่อยู่ในตัวอย่างที่เชื่อมโยง

36
00:03:22,670 --> 00:03:24,840
‫คุณสามารถดูได้ที่นี่จริง ๆ

37
00:03:28,370 --> 00:03:35,000
‫บนหน้าจอของฉันฉันมีอยู่ในรหัส Visual Studio ของฉัน

38
00:03:35,000 --> 00:03:35,000
‫ดังนั้นสิ่งเหล่านี้จะเป็นไฟล์ภายในไดเรกทอรีนั้น

39
00:03:35,000 --> 00:03:48,410
‫คุณจะเข้าสู่ไฟล์นี้ที่นี่ซึ่งเป็นไฟล์มาร์กดาวน์และมันก็โอเคถ้าคุณไม่ใช่กูรูด้านล่าง

40
00:03:48,410 --> 00:03:52,190
‫คุณเพียงแค่ต้องเปลี่ยนบางสิ่งในที่นี่จากนั้นข้ามไปที่เว็บเบราว์เซอร์ของคุณและสังเกตว่ามันสะท้อนให้เห็นโดยอัตโนมัติว่าเป็นการอัพเดตเมื่อคุณบันทึกไฟล์

41
00:03:52,250 --> 00:03:57,770
‫แน่นอนฉันขอแนะนำให้ดูบันทึกใน Docker

42
00:03:57,770 --> 00:04:01,610
‫เพื่อดูว่ามันทำอะไรเพราะมันจะบอกคุณทุกครั้งที่มีการเปลี่ยนแปลงไฟล์และโหลดเซิร์ฟเวอร์ใหม่

43
00:04:01,610 --> 00:04:07,230
‫หากคุณติดขัดหรือเรื่องนี้ไม่สมเหตุสมผลคุณเพียงแค่ดูวิดีโอคำบรรยายของฉันหลังจากนี้

44
00:04:07,250 --> 00:04:10,360
‫ฉันจะวิ่งผ่านสิ่งนี้และคุณสามารถทำตามได้ถ้าคุณติดขัด

45
00:04:10,670 --> 00:04:11,180
‫โชคดี.

