1
00:00:00,000 --> 00:00:05,693
[MUSIC]

2
00:00:05,693 --> 00:00:09,002
Bây giờ bạn có Node.js trên máy tính của bạn,

3
00:00:09,002 --> 00:00:13,870
bạn rõ ràng muốn ngay lập tức bắt đầu sử dụng nó.

4
00:00:13,870 --> 00:00:17,038
Vì vậy, trong bài tập này, chúng ta sẽ bắt đầu sử dụng Node.

5
00:00:17,038 --> 00:00:20,921
Chúng tôi sẽ thiết lập một tập tin đóng gói, hoặc liền kề, cho

6
00:00:20,921 --> 00:00:25,500
thư mục thử nghiệm Git của chúng tôi mà chúng tôi đã làm việc với cho đến nay.

7
00:00:25,500 --> 00:00:30,400
Sau đó, chúng tôi sẽ thiết lập một mô-đun nút gọi là lite server

8
00:00:30,400 --> 00:00:34,519
sẽ phục vụ lên nội dung của thư mục thử nghiệm get của chúng tôi.

9
00:00:34,519 --> 00:00:39,760
Và sau đó chúng ta có thể duyệt tệp index.html này và

10
00:00:39,760 --> 00:00:43,320
các tệp khác trong trình duyệt.

11
00:00:43,320 --> 00:00:48,960
Và chúng ta cũng sẽ thấy làm thế nào máy chủ lite sẽ cho phép chúng ta

12
00:00:50,390 --> 00:00:56,805
tự động xem các bản cập nhật cho cửa sổ trình duyệt của chúng tôi khi chúng tôi thực hiện thay đổi

13
00:00:56,805 --> 00:01:02,333
tập tin index.html của chúng tôi, hoặc bất kỳ tập tin nào khác trong thư mục get test của chúng tôi.

14
00:01:02,333 --> 00:01:08,916
Các lite server là một cái gì đó mà chúng tôi sẽ sử dụng rộng rãi trong các

15
00:01:08,916 --> 00:01:14,010
khóa học này và trong tương lai, để có thể nhìn thấy những thay đổi trong thời gian thực

16
00:01:14,010 --> 00:01:19,125
trong một cửa sổ trình duyệt khi bạn chỉnh sửa các tập tin của dự án của bạn.

17
00:01:22,216 --> 00:01:25,650
Như tôi đã đề cập, chúng tôi muốn thiết lập tập tin package.json.

18
00:01:25,650 --> 00:01:29,300
Vì vậy, những gì chính xác là tập tin package.json này mà chúng ta sẽ thiết lập?

19
00:01:29,300 --> 00:01:32,738
Vì vậy, ở đây, tôi có một số thông tin từ

20
00:01:32,738 --> 00:01:38,390
trang web npmjs.org

21
00:01:38,390 --> 00:01:43,176
trong đó xác định chính xác những gì là vai trò của tập tin package.json.

22
00:01:43,176 --> 00:01:47,781
Vì vậy, tập tin package.json phục vụ như

23
00:01:47,781 --> 00:01:51,670
là tài liệu về những gì tất cả các gói khác mà dự án của bạn phụ thuộc vào.

24
00:01:51,670 --> 00:01:56,030
Vì vậy, ví dụ, khi bạn thiết lập máy chủ lite của dự án của bạn,

25
00:01:56,030 --> 00:01:58,907
nó sẽ được ghi lại trong tập tin package.json.

26
00:01:58,907 --> 00:02:07,200
Và do đó, sau đó, bạn cũng có thể sử dụng gói đó trong tương lai.

27
00:02:07,200 --> 00:02:12,460
Ngoài ra, nó cho phép bạn xác định phiên bản cụ thể nào của một gói

28
00:02:12,460 --> 00:02:14,710
mà dự án của bạn phụ thuộc vào.

29
00:02:14,710 --> 00:02:19,784
Vì vậy, ngay cả khi gói mà bạn phụ thuộc vào những thay đổi trong tương lai,

30
00:02:19,784 --> 00:02:24,762
bạn có thể nhấn mạnh rằng bạn muốn người dùng để cài đặt chỉ một

31
00:02:24,762 --> 00:02:30,650
phiên bản cụ thể của gói để sử dụng trong ứng dụng nút của bạn.

32
00:02:30,650 --> 00:02:34,151
Và cũng có thể, nó làm cho bản dựng của bạn có thể tái sản xuất,

33
00:02:34,151 --> 00:02:38,177
có nghĩa là khi bạn chia sẻ mã của bạn với người khác,

34
00:02:38,177 --> 00:02:42,552
sau đó họ cũng có thể cài đặt tất cả các mô-đun nút,

35
00:02:42,552 --> 00:02:47,128
như chúng ta sẽ thấy sau này trong bài tập này, trên máy tính của riêng họ.

36
00:02:50,900 --> 00:02:57,610
Vì vậy, rõ ràng câu hỏi tiếp theo của bạn sẽ là, làm thế nào để chúng tôi tạo ra tập tin package.json này?

