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

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

3
00:00:08,927 --> 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:16,844
Vì vậy, trong bài tập này chúng ta sẽ bắt đầu sử dụng Node.

5
00:00:16,844 --> 00:00:19,980
Chúng tôi sẽ thiết lập một tập tin package.json cho

6
00:00:19,980 --> 00:00:24,880
thư mục git-test của chúng tôi mà chúng tôi đã làm việc với cho đến nay,

7
00:00:24,880 --> 00:00:29,780
sau đó chúng tôi sẽ thiết lập một mô-đun Node gọi là lite-server

8
00:00:29,780 --> 00:00:34,610
sẽ phục vụ nội dung của thư mục git-test của chúng tôi.

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

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

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

12
00:00:48,499 --> 00:00:53,089
chúng tôi tự động xem các bản cập nhật cho

13
00:00:53,089 --> 00:00:58,149
cửa sổ trình duyệt của chúng tôi khi chúng tôi thực hiện thay đổi tệp index.html của chúng tôi hoặc

14
00:00:58,149 --> 00:01:02,283
bất kỳ tệp nào khác trong thư mục git-test của chúng tôi.

15
00:01:02,283 --> 00:01:08,685
Lite-server là một cái gì đó chúng tôi sẽ sử dụng rộng rãi trong các

16
00:01:08,685 --> 00:01:13,805
khóa học này và trong tương lai để có thể xem những thay đổi trong thời gian thực trong

17
00:01:13,805 --> 00:01:18,730
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.

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

19
00:01:25,650 --> 00:01:29,030
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?

20
00:01:29,030 --> 00:01:33,254
Vì vậy, ở đây, tôi có một số thông tin từ

21
00:01:33,254 --> 00:01:37,874
trang web npmjs.org trong đó xác định

22
00:01:37,874 --> 00:01:43,184
chính xác những gì là vai trò của tập tin package.json.

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

24
00:01:47,210 --> 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.

25
00:01:51,670 --> 00:01:55,130
Vì vậy, ví dụ, khi bạn thiết lập lite-server cho

26
00:01:55,130 --> 00:01:59,210
dự án của bạn, nó sẽ được ghi lại trong tập tin package.json.

27
00:01:59,210 --> 00:02:07,200
Vì vậy, sau đó, bạn cũng có thể sử dụng gói đó trong tương lai.

28
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

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

30
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,

31
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

32
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 Node của bạn.

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

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

35
00:02:37,918 --> 00:02:42,243
sau đó họ cũng có thể cài đặt tất cả các mô-đun Node,

36
00:02:42,243 --> 00:02:46,767
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ọ.

37
00:02:50,728 --> 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?

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

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

40
00:03:10,420 --> 00:03:13,300
Và sau đó sẽ đưa bạn qua một tập hợp các bước

41
00:03:13,300 --> 00:03:17,150
mà sẽ cho phép bạn cấu hình tập tin package.json của bạn.

42
00:03:17,150 --> 00:03:20,910
Vì vậy, chúng ta hãy tiến hành điều đó cho dự án git-test của chúng tôi.

43
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.

44
00:03:28,200 --> 00:03:31,900
Đảm bảo rằng bạn cũng mở một cửa sổ thiết bị đầu cuối hoặc

45
00:03:31,900 --> 00:03:34,728
một cửa sổ lệnh và sau đó đi đến thư mục git-test.

46
00:03:34,728 --> 00:03:43,235
Và tại dấu nhắc, gõ npm init 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,453
Đối với phiên bản, chúng tôi sẽ chỉ để nó như 1.0.0.

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

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

51
00:03:58,175 --> 00:04:04,475
Đây là một thư mục thử nghiệm

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

53
00:04:10,462 --> 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 Node, điểm nhập sẽ là index.js.

56
00:04:24,508 --> 00:04:30,369
Bây giờ, thư mục này mà chúng tôi đã thiết lập là một thư mục dựa trên index.html,

57
00:04:30,369 --> 00:04:34,018
vì vậy đó là lý do tại sao tôi chỉ cần gõ vào index.html.

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

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

60
00:04:40,365 --> 00:04:43,783
bài tập trước đó, nó sẽ tự động nhắc điều đó cho bạn.

61
00:04:43,783 --> 00:04:48,733
Nếu không, điều này sẽ trống và cung cấp cho bạn một tùy chọn để nhập

62
00:04:48,733 --> 00:04:53,920
URL kho Git 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,501
Tác giả, hãy nhập tên của bạn.

65
00:04:58,501 --> 00:04:59,933
Hãy tự ái.

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