37
00:02:57,610 --> 00:03:04,473
Nếu bạn đang bắt đầu một dự án mới mà bạn muốn khởi tạo

38
00:03:04,473 --> 00:03:10,425
tập tin package.json, sau đó chỉ cần gõ npm init tại dấu nhắc trong thư mục dự án.

39
00:03:10,425 --> 00:03:14,789
Và sau đó sẽ đưa bạn qua một tập hợp các bước mà sẽ cho phép

40
00:03:14,789 --> 00:03:17,150
bạn cấu hình tập tin package.json của bạn.

41
00:03:17,150 --> 00:03:20,910
Vì vậy, chúng ta hãy tiếp tục với điều đó cho dự án thử nghiệm Git của chúng tôi.

42
00:03:22,290 --> 00:03:28,200
Vì vậy, ở đây tôi đang ở trong thư mục git-test trong cửa sổ thiết bị đầu cuối của tôi.

43
00:03:28,200 --> 00:03:32,615
Đảm bảo rằng bạn cũng mở một cửa sổ thiết bị đầu cuối hoặc một cửa sổ lệnh và

44
00:03:32,615 --> 00:03:34,791
sau đó đi đến thư mục git-test.

45
00:03:34,791 --> 00:03:38,831
Và tại dấu nhắc, gõ npm init.

46
00:03:38,831 --> 00:03:43,235
Và sau đó làm theo các câu hỏi được hỏi.

47
00:03:43,235 --> 00:03:48,275
Vì vậy, đối với tên của dự án, chúng tôi sẽ chỉ để nó như là mặc định, git-test.

48
00:03:48,275 --> 00:03:51,546
Đối với phiên bản, chúng tôi sẽ chỉ để nó như 1.0.0.

49
00:03:51,546 --> 00:03:53,135
Chúng ta có thể chỉnh sửa nó sau.

50
00:03:53,135 --> 00:03:58,252
Để mô tả,

51
00:03:58,252 --> 00:04:04,647
đây là một thư mục test

52
00:04:04,647 --> 00:04:10,740
để học Git và Node.

53
00:04:10,740 --> 00:04:13,400
Nó không quan trọng, gõ một số mô tả ở đó.

54
00:04:13,400 --> 00:04:16,994
Và sau đó là điểm nhập cảnh, tôi sẽ chỉ nói index.html.

55
00:04:18,260 --> 00:04:24,508
Thông thường nếu nó là một gói nút, điểm nhập sẽ là index.js.

56
00:04:24,508 --> 00:04:28,623
Bây giờ thư mục này mà chúng tôi đã thiết lập là

57
00:04:28,623 --> 00:04:34,280
một thư mục dựa trên index.html, vì vậy đó là lý do tại sao tôi chỉ cần gõ vào index.html.

58
00:04:34,280 --> 00:04:35,972
Kiểm tra lệnh, không có gì.

59
00:04:35,972 --> 00:04:40,994
Kho lưu trữ Git, nếu chúng ta đã thiết lập kho lưu trữ git trong

60
00:04:40,994 --> 00:04:45,297
bài tập trước đó, nó sẽ tự động nhắc rằng cho bạn, nếu không,

61
00:04:45,297 --> 00:04:50,318
điều này sẽ trống rỗng và cung cấp cho bạn một tùy chọn để gõ vào URL kho lưu trữ git,

62
00:04:50,318 --> 00:04:53,920
trong trường hợp bạn đang sử dụng một kho lưu trữ git trực tuyến.

63
00:04:53,920 --> 00:04:56,980
Một số từ khóa cho dự án của bạn, mà tôi sẽ để trống.

64
00:04:56,980 --> 00:04:58,760
Tác giả, hãy nhập tên của bạn.

65
00:04:58,760 --> 00:05:00,214
Hãy tự ái đi.

66
00:05:04,497 --> 00:05:06,590
Và giấy phép.

67
00:05:06,590 --> 00:05:15,050
Và sau đó, nó sẽ cho bạn thấy cấu hình của tập tin package.json ở định dạng JSON.

68
00:05:15,050 --> 00:05:18,860
Vì vậy, nếu gia đình bạn có một JSON, nó trông rất, rất quen thuộc với bạn.

69
00:05:18,860 --> 00:05:22,210
Vì vậy, nếu điều này có vẻ tất cả tốt, chúng ta hãy chỉ nói OK và

70
00:05:22,210 --> 00:05:27,790
sau đó kết quả trong việc tạo ra các tập tin package.json.

71
00:05:27,790 --> 00:05:30,970
Vì vậy, bây giờ nếu bạn liệt kê các nội dung thư mục,

72
00:05:30,970 --> 00:05:34,680
bạn sẽ thấy các tập tin package.json trong nội dung thư mục.

73
00:05:36,430 --> 00:05:42,210
Mở thư mục thử nghiệm Git đó trong trình soạn thảo yêu thích của bạn,

74
00:05:42,210 --> 00:05:47,270
và sau đó xem nội dung của tập tin package.json trong trình soạn thảo của bạn.

75
00:05:48,950 --> 00:05:54,470
Bước tiếp theo, chúng ta sẽ tìm hiểu làm thế nào chúng ta có thể cài đặt một mô-đun nút

76
00:05:54,470 --> 00:05:57,950
sử dụng NPM, Node Package Manager.

77
00:05:57,950 --> 00:06:02,750
Vì vậy, chúng tôi sẽ cài đặt mô-đun nút này được gọi là máy chủ ánh sáng.

78
00:06:02,750 --> 00:06:07,890
Máy chủ ánh sáng sẽ phục vụ nội dung của thư mục git-test này trong

79
00:06:07,890 --> 00:06:13,150
một máy chủ mà nó khởi động để bạn có thể xem nội dung trong một trình duyệt.

80
00:06:13,150 --> 00:06:15,753
Cho rằng chúng tôi có một tập tin index.html,

81
00:06:15,753 --> 00:06:19,580
nếu chúng tôi phục vụ lên thư mục này, sau đó nó sẽ là một trang web.

82
00:06:19,580 --> 00:06:24,130
Và bạn có thể xem index.html trong trình duyệt.

83
00:06:24,130 --> 00:06:28,460
Vì vậy, chúng ta hãy thiết lập máy chủ ánh sáng và sau đó chúng ta sẽ thấy làm thế nào chúng ta có thể

84
00:06:28,460 --> 00:06:31,820
sử dụng máy chủ ánh sáng để phục vụ nội dung của thư mục này.

85
00:06:31,820 --> 00:06:36,530
Điều này rất, rất hữu ích bởi vì nếu bạn đang làm việc trên một

86
00:06:36,530 --> 00:06:42,240
dự án phát triển web, bạn muốn xem phiên bản trực tiếp của dự án phát triển web của bạn.

87
00:06:42,240 --> 00:06:45,060
Vì vậy, khi bạn thực hiện thay đổi dự án của mình,

88
00:06:45,060 --> 00:06:49,400
bạn có thể thấy những thay đổi ngay lập tức được phản ánh trong trình duyệt.

89
00:06:49,400 --> 00:06:53,840
Vì vậy, đây là một gói nút rất tốt rất hữu ích cho mục đích này.

90
00:06:53,840 --> 00:06:55,980
Vì vậy, hãy thiết lập máy chủ ánh sáng này.

91
00:06:55,980 --> 00:06:58,190
Để làm điều đó, hãy thêm dấu nhắc.

92
00:06:58,190 --> 00:07:01,120
Gõ vào cài đặt NPM.

93
00:07:01,120 --> 00:07:05,244
Vì vậy, thông báo, nếu bạn muốn NPM để cài đặt một gói nút,

94
00:07:05,244 --> 00:07:10,686
đây là cách bạn sẽ gọi nó và sau đó bạn sẽ nói lite-server.

95
00:07:10,686 --> 00:07:16,685
Và sau đó, chúng tôi cũng muốn tiết kiệm thực tế là dự án của chúng tôi đang sử dụng máy chủ lite.

96
00:07:16,685 --> 00:07:20,587
Vì vậy, chúng tôi sẽ lưu thông tin này trong tập tin package.json.

97
00:07:20,587 --> 00:07:27,492
Vì vậy, để làm điều đó, bạn sẽ gõ vào — save-dev.

98
00:07:27,492 --> 00:07:33,398
Bây giờ tùy chọn save-dev xác định rằng máy chủ lite này được sử dụng cho

99
00:07:33,398 --> 00:07:37,820
sự phụ thuộc phát triển cho dự án của chúng tôi.

100
00:07:37,820 --> 00:07:43,230
Nếu bạn đang cài đặt một mô-đun nút mà trên đó dự án của bạn là trực tiếp phụ thuộc

101
00:07:43,230 --> 00:07:48,680
vào, sau đó bạn sẽ cài đặt nó bằng cách chỉ đơn giản là nói —save option.

102
00:07:49,680 --> 00:07:52,110
Vì vậy, chúng ta hãy đi trước và cài đặt nó.

103
00:07:52,110 --> 00:07:56,990
Và bạn kiên nhẫn chờ đợi cho quá trình cài đặt diễn ra.

104
00:08:00,140 --> 00:08:06,890
Nó sẽ mất tất cả một vài phút để hoàn tất cài đặt của nó.

105
00:08:06,890 --> 00:08:11,830
Một khi đã được cài đặt, sau đó bạn sẽ ngay lập tức

106
00:08:11,830 --> 00:08:16,771
nhận thấy khi bạn nhìn vào nội dung của thư mục của

107
00:08:16,771 --> 00:08:25,099
bạn, bạn sẽ ngay lập tức nhận thấy rằng có một thư mục có được tạo ra tên node_modules.