67
00:05:06,267 --> 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,566
Vì vậy, nếu bạn đã quen thuộc với JSON, điều này sẽ trông rất, rất quen thuộc với bạn.

69
00:05:18,566 --> 00:05:21,756
Vì vậy, nếu điều này có vẻ tốt, chúng ta hãy nói là ổn.

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

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

72
00:05:31,014 --> 00:05:36,109
bạn sẽ thấy các tập tin package.json trong nội dung thư mục.

73
00:05:36,109 --> 00:05:40,932
Mở thư mục git-test trong trình soạn thảo yêu thích của bạn và

74
00:05:40,932 --> 00:05:47,270
sau đó xem nội dung của tệp package.json trong trình soạn thảo của bạn.

75
00:05:48,950 --> 00:05:53,161
Bước tiếp theo, chúng ta sẽ tìm hiểu cách chúng ta có thể cài đặt

76
00:05:53,161 --> 00:05:57,702
một mô-đun Node bằng NPM, Node Package Manager.

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

78
00:06:02,434 --> 00:06:07,432
Lite-server sẽ phục vụ nội dung của thư mục git-test này trong

79
00:06:07,432 --> 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:18,404
Cho rằng chúng tôi có một tập tin index.html, nếu chúng tôi phục vụ lên thư mục này

81
00:06:18,404 --> 00:06:24,130
sau đó nó sẽ là một trang web và bạn có thể xem index.html trong một trình duyệt.

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

83
00:06:28,460 --> 00:06:31,820
sử dụng lite-server để phục vụ lên nội dung của thư mục này.

84
00:06:31,820 --> 00:06:37,310
Điều này rất, rất hữu ích vì nếu bạn đang làm việc trên một dự án phát triển web,

85
00:06:37,310 --> 00:06:42,380
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

86
00:06:42,380 --> 00:06:45,060
để khi bạn thực hiện thay đổi dự án của mình,

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

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

89
00:06:53,840 --> 00:06:55,980
Vì vậy, hãy thiết lập lite-server.

90
00:06:55,980 --> 00:07:01,120
Để làm điều đó tại dấu nhắc, hãy nhập cài đặt npm.

91
00:07:01,120 --> 00:07:04,273
Vì vậy, thông báo, nếu bạn muốn npm cài đặt một gói Node,

92
00:07:04,273 --> 00:07:06,594
đây là cách bạn sẽ gọi nó.

93
00:07:06,594 --> 00:07:10,674
Và sau đó bạn sẽ nói lite-server.

94
00:07:10,674 --> 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 lite-server.

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

96
00:07:20,670 --> 00:07:27,918
Vì vậy, để làm điều đó, chúng ta sẽ gõ vào —save-dev.

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

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

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

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

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

102
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.

103
00:08:00,197 --> 00:08:07,029
Nó sẽ mất tất cả một vài phút để hoàn tất cài đặt của nó.

104
00:08:07,029 --> 00:08:11,991
Một khi đã được cài đặt, sau đó bạn sẽ ngay lập tức

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

106
00:08:16,953 --> 00:08:25,333
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.

107
00:08:25,333 --> 00:08:30,459
Bây giờ, nếu bạn đi vào node_modules bạn sẽ thấy một bó toàn bộ

108
00:08:30,459 --> 00:08:35,492
các thư mục con khác trong đó có chứa

109
00:08:35,492 --> 00:08:40,170
các module nút cần thiết cho mô-đun nút lite-sever và vân vân.

110
00:08:40,170 --> 00:08:44,925
Vì vậy, chúng ta hãy tham quan nhanh chóng của thư mục node_modules để xem

111
00:08:44,925 --> 00:08:47,363
nội dung của những gì là.

112
00:08:50,810 --> 00:08:55,893
Đi đến thư mục git-test của tôi, nếu bạn đang đi đến thư mục node_modules,

113
00:08:55,893 --> 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 ở đó.

114
00:09:00,130 --> 00:09:04,904
Thông thường bạn không cần phải kết xuất vào thư mục node_modules,

115
00:09:04,904 --> 00:09:09,384
chúng chỉ tồn tại ở đó bởi vì chúng là cần thiết cho lite-server.

116
00:09:09,384 --> 00:09:16,470
Vì vậy, khi bạn duyệt qua bạn, nên một thư mục thông báo tên lite-server đây.

117
00:09:16,470 --> 00:09:21,400
Khi bạn đi vào thư mục máy chủ lite-server, lưu ý đặc biệt sự hiện diện