108
00:08:25,099 --> 00:08:30,251
Bây giờ, nếu bạn đi vào node_module, bạn sẽ thấy một loạt

109
00:08:30,251 --> 00:08:35,120
các thư mục con khác trong đó, chứa các module nút,

110
00:08:35,120 --> 00:08:40,098
đó là cần thiết cho những người thích mô-đun nút của chúng tôi và vân vân.

111
00:08:40,098 --> 00:08:44,873
Vì vậy, chúng ta hãy có một tour du lịch nhanh chóng của thư mục module nút để xem

112
00:08:44,873 --> 00:08:47,515
những gì nội dung của những là.

113
00:08:50,764 --> 00:08:55,713
Đi đến thư mục git-test của tôi, nếu bạn đang đi đến thư mục module nút,

114
00:08:55,713 --> 00:09:00,130
bạn sẽ thấy, như tôi đã nói, một bó toàn bộ các thư mục con ở đó.

115
00:09:00,130 --> 00:09:04,972
Thông thường bạn không cần phải mạo hiểm vào thư mục module node.

116
00:09:04,972 --> 00:09:09,222
Họ chỉ tồn tại ở đó bởi vì họ là cần thiết cho [không nghe được].

117
00:09:09,222 --> 00:09:16,470
Vì vậy, khi bạn duyệt qua, bạn sẽ nhận thấy một thư mục có tên lite-server ở đây.

118
00:09:16,470 --> 00:09:18,970
Khi bạn đi vào thư mục máy chủ lite-server,

119
00:09:18,970 --> 00:09:23,860
lưu ý đặc biệt sự hiện diện của tệp index.js và

120
00:09:23,860 --> 00:09:27,690
sau đó là tệp package.json của bạn và một số thứ khác.

121
00:09:27,690 --> 00:09:33,538
Vì vậy, nội dung này của thư mục bao gồm mô-đun nút lite-server.

122
00:09:33,538 --> 00:09:38,010
Nhưng mô-đun nút lite-server này phụ thuộc vào các mô-đun nút khác

123
00:09:38,010 --> 00:09:41,120
để cung cấp cho nó một số chức năng bổ sung.

124
00:09:41,120 --> 00:09:45,190
Vì vậy, đó là lý do khi bạn cài đặt mô-đun nút máy chủ ánh sáng, nó sẽ lần lượt

125
00:09:45,190 --> 00:09:51,590
cài đặt nhiều mô-đun nút khác, trên đó máy chủ ánh sáng chính nó phụ thuộc vào.

126
00:09:51,590 --> 00:09:56,239
Vì vậy, đó là lý do tại sao bạn thấy rằng sự bùng nổ của các

127
00:09:56,239 --> 00:10:00,800
thư mục này bên trong các mô-đun nút.

128
00:10:00,800 --> 00:10:04,670
Đừng quá lo lắng về nó, tổng số các thư mục sẽ không được

129
00:10:04,670 --> 00:10:08,620
nhiều hơn một vài chục megabyte.

130
00:10:08,620 --> 00:10:12,310
Vì vậy, nó không phải là sẽ điền vào thư mục của bạn với rác.

131
00:10:13,400 --> 00:10:17,680
Đây là tất cả điều cần thiết cho nút để có thể giúp bạn.

132
00:10:19,420 --> 00:10:24,280
Trong trường hợp bạn tò mò về máy chủ lite-server và nó hoạt động như thế nào,

133
00:10:24,280 --> 00:10:29,780
bạn luôn có thể đi xuống trang GitHub này nơi máy chủ lite-server được lưu trữ.

134
00:10:29,780 --> 00:10:35,260
Và sau đó tìm kiếm tài liệu cho máy chủ lite-server.

135
00:10:35,260 --> 00:10:40,040
Tôi sẽ giới thiệu bạn với bất cứ điều gì bạn cần biết về lite-server khi chúng tôi đi qua khóa học

136
00:10:40,040 --> 00:10:42,830
này và các khóa học còn lại.

137
00:10:42,830 --> 00:10:47,223
Vì vậy, bạn không cần phải lo lắng quá nhiều về nó, nhưng chỉ trong trường hợp bạn tò mò,

138
00:10:47,223 --> 00:10:51,306
bạn luôn có thể truy cập trang web để tìm hiểu thêm chi tiết về lite-server.

139
00:10:51,306 --> 00:10:56,651
Liên kết được cung cấp trong hướng dẫn tập thể dục của bạn và

140
00:10:56,651 --> 00:11:01,307
các tài nguyên bổ sung là một phần của bài học này.

141
00:11:03,640 --> 00:11:08,556
Một khi bạn đã hoàn thành điều đó, sau đó đi qua.

142
00:11:10,139 --> 00:11:15,050
Trình soạn thảo nơi bạn có thư mục, thư mục Git-Test, mở ra và

143
00:11:15,050 --> 00:11:18,925
sau đó xem nội dung của tệp package.json.

144
00:11:18,925 --> 00:11:23,876
Vì vậy, bạn sẽ thấy rằng các tập tin package.json chứa chính xác các thông tin mà

145
00:11:23,876 --> 00:11:25,722
bạn cấu hình với NPM của bạn.

146
00:11:25,722 --> 00:11:30,937
Vì vậy, bạn sẽ thấy phiên bản tên và tác giả kho lưu trữ và

147
00:11:30,937 --> 00:11:35,096
đặc biệt, lưu ý thông tin này ở đây.

148
00:11:35,096 --> 00:11:41,211
Nó nói DevDependencies, vì vậy sau đó nó chỉ định lite-sever,

149
00:11:41,211 --> 00:11:44,931
và cũng nhận thấy nó nói hat 2.2.2.

150
00:11:44,931 --> 00:11:50,643
Vì vậy, có nghĩa là dự án đặc biệt này

151
00:11:50,643 --> 00:11:58,056
phụ thuộc vào lite-server đó là một phiên bản ít nhất 2.2.2 hoặc cao hơn.

152
00:11:58,056 --> 00:12:00,472
Vì vậy, điều này rất hữu ích cho chúng tôi.

153
00:12:00,472 --> 00:12:04,110
Bây giờ tại sao chúng ta cần thông tin này ở đây?

154
00:12:04,110 --> 00:12:07,331
Sau đó, khi bạn đi đến các bài tập khác,

155
00:12:07,331 --> 00:12:11,874
bạn sẽ nhận thấy rằng khi bạn lưu trữ này trên một kho lưu trữ trực tuyến,

156
00:12:11,874 --> 00:12:16,765
bạn không muốn được lưu trữ tất cả mọi thứ trong thư mục mô-đun nút của bạn.

157
00:12:16,765 --> 00:12:23,950
Bạn sẽ chỉ được lưu trữ thông tin của tất cả các tập tin mà chúng tôi đã tạo ra.

158
00:12:23,950 --> 00:12:28,849
Thư mục module nút luôn có thể được tạo lại bằng cách

159
00:12:28,849 --> 00:12:33,056
gõ NPM install tại dấu nhắc lệnh của chúng tôi.

160
00:12:33,056 --> 00:12:35,905
Và sau đó dựa trên các phụ thuộc dev và

161
00:12:35,905 --> 00:12:40,602
phụ thuộc được liệt kê trong tập tin packager, tất cả các

162
00:12:40,602 --> 00:12:45,306
mô-đun nút mà dự án của bạn phụ thuộc vào sẽ tự động được cài đặt.

163
00:12:45,306 --> 00:12:50,194
Chúng ta sẽ thấy rằng sau này về cách sử dụng

164
00:12:50,194 --> 00:12:54,389
cài đặt NPM trong khóa học này.

165
00:12:56,473 --> 00:13:02,098
Bây giờ chúng ta đang ở tập tin package.json chúng ta hãy thực hiện một vài chỉnh sửa

166
00:13:02,098 --> 00:13:08,431
để chúng ta có thể sử dụng lite-server để phục vụ nội dung đó.

167
00:13:08,431 --> 00:13:14,520
Vì vậy, ngay tại đây, trong tùy chọn này được gọi là kịch bản,

168
00:13:14,520 --> 00:13:18,181
chúng ta hãy thêm vào một ở đây.

169
00:13:18,181 --> 00:13:20,806
Vì vậy, chúng tôi sẽ nói “bắt đầu”.

170
00:13:20,806 --> 00:13:26,673
Vì vậy, bắt đầu là một lệnh mà NPM hỗ trợ cho

171
00:13:26,673 --> 00:13:32,682
phép bạn xác định một loạt các điều sẽ được bắt đầu.

172
00:13:32,682 --> 00:13:35,264
Vì vậy, sau này chúng ta sẽ thấy làm thế nào chúng ta sử dụng nó.

173
00:13:35,264 --> 00:13:39,512
Vì vậy, ở đây tôi sẽ nói “npm chạy lite”.

174
00:13:43,557 --> 00:13:48,462
Và sau bài kiểm tra đó, tôi sẽ thêm

175
00:13:48,462 --> 00:13:53,059
vào một mục khác gọi là “lite”,

176
00:13:53,059 --> 00:13:59,971
mà tôi sẽ cấu hình là “lite-server”, okay?

177
00:13:59,971 --> 00:14:04,889
Với những thay đổi này, hãy lưu tệp package.json.

178
00:14:04,889 --> 00:14:11,170
Và sau đó, bây giờ dự án của chúng tôi được cấu hình, do đó bây giờ nếu bạn khởi động máy chủ Lite-,

179
00:14:11,170 --> 00:14:16,682
nội dung của thư mục của bạn sẽ được phục vụ trong trình duyệt yêu thích của bạn.

180
00:14:21,306 --> 00:14:24,890
Quay lại dấu nhắc lệnh của chúng tôi, thêm dấu nhắc.