118
00:09:21,400 --> 00:09:27,690
của tệp index.js và sau đó là một tệp package.json và một số thứ khác.

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

120
00:09:33,928 --> 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

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

122
00:09:41,120 --> 00:09:46,456
Vì vậy, đó là lý do, khi bạn cài đặt mô-đun nút máy chủ lite-server, nó sẽ lần lượt

123
00:09:46,456 --> 00:09:51,590
cài đặt nhiều mô-đun nút khác mà trên đó chính máy chủ lite-server là phụ thuộc vào.

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

125
00:09:56,810 --> 00:10:00,800
những thư mục bên trong thư mục node_modules.

126
00:10:00,800 --> 00:10:06,090
Đừng quá lo lắng về nó, tổng số tiền của tất cả điều này sẽ không được nhiều hơn

127
00:10:06,090 --> 00:10:08,620
một vài chục megabyte.

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

129
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.

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

131
00:10:24,280 --> 00:10:30,010
Bạn luôn có thể đi xuống trang web GitHub này nơi máy chủ lite-được đăng và

132
00:10:30,010 --> 00:10:33,855
sau đó tìm kiếm tài liệu cho lite-server.

133
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

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

135
00:10:42,830 --> 00:10:44,560
Vì vậy, bạn không cần phải lo lắng quá nhiều về nó.

136
00:10:44,560 --> 00:10:46,890
Nhưng chỉ trong trường hợp bạn tò mò,

137
00:10:46,890 --> 00:10:51,590
bạn luôn có thể truy cập trang web này để tìm hiểu thêm chi tiết về lite-server.

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

139
00:10:55,710 --> 00:11:01,220
một phần tài nguyên bổ sung của bài học này.

140
00:11:04,040 --> 00:11:09,357
Một khi bạn đã hoàn thành điều đó, sau đó đi đến trình soạn thảo,

141
00:11:09,357 --> 00:11:14,258
nơi bạn có thư mục, thư mục git-test, mở và

142
00:11:14,258 --> 00:11:18,753
sau đó xem nội dung của tập tin package.json.

143
00:11:18,753 --> 00:11:23,604
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à

144
00:11:23,604 --> 00:11:25,691
bạn cấu hình với npm của bạn trong đó.

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

146
00:11:31,414 --> 00:11:38,142
và đặc biệt, lưu ý thông tin này ở đây nói DevDependencies.

147
00:11:38,142 --> 00:11:45,034
Và sau đó nó chỉ định lite-server, và cũng nhận thấy nó nói, ^2.2.2.

148
00:11:45,034 --> 00:11:50,086
Vì vậy, có nghĩa là dự án đặc biệt này phụ thuộc vào

149
00:11:50,086 --> 00:11:54,858
lite-server đó là một phiên bản ít nhất 2.2.2.

150
00:11:54,858 --> 00:11:56,078
Tất cả các cấp độ cao.

151
00:11:57,308 --> 00:12:00,488
Vì vậy, điều này rất hữu ích cho chúng tôi.

152
00:12:00,488 --> 00:12:05,942
Bây giờ, tại sao chúng ta cần thông tin này ở đây, sau đó khi bạn đi đến các

153
00:12:05,942 --> 00:12:11,669
bài tập khác, 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.

154
00:12:11,669 --> 00:12:16,738
Bạn không muốn lưu trữ tất cả mọi thứ trong thư mục node_modules của bạn.

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

156
00:12:23,902 --> 00:12:28,896
Thư mục node_modules luôn có thể được tạo lại bằng cách

157
00:12:28,896 --> 00:12:33,270
gõ nmp install tại dấu nhắc lệnh của chúng tôi.

158
00:12:33,270 --> 00:12:36,260
Và sau đó dựa trên DevDependen

159
00:12:36,260 --> 00:12:40,235
cies và phụ thuộc được liệt kê trong tập tin package.json.

160
00:12:40,235 --> 00:12:44,542
Tất cả các mô-đun nút mà dự án của bạn phụ thuộc vào sẽ tự động được

161
00:12:44,542 --> 00:12:45,338
cài đặt.

162
00:12:45,338 --> 00:12:48,868
Chúng ta sẽ thấy rằng sau này,

163
00:12:48,868 --> 00:12:54,330
về cách sử dụng cài đặt npm trong khóa học này.

164
00:12:56,150 --> 00:13:02,020
Bây giờ, 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

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

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

167
00:13:14,694 --> 00:13:18,430
chúng ta hãy thêm vào một cái nữa ở đây.