181
00:14:24,890 --> 00:14:29,531
Nếu tôi gõ, npm bắt đầu, bây giờ bạn thấy lý do tại sao tôi đặt rằng

182
00:14:29,531 --> 00:14:34,181
thẻ nhập cảnh bắt đầu vào tập tin package.json của tôi.

183
00:14:34,181 --> 00:14:41,222
Nếu tôi nói npm bắt đầu, bất cứ điều gì bắt đầu được cấu hình như trong tập tin package.json,

184
00:14:41,222 --> 00:14:47,472
chúng tôi chỉ định rằng npm chạy ánh sáng, và lite đã được chỉ định như máy chủ lite.

185
00:14:47,472 --> 00:14:50,420
Vì vậy, về cơ bản, chúng tôi đang nói Bắt đầu lite-server.

186
00:14:50,420 --> 00:14:54,821
Vì vậy, một khi tôi gõ npm start, nó sẽ bắt đầu lite-server, và

187
00:14:54,821 --> 00:14:57,931
nó sẽ phục vụ lên nội dung của thư mục này.

188
00:14:57,931 --> 00:15:00,889
Bây giờ làm thế nào để bạn truy cập vào nội dung của thư mục này?

189
00:15:00,889 --> 00:15:04,812
Nếu bạn muốn truy cập vào địa phương này,

190
00:15:04,812 --> 00:15:12,056
bạn sẽ truy cập nó bằng cách xác định bạn là localhost:3000.

191
00:15:12,056 --> 00:15:15,389
Đây là các cài đặt mặc định cho máy chủ lite-server.

192
00:15:15,389 --> 00:15:19,831
Hơn nữa, điều này sẽ tự động mở

193
00:15:19,831 --> 00:15:24,382
cửa sổ trình duyệt của trình duyệt mặc định của bạn, và

194
00:15:24,382 --> 00:15:29,722
hiển thị nội dung của chỉ mục hoặc HTML trong cửa sổ trình duyệt.

195
00:15:29,722 --> 00:15:34,480
Ở đây bạn có thể thấy rằng tôi đã mở trình soạn thảo của

196
00:15:34,480 --> 00:15:39,849
tôi và cửa sổ trình duyệt của tôi hướng vào localhost:3000

197
00:15:39,849 --> 00:15:44,730
đồng thời cạnh nhau, để chúng ta có thể thấy

198
00:15:44,730 --> 00:15:49,733
cách cửa sổ trình duyệt sẽ ngay lập tức phản ánh

199
00:15:49,733 --> 00:15:54,760
bất kỳ thay đổi nào mà chúng tôi thực hiện đối với thư mục thử nghiệm Git của chúng tôi.

200
00:15:54,760 --> 00:15:57,780
Vì vậy, hãy để tôi đi đến index.html.

201
00:15:57,780 --> 00:16:03,060
Và sau đó vì lợi ích của không gian, tôi sẽ chuyển nó lại.

202
00:16:03,060 --> 00:16:07,680
Và sau đó, ở đây, bạn có thể thấy rằng đây là nội dung của điều này.

203
00:16:07,680 --> 00:16:11,554
Và rồi, bây giờ, hãy để tôi thêm vào một đoạn nữa.

204
00:16:21,328 --> 00:16:27,338
Và lưu các thay đổi, và sau đó bạn sẽ ngay lập tức nhận thấy rằng

205
00:16:27,338 --> 00:16:34,980
sự thay đổi mà tôi đã thực hiện đối với tệp index.html của tôi được phản ánh vào trình duyệt của tôi.

206
00:16:34,980 --> 00:16:40,560
Điều này cung cấp một cách rất tốt đẹp để có thể quan sát trong

207
00:16:40,560 --> 00:16:45,890
thời gian thực các thay đổi mà bạn thực hiện cho mã của bạn được phản ánh vào trình duyệt của bạn.

208
00:16:45,890 --> 00:16:49,920
Vì vậy, khi bạn đang làm việc trên một dự án, nó sẽ rất thích hợp cho

209
00:16:49,920 --> 00:16:52,175
bạn để có thể xem các thay đổi ngay lập tức.

210
00:16:52,175 --> 00:16:54,895
Vì vậy, khi bạn thực hiện một thay đổi và sau đó lưu các tập tin,

211
00:16:54,895 --> 00:16:59,185
mã sửa đổi được ngay lập tức tải vào trình duyệt của bạn.

212
00:16:59,185 --> 00:17:04,420
Vì vậy, bạn có thể ngay lập tức nhìn thấy sự thay đổi được phản ánh trong cửa sổ trình duyệt của bạn.

213
00:17:04,420 --> 00:17:12,400
Đây là một công cụ rất hữu ích trong khi bạn đang phát triển dự án của bạn.

214
00:17:12,400 --> 00:17:18,026
Đó là lý do tại sao tôi giới thiệu bạn với máy chủ lite-server đó, và

215
00:17:18,026 --> 00:17:24,791
thiết lập nó để chúng tôi có thể sử dụng nó, khi chúng tôi phát triển trang web trong khóa học này.

216
00:17:27,033 --> 00:17:32,092
Nếu bạn nhớ lại, chúng tôi đã thiết lập thư mục git-test của chúng tôi để trở thành một kho lưu trữ Git.

217
00:17:32,092 --> 00:17:37,435
Vì vậy, Kiểm tra một lần nữa, Chúng ta

218
00:17:37,435 --> 00:17:40,805
sẽ thấy rằng chúng ta đã có ba cam kết trong kho lưu trữ Git của chúng tôi.

219
00:17:40,805 --> 00:17:45,885
Và kho lưu trữ Git này đã được nhân đôi vào kho lưu trữ Git trực tuyến của

220
00:17:45,885 --> 00:17:51,015
chúng tôi mà chúng tôi đã thiết lập trong bài tập trước đó tại Bitbucket hoặc GitHub.

221
00:17:51,015 --> 00:17:55,665
Thư mục git-test của tôi được đồng bộ hóa với

222
00:17:55,665 --> 00:18:02,380
kho lưu trữ Bitbucket của tôi trong bài tập cụ thể này.

223
00:18:02,380 --> 00:18:08,220
Vì vậy, những gì tôi sẽ làm bây giờ là để cho bạn thấy làm thế nào bạn có thể loại trừ một số

224
00:18:08,220 --> 00:18:13,830
thư mục từ thư mục dự án của bạn,

225
00:18:13,830 --> 00:18:19,760
và sau đó đảm bảo rằng chúng không được đồng bộ hóa với kho lưu trữ trực tuyến của bạn.

226
00:18:19,760 --> 00:18:24,480
Bây giờ như tôi đã nói, thư mục node_modules luôn có thể được tạo lại

227
00:18:24,480 --> 00:18:27,840
bằng cách gõ npm install tại dấu nhắc.

228
00:18:27,840 --> 00:18:31,490
Vì vậy, đó là lý do tại sao khi bạn tải

229
00:18:31,490 --> 00:18:36,690
nội dung của thư mục của bạn lên một kho Git trực tuyến,

230
00:18:36,690 --> 00:18:42,320
hoặc khi bạn thực hiện một cam kết của thư mục vào kho Git của

231
00:18:42,320 --> 00:18:47,230
bạn, bạn không muốn thư mục node_modules hoặc tất cả các thư mục con dưới nó được

232
00:18:47,230 --> 00:18:52,280
bao gồm trong cam kết.

233
00:18:52,280 --> 00:18:55,950
Vậy làm thế nào để chúng tôi loại trừ một số thư mục hoặc

234
00:18:55,950 --> 00:19:02,380
một số tệp từ thư mục của chúng tôi khỏi được kiểm tra vào kho lưu trữ Git của chúng tôi?

235
00:19:02,380 --> 00:19:08,680
Vì vậy, để làm điều đó, chúng ta sẽ thiết lập một tập tin có tên là .gitignore.

236
00:19:08,680 --> 00:19:11,860
Vì vậy, đó là tên của tập tin, .gitignore.

237
00:19:11,860 --> 00:19:17,220
Vì vậy, để tạo tập tin .gitignore này, chúng tôi sẽ đi đến trình soạn thảo của chúng tôi.

238
00:19:18,550 --> 00:19:23,956
Vì vậy, trong trình soạn thảo, trong thư mục git-test,

239
00:19:23,956 --> 00:19:31,300
tôi sẽ tạo một tệp mới và tôi sẽ đặt tên nó là .gitignore.

240
00:19:31,300 --> 00:19:34,650
Lưu ý rằng tên bắt đầu bằng dấu chấm và

241
00:19:34,650 --> 00:19:39,840
sau đó, phần còn lại của tên là g-i-t-i-g-n-o-r-e.

242
00:19:39,840 --> 00:19:44,492
Vì vậy, điều này là rất quan trọng mà bạn thiết lập các tập tin với chính xác tên đó,

243
00:19:44,492 --> 00:19:45,329
.gitignore.

244
00:19:46,500 --> 00:19:51,070
Vì vậy, chúng ta hãy tạo tập tin này được gọi là .gitignore, và

245
00:19:51,070 --> 00:19:57,360
dòng đầu tiên của tập tin đó, chúng ta sẽ gõ như node_modules.

246
00:19:57,360 --> 00:20:01,450
Vì vậy, những gì điều này có nghĩa là thư mục node_modules sẽ được

247
00:20:01,450 --> 00:20:04,410
loại trừ khỏi cam kết git của chúng tôi.

248
00:20:05,850 --> 00:20:08,896
Vì vậy, một khi tôi tạo ra tệp.gitignore

249
00:20:08,896 --> 00:20:14,900
đó và sau đó thêm node_modules vào tệp.gitignore, chúng ta hãy lưu các thay đổi.

250
00:20:14,900 --> 00:20:19,735
Và sau đó bây giờ chúng ta sẽ thực hiện một cam kết của trạng thái hiện tại của dự án của chúng tôi