168
00:13:18,430 --> 00:13:20,618
Vì vậy, chúng tôi sẽ nói, bắt đầu.

169
00:13:20,618 --> 00:13:26,540
Vì vậy, bắt đầu là một lệnh hỗ trợ npm

170
00:13:26,540 --> 00:13:32,890
cho phép bạn chỉ định một loạt những điều sẽ được bắt đầu.

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

172
00:13:35,312 --> 00:13:39,668
Vì vậy, ở đây, tôi sẽ nói, npm chạy lite.

173
00:13:43,407 --> 00:13:48,009
Và sau khi thử nghiệm, tôi sẽ

174
00:13:48,009 --> 00:13:52,788
thêm vào một mục khác được gọi là,

175
00:13:52,788 --> 00:13:59,725
lite mà tôi sẽ cấu hình như lite-server.

176
00:13:59,725 --> 00:14:04,798
Được rồi, với những thay đổi này, chúng ta hãy lưu tệp package.json và

177
00:14:04,798 --> 00:14:07,740
sau đó bây giờ, dự án của chúng tôi được cấu hình.

178
00:14:07,740 --> 00:14:11,046
Vì vậy, bây giờ, nếu bạn khởi động máy chủ lite-server,

179
00:14:11,046 --> 00:14:16,530
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,690 --> 00:14:25,050
Quay lại dấu nhắc lệnh của chúng tôi và dấu nhắc.

181
00:14:25,050 --> 00:14:29,470
Nếu tôi gõ npm bắt đầu, bây giờ bạn thấy lý do tại sao

182
00:14:29,470 --> 00:14:34,320
tôi đặt mục nhập đó gọi là bắt đầu vào tập tin package.json của tôi.

183
00:14:34,320 --> 00:14:39,480
Vì vậy, 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ư,

184
00:14:39,480 --> 00:14:42,310
trong tập tin package.json.

185
00:14:42,310 --> 00:14:47,640
Chúng tôi chỉ định rằng như npm chạy lite, và sau đó lite đã được chỉ định như lite-server.

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

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

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

189
00:14:57,928 --> 00:15:00,921
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?

190
00:15:00,921 --> 00:15:06,912
Nếu bạn muốn truy cập nó cục bộ, bạn sẽ truy cập nó bằng cách

191
00:15:06,912 --> 00:15:12,120
chỉ định URL như localhost:3000.

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

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

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

195
00:15:24,016 --> 00:15:29,707
sau đó hiển thị nội dung của index.html trong cửa sổ trình duyệt đó.

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

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

198
00:15:39,115 --> 00:15:42,446
đồng thời song song.

199
00:15:42,446 --> 00:15:47,906
Vì vậy, chúng ta có thể thấy cách cửa sổ trình duyệt sẽ ngay lập tức

200
00:15:47,906 --> 00:15:54,760
phản ánh bất kỳ thay đổi nào mà chúng tôi thực hiện đối với các tệp của chúng tôi trong thư mục git-test.

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

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

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

204
00:16:07,372 --> 00:16:12,392
Và bây giờ hãy để tôi thêm vào

205
00:16:12,392 --> 00:16:16,918
một đoạn nữa,

206
00:16:21,492 --> 00:16:24,150
Và lưu lại những thay đổi.

207
00:16:24,150 --> 00:16:29,220
Và sau đó bạn sẽ ngay lập tức nhận thấy rằng sự thay đổi mà

208
00:16:29,220 --> 00:16:34,980
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.

209
00:16:34,980 --> 00:16:41,380
Điều này cung cấp một cách rất tốt đẹp để có thể quan sát, trong thời gian thực,

210
00:16:41,380 --> 00:16:45,890
những 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.

211
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

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

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

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

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

216
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.

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

218
00:17:17,400 --> 00:17:25,250
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.

219
00:17:27,280 --> 00:17:32,830
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 là một kho lưu trữ git,

220
00:17:32,830 --> 00:17:37,515
để kiểm tra lại, chúng tôi

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

222
00:17:40,805 --> 00:17:45,885
Và kho lưu trữ git này đã được vào kho lưu trữ git trực tuyến của

223
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 đó, hoặc tại bitbucket hoặc GitHub.

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

225
00:17:56,849 --> 00:18:02,386
kho lưu trữ bitbucket của tôi trong bài tập cụ thể này.

226
00:18:02,386 --> 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ố

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

228
00:18:13,980 --> 00:18:19,760
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.

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

230
00:18:24,714 --> 00:18:27,679
bằng cách gõ npminstall tại dấu nhắc.