251
00:20:19,735 --> 00:20:24,700
vào kho lưu trữ Git của chúng tôi.

252
00:20:24,700 --> 00:20:27,220
Tôi hy vọng bạn nhớ lệnh git của bạn.

253
00:20:27,220 --> 00:20:31,310
Hãy làm một trạng thái git, và sau đó khi bạn làm điều đó,

254
00:20:31,310 --> 00:20:36,194
bạn sẽ ngay lập tức nhận thấy rằng bạn có các

255
00:20:36,194 --> 00:20:42,070
tập tin index.html được đánh dấu là sửa đổi, và sau đó là hai tập tin mới, .gitignore và package.json.

256
00:20:42,070 --> 00:20:49,500
Vì vậy, chúng tôi làm một git add., và sau đó làm một trạng thái git.

257
00:20:49,500 --> 00:20:54,120
Và sau đó bạn thấy rằng tất cả các tập tin mới này đã được kiểm tra vào cam kết của bạn.

258
00:20:54,120 --> 00:21:01,090
Hãy làm một git. git commit -m “fourth commit”.

259
00:21:01,090 --> 00:21:05,440
Và các tập tin được cam kết.

260
00:21:05,440 --> 00:21:09,303
Hãy đẩy cam kết mới vào kho lưu trữ trực tuyến của chúng tôi.

261
00:21:09,303 --> 00:21:13,905
Vì vậy, để làm điều đó git push -u

262
00:21:13,905 --> 00:21:18,510
gốc chủ và chờ cho

263
00:21:18,510 --> 00:21:23,750
nó được đẩy đến máy chủ của chúng tôi.

264
00:21:23,750 --> 00:21:27,403
Bây giờ, nếu bạn đi đến kho lưu trữ Git trực tuyến của

265
00:21:27,403 --> 00:21:30,871
bạn, bạn sẽ thấy rằng tệp package.json và

266
00:21:30,871 --> 00:21:36,132
.gitignore sẽ được kiểm nhập vào kho lưu trữ Git của bạn.

267
00:21:36,132 --> 00:21:41,195
Đi đến kho lưu trữ Bitbucket của tôi từ bài kiểm tra Git, bạn sẽ thấy rằng

268
00:21:41,195 --> 00:21:47,320
khi tôi nhìn vào nguồn, bạn sẽ thấy rằng tập tin package.json đã được thêm vào.

269
00:21:47,320 --> 00:21:54,600
.gitignore đã được thêm vào và tệp index.html mới đã được kiểm nhập.

270
00:21:54,600 --> 00:21:57,570
Vì vậy, điều đó hoàn thành bài tập này.

271
00:21:57,570 --> 00:21:58,770
Vì vậy, trong bài tập này,

272
00:21:58,770 --> 00:22:03,586
chúng tôi đã học được cách thiết lập một tập tin package.json bằng cách sử dụng npm init.

273
00:22:03,586 --> 00:22:07,310
Chúng tôi đã học được cách cài đặt một mô-đun npm.

274
00:22:07,310 --> 00:22:11,900
Và chúng tôi đã học được cách sử dụng mô-đun npm lite-server để phục vụ

275
00:22:11,900 --> 00:22:18,100
nội dung của thư mục dự án của chúng tôi để nó có thể được xem trong một trình duyệt.

276
00:22:18,100 --> 00:22:21,920
Vì vậy, đây là một cách tốt đẹp để phục vụ nội dung web của bạn,

277
00:22:21,920 --> 00:22:25,360
ứng dụng web của bạn hoặc trang web của bạn, để

278
00:22:25,360 --> 00:22:31,680
bạn có thể thấy những thay đổi trong thời gian thực được phản ánh vào cửa sổ trình duyệt của bạn.

279
00:22:31,680 --> 00:22:37,280
Và sau đó chúng ta cũng thấy làm thế nào chúng ta có thể thiết lập .gitignore để một số

280
00:22:37,280 --> 00:22:42,790
thư mục có thể bị loại trừ khỏi việc được kiểm tra vào kho lưu trữ Git của chúng tôi.

281
00:22:42,790 --> 00:22:45,450
Điều này hoàn thành bài tập này.

282
00:22:45,450 --> 00:22:50,450
Vì vậy, với điều này, tôi chắc chắn bạn đã nhận được một xử lý tốt về

283
00:22:50,450 --> 00:22:56,280
việc sử dụng cả hai Git, và sau đó cũng nút và nút module.

284
00:22:56,280 --> 00:23:02,020
Đừng lo lắng, chúng tôi sẽ sử dụng nút một cách rộng rãi, theo nhiều cách khác nhau,

285
00:23:02,020 --> 00:23:05,610
khi bạn đi qua các khóa học chuyên môn này.

286
00:23:05,610 --> 00:23:06,497
Đây chỉ là một khởi đầu.

287
00:23:06,497 --> 00:23:13,270
[ NHẠC]