231
00:18:27,679 --> 00:18:32,089
Vì vậy, đó là lý do tại sao, khi bạn tải nội dung của

232
00:18:32,089 --> 00:18:35,948
thư mục của bạn lên một kho git trực tuyến hoặc

233
00:18:35,948 --> 00:18:41,240
khi bạn thực hiện một cam kết của thư mục vào kho git của

234
00:18:41,240 --> 00:18:46,865
bạn, bạn không muốn thư mục module ghi chú hoặc tất cả các thư mục con

235
00:18:46,865 --> 00:18:52,280
dưới nó được bao gồm trong, Commit.

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

237
00:18:55,950 --> 00:19:02,380
một số tập tin từ thư mục của chúng tôi từ được kiểm tra vào kho lưu trữ git của chúng tôi.

238
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.

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

240
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.

241
00:19:18,550 --> 00:19:24,929
Vì vậy, trong trình soạn thảo trong thư mục git test, tôi sẽ tạo ra một tệp mới.

242
00:19:24,929 --> 00:19:31,300
Và tôi sẽ đặt tên nó là .gitignore.

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

244
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.

245
00:19:39,840 --> 00:19:40,580
Vì vậy, điều này

246
00:19:40,580 --> 00:19:45,320
rất, rất quan trọng là bạn thiết lập fille với chính xác tên, .gitignore.

247
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à

248
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.

249
00:19:57,360 --> 00:19:59,550
Vì vậy, những gì điều này có nghĩa là,

250
00:19:59,550 --> 00:20:04,410
thư mục module node sẽ được loại trừ khỏi cam kết git của chúng tôi.

251
00:20:05,850 --> 00:20:09,440
Vì vậy, một khi tôi tạo ra rằng tập tin .gitignore và

252
00:20:09,440 --> 00:20:14,900
sau đó thêm mô-đun nút vào tập tin .gitignore, chúng ta hãy lưu các thay đổi.

253
00:20:14,900 --> 00:20:20,260
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

254
00:20:20,260 --> 00:20:22,860
vào kho lưu trữ git của chúng tôi.

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

256
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 đó,

257
00:20:31,310 --> 00:20:36,900
bạn sẽ ngay lập tức nhận thấy rằng bạn có các tập tin index.html

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

259
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.

260
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 đã được kiểm tra vào cam kết của bạn.

261
00:20:54,120 --> 00:20:59,665
Hãy làm một git commit, git commit -m “fourth

262
00:20:59,665 --> 00:21:05,440
commit”. Và các tập tin được cam kết.

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

264
00:21:10,300 --> 00:21:15,632
Vì vậy, để làm điều đó, git push

265
00:21:15,632 --> 00:21:20,442
-u gốc master.

266
00:21:20,442 --> 00:21:24,370
Và chờ cho nó được đẩy vào máy chủ của chúng tôi.

267
00:21:24,370 --> 00:21:29,320
Bây giờ nếu bạn đi đến kho lưu trữ git trực tuyến của

268
00:21:29,320 --> 00:21:31,909
bạn, bạn sẽ thấy rằng tập tin package.json và

269
00:21:31,909 --> 00:21:35,660
.gitignore sẽ được kiểm nhập vào kho lưu trữ git của bạn.

270
00:21:37,250 --> 00:21:42,130
Đi đến kho lưu trữ bitbucket của tôi cho git-test.

271
00:21:42,130 --> 00:21:45,050
Bạn sẽ thấy rằng khi tôi nhìn vào nguồn,

272
00:21:45,050 --> 00:21:47,440
bạn sẽ thấy rằng tệp package.json đã được thêm

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

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

275
00:21:57,630 --> 00:21:58,962
Vì vậy, trong bài tập này,

276
00:21:58,962 --> 00:22:03,760
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 phút.

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

278
00:22:07,034 --> 00:22:12,220
Và chúng tôi đã học được cách sử dụng mô-đun npm máy chủ lite để phục vụ

279
00:22:12,220 --> 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.

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

281
00:22:21,874 --> 00:22:24,912
ứng dụng web của bạn hoặc trang web của bạn để

282
00:22:24,912 --> 00:22:31,680
bạn có thể nhìn 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.

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

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

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

286
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 sẽ có được một xử lý tốt về

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

288
00:22:56,280 --> 00:22:57,060
Đừng lo.

289
00:22:57,060 --> 00:23:02,020
Chúng tôi sẽ sử dụng nút rộng rãi theo nhiều cách khác nhau

290
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.

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

292
00:23:10,238 --> 00:23:13,270
[ NHẠC]