1
00:00:01,120 --> 00:00:02,420
‫Instruktur: Dalam video ini,

2
00:00:02,420 --> 00:00:06,120
‫kita akan belajar tentang debugging Node.js. JS karena, mari kita hadapi itu,

3
00:00:06,120 --> 00:00:09,240
‫akan selalu ada beberapa bug dalam kode kita tidak

4
00:00:09,240 --> 00:00:11,040
‫peduli seberapa hati-hati kita.

5
00:00:11,040 --> 00:00:13,910
‫Jadi ada baiknya memiliki alat untuk membantu

6
00:00:13,910 --> 00:00:15,740
‫kami men-debug kode kami.

7
00:00:15,740 --> 00:00:18,870
‫Sekarang ini bukan benar-benar tentang penanganan kesalahan dengan Express, tetapi

8
00:00:18,870 --> 00:00:21,200
‫saya pikir ini adalah poin yang baik dalam

9
00:00:21,200 --> 00:00:23,510
‫kursus untuk memperkenalkan Anda ke alat

10
00:00:23,510 --> 00:00:26,423
‫debugging yang kemudian mungkin kita gunakan sepanjang sisa kursus.

11
00:00:27,920 --> 00:00:31,270
‫Dan ada berbagai cara untuk men-debug Node.js. kode JS.

12
00:00:31,270 --> 00:00:33,740
‫Misalnya, kita bisa menggunakan kode VS untuk itu.

13
00:00:33,740 --> 00:00:38,190
‫Tapi, sebenarnya, Google baru-baru ini merilis alat luar biasa

14
00:00:38,190 --> 00:00:42,840
‫yang dapat kita gunakan untuk men-debug yang disebut NDB, oke?

15
00:00:42,840 --> 00:00:46,610
‫Jadi mari kita pindah ke terminal kita yang lain di

16
00:00:46,610 --> 00:00:48,850
‫sini dan kemudian menginstal NDB.

17
00:00:48,850 --> 00:00:51,720
‫Dan NDB, yang merupakan singkatan dari Node debugger,

18
00:00:51,720 --> 00:00:53,823
‫sebenarnya hanyalah sebuah paket NPM.

19
00:00:54,780 --> 00:00:56,927
‫Jadi NPM menginstal NDB.

20
00:00:58,440 --> 00:01:00,250
‫Baiklah, dan

21
00:01:00,250 --> 00:01:04,120
‫Anda harus menginstalnya sebagai paket global, oke?

22
00:01:04,120 --> 00:01:07,563
‫Dan jika Anda menggunakan Mac, Anda mungkin memerlukan izin global.

23
00:01:08,440 --> 00:01:10,890
‫Jadi tulis saja Sudo di sini di depan.

24
00:01:10,890 --> 00:01:14,720
‫Atau jika Anda sama sekali tidak dapat menginstalnya secara

25
00:01:14,720 --> 00:01:17,610
‫global, Anda selalu dapat menginstalnya secara lokal

26
00:01:17,610 --> 00:01:19,003
‫sebagai dependensi kematian.

27
00:01:20,040 --> 00:01:22,420
‫Jadi seperti ini, oke?

28
00:01:22,420 --> 00:01:25,000
‫Bagaimanapun, silakan lanjutkan dan instal alat ini sekarang.

29
00:01:25,000 --> 00:01:25,870
‫Saya tidak

30
00:01:25,870 --> 00:01:28,590
‫akan melakukannya karena ini bisa menjadi unduhan yang cukup berat,

31
00:01:28,590 --> 00:01:30,630
‫dan itu memakan waktu terlalu lama sekarang.

32
00:01:30,630 --> 00:01:33,720
‫Bagaimanapun, segera setelah Anda menginstal alat, mari kita

33
00:01:33,720 --> 00:01:36,130
‫menuju ke paket. jason dan

34
00:01:36,130 --> 00:01:39,710
‫tambahkan skrip baru di sini, oke?

35
00:01:39,710 --> 00:01:42,173
‫Dan saya akan menyebutnya sebagai debug.

36
00:01:43,770 --> 00:01:44,900
‫Oke?

37
00:01:44,900 --> 00:01:47,270
‫Jadi perintah yang ingin kita

38
00:01:47,270 --> 00:01:50,890
‫jalankan di sini hanyalah NDB, jadi catatan debugger

39
00:01:50,890 --> 00:01:53,250
‫dan sekali lagi titik masuk

40
00:01:53,250 --> 00:01:57,103
‫kita, Jadi, server. js Oke?

41
00:01:57,103 --> 00:01:59,200
‫Dan sekarang ini akan berfungsi tidak peduli

42
00:01:59,200 --> 00:02:01,320
‫apakah Anda menginstal NDB secara lokal atau global.

43
00:02:01,320 --> 00:02:03,537
‫Baiklah, jadi sekarang mari kita jalankan skripnya.

44
00:02:03,537 --> 00:02:05,260
‫Dan agar ini berfungsi,

45
00:02:05,260 --> 00:02:07,690
‫kita sebenarnya perlu menyelesaikan proses ini karena

46
00:02:07,690 --> 00:02:09,460
‫pada dasarnya ini akan memulai

47
00:02:09,460 --> 00:02:12,210
‫server juga dan kemudian akan mencoba melakukannya di

48
00:02:12,210 --> 00:02:14,120
‫port yang sama dan itu

49
00:02:14,120 --> 00:02:15,980
‫tentu saja tidak akan berhasil.

50
00:02:15,980 --> 00:02:18,450
‫Jadi kita perlu menyelesaikan yang sedang berjalan

51
00:02:18,450 --> 00:02:21,670
‫dan kemudian dari sini kita dapat menjalankan NPM run

52
00:02:21,670 --> 00:02:22,503
‫debug Baiklah,

53
00:02:23,690 --> 00:02:24,523
‫dan

54
00:02:24,523 --> 00:02:26,370
‫sekarang jendela Chrome baru

55
00:02:26,370 --> 00:02:28,230
‫akan terbuka jadi apa yang

56
00:02:29,070 --> 00:02:31,220
‫disebut Chrome tanpa kepala, tapi itu

57
00:02:31,220 --> 00:02:32,690
‫bukan Chrome asli.

58
00:02:32,690 --> 00:02:34,890
‫Jadi Anda akan melihat ikon Chrome di

59
00:02:34,890 --> 00:02:36,550
‫sini dan juga di sini

60
00:02:36,550 --> 00:02:39,410
‫di bilah menu tetapi sebenarnya ini hanya debugger catatan.

61
00:02:39,410 --> 00:02:41,260
‫Jadi apa yang kita miliki di sini?

62
00:02:41,260 --> 00:02:45,030
‫Nah di sisi kiri, kami memiliki sistem file lengkap kami.

63
00:02:45,030 --> 00:02:48,010
‫Kami juga memiliki akses ke skrip NPM kami di

64
00:02:48,010 --> 00:02:50,810
‫sini yang sebenarnya dapat kami jalankan dari sini.

65
00:02:50,810 --> 00:02:52,910
‫Kami juga memiliki konsol dan di

66
00:02:52,910 --> 00:02:55,610
‫sini kami memiliki output biasa dengan aplikasi yang

67
00:02:55,610 --> 00:02:57,310
‫berjalan dan koneksi database

68
00:02:58,570 --> 00:03:01,330
‫dan kami juga memiliki tab kinerja dan memori,

69
00:03:01,330 --> 00:03:03,090
‫yang tidak akan kami gunakan.

70
00:03:03,090 --> 00:03:05,170
‫Baiklah, sekarang jika Anda sudah familiar

71
00:03:05,170 --> 00:03:07,130
‫dengan proses debugging umum

72
00:03:07,130 --> 00:03:10,100
‫maka semua ini akan menjadi familiar bagi Anda.

73
00:03:10,100 --> 00:03:12,260
‫Baiklah, tetapi jika tidak, jangan khawatir saya

74
00:03:12,260 --> 00:03:13,810
‫akan menunjukkan beberapa teknik di

75
00:03:13,810 --> 00:03:15,240
‫sepanjang video ini.

76
00:03:15,240 --> 00:03:19,560
‫Baiklah, sekarang mari kita buka server kita. js.

77
00:03:19,560 --> 00:03:21,460
‫Dan satu hal yang benar-benar

78
00:03:21,460 --> 00:03:24,500
‫menakjubkan adalah kita bisa mengedit file kita di sini,

79
00:03:24,500 --> 00:03:26,040
‫jadi di debugger ini.

80
00:03:26,040 --> 00:03:28,530
‫Jadi, misalnya, katakanlah kita menemukan bug

81
00:03:28,530 --> 00:03:30,820
‫dan kita ingin segera memperbaikinya.

82
00:03:30,820 --> 00:03:33,340
‫Kita bisa melakukannya di sini di debugger

83
00:03:33,340 --> 00:03:35,790
‫dan kemudian akan memperbarui kode aslinya.

84
00:03:35,790 --> 00:03:37,020
‫Jadi hanya untuk

85
00:03:37,020 --> 00:03:38,943
‫mengujinya, mari tambahkan saja komentar di sini.

86
00:03:40,050 --> 00:03:44,460
‫Jadi, uji lalu tekan perintah atau kontrol s untuk menyimpan dan kemudian ketika

87
00:03:44,460 --> 00:03:46,570
‫kita kembali ke kode kita dan

88
00:03:47,830 --> 00:03:49,800
‫membuka server. js di sana

89
00:03:49,800 --> 00:03:53,060
‫Anda akan melihat bahwa komentar itu sebenarnya ada di sini.

90
00:03:53,060 --> 00:03:53,950
‫Oke?

91
00:03:53,950 --> 00:03:55,810
‫Dan jika sekarang kita

92
00:03:55,810 --> 00:03:57,370
‫menghapusnya dari sini,

93
00:03:57,370 --> 00:03:59,220
‫menyimpannya, dan kembali ke

94
00:03:59,220 --> 00:04:02,300
‫debugger, maka itu juga akan hilang dari sini.

95
00:04:02,300 --> 00:04:04,810
‫Oke, tapi sekarang tentang debugging itu sendiri.

96
00:04:04,810 --> 00:04:06,860
‫Saya akan mengatakan bahwa aspek

97
00:04:06,860 --> 00:04:09,740
‫mendasar dari debugging adalah untuk mengatur break point.

98
00:04:09,740 --> 00:04:12,420
‫Jadi break point pada dasarnya adalah poin dalam kode kita

99
00:04:12,420 --> 00:04:14,540
‫yang dapat kita definisikan di sini di

100
00:04:14,540 --> 00:04:16,810
‫debugger, di mana kode kita kemudian akan berhenti berjalan.

101
00:04:16,810 --> 00:04:18,810
‫Ini pada dasarnya akan membeku

102
00:04:18,810 --> 00:04:21,900
‫dalam waktu dan kita kemudian dapat melihat semua variabel kita.

103
00:04:21,900 --> 00:04:24,530
‫Oke, jadi itu akan sangat berguna untuk

104
00:04:24,530 --> 00:04:26,270
‫menemukan beberapa bug.

105
00:04:26,270 --> 00:04:28,340
‫Sekarang, sekarang tidak ada bug

106
00:04:28,340 --> 00:04:30,860
‫di sini, tapi mari kita tambahkan break point.

107
00:04:30,860 --> 00:04:34,850
‫Dan saya akan menambahkan break point itu di baris ini 21.

108
00:04:34,850 --> 00:04:36,610
‫Jadi saya klik di sini pada

109
00:04:36,610 --> 00:04:38,920
‫baris ini dan kemudian Anda melihat penanda hijau ini, oke?

110
00:04:38,920 --> 00:04:41,600
‫Dan itu berarti kode akan berhenti pada

111
00:04:41,600 --> 00:04:43,950
‫titik ini ketika kita menjalankannya, oke?

112
00:04:43,950 --> 00:04:45,750
‫Dan Anda benar-benar dapat melihatnya di

113
00:04:45,750 --> 00:04:48,850
‫sini di sisi kanan pada tab break point di sini juga.

114
00:04:48,850 --> 00:04:50,680
‫Sekarang, aplikasi kita sebenarnya sudah

115
00:04:50,680 --> 00:04:52,360
‫berjalan pada titik

116
00:04:52,360 --> 00:04:55,350
‫ini dan pada dasarnya menunggu permintaan masuk.

117
00:04:55,350 --> 00:04:56,830
‫Jadi yang perlu kita

118
00:04:56,830 --> 00:05:00,810
‫lakukan di sini adalah klik kanan lalu klik run this script.

119
00:05:00,810 --> 00:05:02,670
‫Oke, dan itu pada dasarnya akan menjalankan

120
00:05:02,670 --> 00:05:04,153
‫skrip di sini lagi.

121
00:05:05,638 --> 00:05:06,720
‫Baiklah?

122
00:05:06,720 --> 00:05:08,390
‫Dan jadi di sini kita pergi.

123
00:05:08,390 --> 00:05:10,380
‫Jadi Anda lihat di sini di

124
00:05:10,380 --> 00:05:12,940
‫sisi kanan, yang dikatakan dijeda pada titik istirahat

125
00:05:12,940 --> 00:05:16,040
‫dan semua kode yang ada di atas titik henti ini

126
00:05:16,040 --> 00:05:18,330
‫di sini telah dieksekusi pada titik ini.

127
00:05:18,330 --> 00:05:21,390
‫Jadi sekarang kita bisa melihat variabelnya.

128
00:05:21,390 --> 00:05:24,230
‫Misalnya, kita dapat mengarahkan variabel port ini

129
00:05:24,230 --> 00:05:27,220
‫dan kita melihat bahwa itu disetel ke 3.000.

130
00:05:27,220 --> 00:05:29,670
‫Dan juga benar-benar mengenai tempat ini di sini

131
00:05:29,670 --> 00:05:31,560
‫dalam kode di sini, baiklah.

132
00:05:31,560 --> 00:05:33,830
‫Dan kemudian cara ketiga untuk melihatnya ada di

133
00:05:33,830 --> 00:05:35,380
‫sini di sisi kanan.

134
00:05:35,380 --> 00:05:38,280
‫Jadi kami pada dasarnya memiliki beberapa tab di sini

135
00:05:38,280 --> 00:05:40,940
‫sehingga proses simpul, arloji, tumpukan panggilan, yang

136
00:05:40,940 --> 00:05:43,240
‫tidak terlalu penting untuk saat ini.

137
00:05:43,240 --> 00:05:46,940
‫Ruang lingkupnya, dan ruang lingkupnya adalah tempat semua

138
00:05:46,940 --> 00:05:49,050
‫variabel kita berada, oke?

139
00:05:49,050 --> 00:05:52,530
‫Jadi di sini lagi, Anda memiliki port yang disetel ke 3.000.

140
00:05:52,530 --> 00:05:54,620
‫Oke, dan di sini Anda juga

141
00:05:54,620 --> 00:05:57,010
‫dapat melihat lima variabel yang kami akses

142
00:05:57,010 --> 00:05:58,490
‫di semua modul.

143
00:05:58,490 --> 00:06:01,290
‫Ingat bahwa dari model kuliah?

144
00:06:01,290 --> 00:06:03,590
‫Jadi kami memiliki nama direktori,

145
00:06:03,590 --> 00:06:07,250
‫kami memiliki nama file, kami memiliki fungsi yang dibutuhkan,

146
00:06:07,250 --> 00:06:10,150
‫kami memiliki modul, dan kami memiliki ekspor.

147
00:06:10,150 --> 00:06:12,690
‫Jadi ingat, ini adalah lima

148
00:06:12,690 --> 00:06:15,400
‫variabel yang tersedia di setiap modul.

149
00:06:15,400 --> 00:06:17,960
‫Dan sebenarnya ketika kita mengeksekusi kode

150
00:06:17,960 --> 00:06:21,730
‫seperti ini di debugger, kita dapat melihat bahwa seluruh kode

151
00:06:21,730 --> 00:06:24,383
‫kita sebenarnya dibungkus ke dalam fungsi ini.

152
00:06:25,390 --> 00:06:26,560
‫Benar?

153
00:06:26,560 --> 00:06:28,810
‫Jadi fungsi pembungkus ini yang

154
00:06:28,810 --> 00:06:31,230
‫memberi kita akses ke lima variabel ini.

155
00:06:31,230 --> 00:06:34,710
‫Baiklah, selanjutnya saya juga ingin melihat variabel app

156
00:06:34,710 --> 00:06:38,013
‫kita, jadi pada dasarnya aplikasi Express yang

157
00:06:38,013 --> 00:06:42,330
‫kita ekspor dari app. j, ingat itu.

158
00:06:42,330 --> 00:06:44,870
‫Dan di sini ada banyak hal,

159
00:06:44,870 --> 00:06:47,330
‫tetapi yang menurut saya

160
00:06:47,330 --> 00:06:50,393
‫menarik adalah melihat router ini di sini.

161
00:06:51,660 --> 00:06:54,763
‫Oke, dan di router kami kemudian memiliki tumpukan.

162
00:06:56,680 --> 00:06:59,100
‫Oke, jadi mari kita buka sedikit dan

163
00:07:00,240 --> 00:07:02,070
‫tumpukan ini pada dasarnya

164
00:07:02,070 --> 00:07:05,420
‫adalah tumpukan middleware yang kita miliki di aplikasi kita.

165
00:07:05,420 --> 00:07:09,010
‫Oke, misalnya kami memiliki jsonParser kami di

166
00:07:09,010 --> 00:07:13,030
‫sini, kami memiliki kode yang melayani file statis.

167
00:07:13,030 --> 00:07:16,760
‫Lihatlah itu di sini di app. js jadi ekspres

168
00:07:16,760 --> 00:07:19,170
‫ini. statis.

169
00:07:19,170 --> 00:07:21,380
‫Kami juga memiliki logger di sini

170
00:07:21,380 --> 00:07:23,910
‫yang datang ke sini dari menggunakan Morgan.

171
00:07:23,910 --> 00:07:26,310
‫Kemudian Anda memiliki dua fungsi middleware

172
00:07:26,310 --> 00:07:27,480
‫berikutnya, jadi

173
00:07:27,480 --> 00:07:31,590
‫dua ini di sini, yang anonim, jadi yang ini dan yang

174
00:07:31,590 --> 00:07:33,740
‫ini dan mungkin kita bisa melihatnya.

175
00:07:33,740 --> 00:07:35,803
‫Tapi tidak benar-benar.

176
00:07:36,640 --> 00:07:38,390
‫Oke, itu tidak masalah.

177
00:07:38,390 --> 00:07:40,740
‫Jadi ini benar-benar hanya untuk rasa ingin

178
00:07:40,740 --> 00:07:42,170
‫tahu dan menunjukkan kepada

179
00:07:42,170 --> 00:07:45,520
‫Anda bahwa kami benar-benar dapat melihat tumpukan middleware kami, oke?

180
00:07:45,520 --> 00:07:47,603
‫Kemudian akhirnya kami memiliki dua router kami.

181
00:07:48,795 --> 00:07:49,970
‫Oke?

182
00:07:49,970 --> 00:07:53,080
‫Jadi, kami memiliki router, dan Anda melihat di

183
00:07:53,080 --> 00:07:55,160
‫sini sebenarnya rute yang digunakannya.

184
00:07:55,160 --> 00:08:00,160
‫Jadi api/v1/tours benar dan menurut saya ini sangat menarik.

185
00:08:00,980 --> 00:08:03,710
‫Tentu saja kami masih memiliki pengguna di sini juga.

186
00:08:03,710 --> 00:08:07,250
‫Maka dengan ini benar-benar dapat melihat bagaimana aplikasi

187
00:08:07,250 --> 00:08:09,823
‫Express bekerja di belakang layar.

188
00:08:10,710 --> 00:08:11,543
‫Oke?

189
00:08:12,380 --> 00:08:14,623
‫Jadi mari kita tutup semua ini.

190
00:08:16,140 --> 00:08:18,440
‫Dan hal lain yang ingin saya tunjukkan

191
00:08:18,440 --> 00:08:20,210
‫kepada Anda ada di sini

192
00:08:21,120 --> 00:08:24,300
‫di variabel global karena di sini kita memiliki variabel proses atau

193
00:08:25,850 --> 00:08:28,453
‫setidaknya kita harus memilikinya di suatu tempat di sini.

194
00:08:30,700 --> 00:08:32,910
‫Ya, jadi memang di sini.

195
00:08:32,910 --> 00:08:35,140
‫Jadi di sini kita memiliki

196
00:08:35,140 --> 00:08:37,400
‫variabel proses yang diingat, tersedia di mana-mana.

197
00:08:37,400 --> 00:08:41,070
‫Dan itulah mengapa disebut di sini sebagai variabel global.

198
00:08:41,070 --> 00:08:43,310
‫Kemudian di sana kita memiliki proses. env

199
00:08:44,300 --> 00:08:46,030
‫dan untuk diingat bahwa

200
00:08:46,030 --> 00:08:49,250
‫ini tempat semua variabel lingkungan kita disimpan.

201
00:08:49,250 --> 00:08:52,180
‫Dan memang di sini kami memiliki string database

202
00:08:52,180 --> 00:08:55,340
‫kami, kami memiliki database lokal, kata sandi, dan benar-benar

203
00:08:55,340 --> 00:08:57,910
‫semua variabel lingkungan lain yang kami definisikan

204
00:08:57,910 --> 00:09:01,333
‫di konfigurasi kami. n berkas.

205
00:09:02,630 --> 00:09:03,740
‫Baiklah?

206
00:09:03,740 --> 00:09:07,070
‫Hal-hal yang sangat menarik yang bisa kita lihat di sini.

207
00:09:07,070 --> 00:09:10,260
‫Tapi sekarang mari kita lanjutkan dengan debugging kita.

208
00:09:10,260 --> 00:09:11,093
‫Oke?

209
00:09:11,093 --> 00:09:13,540
‫Jadi kami menghentikan kodenya, kami membekukannya tepat

210
00:09:13,540 --> 00:09:16,630
‫waktu di sini saat ini, jadi di baris 21.

211
00:09:16,630 --> 00:09:19,720
‫Oke, jadi sekarang kita bisa klik di sini pada

212
00:09:19,720 --> 00:09:22,400
‫tombol ini, untuk benar-benar terus menjalankan kodenya.

213
00:09:22,400 --> 00:09:24,210
‫Dan karena kita tidak memiliki

214
00:09:24,210 --> 00:09:26,070
‫break point lagi, maka kode tidak

215
00:09:26,070 --> 00:09:28,500
‫akan rusak lagi, dan pada dasarnya selesai berjalan.

216
00:09:28,500 --> 00:09:29,980
‫Jadi mari kita lakukan itu.

217
00:09:29,980 --> 00:09:32,910
‫Dan sekarang aplikasi kita benar-benar berjalan.

218
00:09:32,910 --> 00:09:33,830
‫Mari kita lihat itu.

219
00:09:33,830 --> 00:09:36,600
‫Di Konsol, oke?

220
00:09:36,600 --> 00:09:38,720
‫Jadi aplikasi yang berjalan pada port 3.000

221
00:09:38,720 --> 00:09:40,793
‫dan koneksi DB berhasil, tentu saja.

222
00:09:43,550 --> 00:09:44,793
‫Apa yang terjadi di sini?

223
00:09:46,120 --> 00:09:47,350
‫Sekarang, baiklah, jadi

224
00:09:47,350 --> 00:09:50,163
‫sekarang mari kita cepat melakukan permintaan di sini.

225
00:09:51,580 --> 00:09:53,650
‫Jadi cukup satu untuk /tours dan sekarang

226
00:09:55,532 --> 00:09:57,100
‫kita memiliki semua sampah

227
00:09:57,100 --> 00:09:59,683
‫ini di sini dan saya akan membereskannya sebentar lagi.

228
00:10:01,050 --> 00:10:04,110
‫Baiklah, dan jika Anda sekarang kembali ke Konsol kami

229
00:10:04,110 --> 00:10:07,670
‫di sini, tentu saja kami memiliki semua kode yang kami miliki sebelumnya.

230
00:10:07,670 --> 00:10:09,220
‫Halo dari middleware

231
00:10:09,220 --> 00:10:12,120
‫dan kemudian berapa lama kueri sebenarnya.

232
00:10:12,120 --> 00:10:14,890
‫Baiklah, dan sekarang sebelum kita melakukan

233
00:10:14,890 --> 00:10:17,693
‫hal lain, mari kita singkirkan tur sampah ini.

234
00:10:19,380 --> 00:10:20,893
‫Jadi saya akan memuat ulang di sini,

235
00:10:22,270 --> 00:10:24,720
‫dan saya kira itu akan ada di suatu tempat di sini di akhir.

236
00:10:26,720 --> 00:10:29,103
‫Jadi, uji apa pun di sini.

237
00:10:29,980 --> 00:10:31,593
‫Jadi mari kita singkirkan itu.

238
00:10:32,490 --> 00:10:35,573
‫Ini adalah tur rahasia dan saya benar-benar ingin menyimpannya di sini.

239
00:10:37,480 --> 00:10:40,413
‫Tapi semuanya mulai dari sini tidak lagi kita inginkan.

240
00:10:44,720 --> 00:10:45,830
‫Jadi ya,

241
00:10:48,150 --> 00:10:51,490
‫jadi sekarang kami kembali hanya mengadakan 10

242
00:10:51,490 --> 00:10:53,480
‫tur, sama seperti sebelumnya.

243
00:10:53,480 --> 00:10:55,860
‫Pokoknya sekarang mari kita benar-benar menetapkan titik istirahat

244
00:10:55,860 --> 00:10:58,203
‫dalam fungsi yang menangani rute ini.

245
00:10:59,060 --> 00:11:02,150
‫Oke, dan jadi kami datang ke folder pengontrol kami dan

246
00:11:02,150 --> 00:11:04,540
‫di sana kami memiliki pengontrol tur.

247
00:11:04,540 --> 00:11:05,373
‫Oke?

248
00:11:05,373 --> 00:11:08,200
‫Dan kemudian fungsi handlernya adalah ini mendapatkan semua tur.

249
00:11:08,200 --> 00:11:09,760
‫Jadi untuk saat

250
00:11:09,760 --> 00:11:11,960
‫ini yang ingin saya lakukan hanyalah

251
00:11:11,960 --> 00:11:15,010
‫menetapkan titik istirahat di sini sehingga kita dapat melihat

252
00:11:15,010 --> 00:11:17,710
‫seperti apa variabel ini setelah kueri selesai dibuat.

253
00:11:17,710 --> 00:11:20,430
‫Jadi kode ini di sini akan mendapatkan tur

254
00:11:20,430 --> 00:11:21,900
‫kami dan kami kemudian

255
00:11:21,900 --> 00:11:25,210
‫akan menghentikan kode pada dasarnya sebelum benar-benar mengirimkannya sebagai tanggapan.

256
00:11:25,210 --> 00:11:29,790
‫Oke, jadi yang perlu kita lakukan adalah benar-benar melakukan permintaan

257
00:11:29,790 --> 00:11:32,730
‫karena itu akan memicu fungsi itu.

258
00:11:32,730 --> 00:11:33,600
‫Benar?

259
00:11:33,600 --> 00:11:36,550
‫Dan karena kita memiliki titik istirahat, kita secara otomatis

260
00:11:36,550 --> 00:11:39,440
‫kembali ke jendela ini di sini, dan ke titik

261
00:11:39,440 --> 00:11:41,270
‫di mana kode telah berhenti.

262
00:11:41,270 --> 00:11:43,713
‫Jadi, variabel macam apa yang kita miliki di sini?

263
00:11:44,830 --> 00:11:47,690
‫Jadi Anda melihat bahwa kami memiliki permintaan dan

264
00:11:47,690 --> 00:11:49,630
‫tanggapan, dan kami juga memiliki

265
00:11:49,630 --> 00:11:51,670
‫variabel fitur, dan tur, tentu saja.

266
00:11:51,670 --> 00:11:53,770
‫Jadi mari kita lihat dulu permintaannya.

267
00:11:54,740 --> 00:11:57,500
‫Dan di sini sekali lagi, Anda melihat bahwa kami memiliki

268
00:11:57,500 --> 00:11:58,560
‫semua jenis barang.

269
00:11:58,560 --> 00:12:02,470
‫Jadi kami memiliki, baseurl, kami memiliki metode, kami memiliki

270
00:12:02,470 --> 00:12:05,150
‫misalnya, permintaan. kueri, yang saat ini

271
00:12:05,150 --> 00:12:07,280
‫kosong karena kami tidak meneruskan string kueri

272
00:12:07,280 --> 00:12:08,560
‫apa pun, tetapi

273
00:12:08,560 --> 00:12:11,170
‫Anda melihat bahwa itu benar-benar sudah ada di sini.

274
00:12:11,170 --> 00:12:13,730
‫Oke, dan sekarang Anda mulai

275
00:12:13,730 --> 00:12:16,810
‫melihat betapa bergunanya ini untuk men-debug kode kita.

276
00:12:16,810 --> 00:12:20,060
‫Jadi pada dasarnya untuk membekukan kode kita tepat waktu daripada

277
00:12:20,060 --> 00:12:23,620
‫harus melakukan semua konsol ini. log yang biasa kami lakukan

278
00:12:23,620 --> 00:12:25,040
‫hingga saat ini.

279
00:12:25,040 --> 00:12:27,770
‫Jadi biasanya ketika kami ingin melihat kueri misalnya, kami

280
00:12:27,770 --> 00:12:31,010
‫akan melakukan banyak konsol. log dan gunakan itu

281
00:12:31,010 --> 00:12:34,590
‫untuk mencari tahu bug jika ada sesuatu yang

282
00:12:34,590 --> 00:12:35,950
‫tidak berfungsi.

283
00:12:35,950 --> 00:12:38,150
‫Benar, tetapi sekarang kami memiliki alat luar biasa ini yang dapat

284
00:12:38,150 --> 00:12:42,460
‫membantu kami menghindari semua konsol ini. log misalnya.

285
00:12:42,460 --> 00:12:44,530
‫Kemudian kita juga mendapat respon tentunya.

286
00:12:44,530 --> 00:12:48,460
‫Dan sekali lagi Anda melihat semua properti dan metode yang ada di

287
00:12:48,460 --> 00:12:50,890
‫sana, dan mereka tidak terlalu menarik bagi

288
00:12:50,890 --> 00:12:51,990
‫kita sekarang.

289
00:12:51,990 --> 00:12:54,900
‫Apa yang ingin saya tunjukkan kepada Anda tentu saja

290
00:12:54,900 --> 00:12:57,520
‫saat ini kita sudah memiliki tur, oke?

291
00:12:57,520 --> 00:13:02,450
‫Jadi kami memiliki sembilan tur, jadi mari kita lihat mereka.

292
00:13:02,450 --> 00:13:06,000
‫Dan terlihat agak aneh di sini, jadi untuk mendapatkan

293
00:13:06,000 --> 00:13:10,480
‫akses ke nilai sebenarnya, kita perlu klik di sini, oke, jadi

294
00:13:10,480 --> 00:13:11,880
‫itu agak aneh.

295
00:13:11,880 --> 00:13:14,037
‫Tapi itu bekerja tentu saja.

296
00:13:14,037 --> 00:13:18,110
‫Jadi Anda lihat bahwa sebenarnya tur kami sudah ada di

297
00:13:18,110 --> 00:13:21,093
‫sini dan tentu saja fiturnya juga.

298
00:13:21,930 --> 00:13:24,650
‫Jadi Anda lihat di sini bahwa fitur-fiturnya adalah

299
00:13:24,650 --> 00:13:27,670
‫turunan dari kelas fitur API seperti yang kita definisikan.

300
00:13:27,670 --> 00:13:31,130
‫Dan di sana kita memiliki kueri dan string kueri.

301
00:13:31,130 --> 00:13:34,660
‫Bagus, jadi beginilah cara kita melihat semua variabel.

302
00:13:34,660 --> 00:13:37,087
‫Dan beginilah cara kerja bagian

303
00:13:37,087 --> 00:13:38,680
‫terpenting dari debugger.

304
00:13:38,680 --> 00:13:41,750
‫Sekarang untuk mempelajari sedikit tentang proses debugging itu sendiri,

305
00:13:41,750 --> 00:13:45,400
‫mari kita perkenalkan bug yang sangat kecil ke dalam kode kita,

306
00:13:45,400 --> 00:13:48,300
‫dan kemudian lihat bagaimana kita dapat menggunakan alat-alat

307
00:13:48,300 --> 00:13:51,280
‫yang kita miliki di sini untuk melihat lebih dalam

308
00:13:51,280 --> 00:13:52,790
‫pada kode kita.

309
00:13:52,790 --> 00:13:55,410
‫Jadi saya tidak akan melanjutkan

310
00:13:55,410 --> 00:13:59,850
‫eksekusi yang dilewati untuk menjalankan pada dasarnya sisa kode, oke?

311
00:13:59,850 --> 00:14:01,270
‫Jadi itu harus dilakukan sekarang.

312
00:14:01,270 --> 00:14:03,670
‫Jadi sekarang di sini kita memiliki semua tanggapan.

313
00:14:03,670 --> 00:14:06,320
‫Jadi Anda lihat butuh waktu lama di sini,

314
00:14:06,320 --> 00:14:08,970
‫jadi tiga menit dan 29 detik, tapi

315
00:14:08,970 --> 00:14:11,410
‫itu hanya karena kami menghentikan eksekusi

316
00:14:11,410 --> 00:14:12,313
‫begitu lama.

317
00:14:14,130 --> 00:14:15,130
‫Oke.

318
00:14:15,130 --> 00:14:17,793
‫Sekarang mari kita masuk ke kode kita di sini.

319
00:14:19,160 --> 00:14:21,853
‫Mari kita tutup apa yang tidak lagi kita butuhkan.

320
00:14:23,810 --> 00:14:28,410
‫Jadi sebenarnya di file fitur API kami, saya ingin

321
00:14:28,410 --> 00:14:32,603
‫memperkenalkan bug kecil di sini di bidang batas.

322
00:14:33,570 --> 00:14:36,080
‫Jadi katakanlah kami mencoba menerapkan metode ini

323
00:14:36,080 --> 00:14:39,340
‫di sini, tetapi alih-alih bergabung dengan spasi di sini,

324
00:14:39,340 --> 00:14:41,790
‫kami lupa meletakkannya di sini.

325
00:14:41,790 --> 00:14:45,030
‫Jadi katakan saja kita bergabung tanpa spasi,

326
00:14:45,030 --> 00:14:49,010
‫dan ini akan memberi kita hasil yang aneh, bukan?

327
00:14:49,010 --> 00:14:50,633
‫Jadi mari kita benar-benar mengujinya.

328
00:14:52,650 --> 00:14:54,480
‫Jadi

329
00:14:56,350 --> 00:14:59,690
‫katakanlah bidang dan kami

330
00:14:59,690 --> 00:15:04,050
‫hanya menginginkan nama dan durasinya, bukan?

331
00:15:04,050 --> 00:15:07,400
‫Sekarang sebelum saya benar-benar dapat mengirim permintaan itu, mari kita

332
00:15:07,400 --> 00:15:09,050
‫hapus breakpoint di sini.

333
00:15:10,650 --> 00:15:11,483
‫Oke?

334
00:15:11,483 --> 00:15:14,410
‫Mengirim permintaan, dan sekarang kami sebenarnya tidak mendapatkan

335
00:15:14,410 --> 00:15:16,073
‫nama dan durasinya.

336
00:15:16,920 --> 00:15:19,410
‫Jadi mari kita berpura-pura itu adalah bug

337
00:15:19,410 --> 00:15:23,510
‫kita sekarang dan sekarang kita mencoba mencari tahu mengapa ini tidak berhasil.

338
00:15:23,510 --> 00:15:24,520
‫Oke?

339
00:15:24,520 --> 00:15:26,490
‫Jadi mari kita pergi ke debugger kami.

340
00:15:26,490 --> 00:15:28,470
‫Dan kami tahu bahwa kesalahannya mungkin

341
00:15:28,470 --> 00:15:31,053
‫ada di suatu tempat dalam metode bidang batas kami.

342
00:15:32,090 --> 00:15:35,530
‫Jadi pada dasarnya mari kita hentikan kode agar tidak dieksekusi

343
00:15:35,530 --> 00:15:37,320
‫pada saat ini, oke?

344
00:15:37,320 --> 00:15:40,880
‫Karena di sinilah sebenarnya metode ini akan dipanggil dan

345
00:15:40,880 --> 00:15:43,927
‫dari sini kita bisa memasukkan fungsi itu untuk

346
00:15:43,927 --> 00:15:45,130
‫metode itu.

347
00:15:45,130 --> 00:15:46,100
‫Oke?

348
00:15:46,100 --> 00:15:48,883
‫Jadi mari kita jalankan permintaan itu

349
00:15:50,240 --> 00:15:54,240
‫sekarang, dan sekarang kita kembali ke debugger kita secara otomatis.

350
00:15:54,240 --> 00:15:57,250
‫Jadi pada titik ini baris ini dan baris

351
00:15:57,250 --> 00:16:00,880
‫ini dan baris kode ini telah dieksekusi, jadi sekarang mari

352
00:16:00,880 --> 00:16:02,980
‫kita gunakan alat langkah, oke?

353
00:16:02,980 --> 00:16:05,770
‫Langkah apa yang akan dilakukan adalah pada dasarnya akan

354
00:16:05,770 --> 00:16:07,430
‫mengeksekusi baris kode berikutnya.

355
00:16:07,430 --> 00:16:09,810
‫Dan dalam hal ini yang akan berada

356
00:16:09,810 --> 00:16:11,790
‫di dalam metode bidang batas.

357
00:16:11,790 --> 00:16:16,143
‫Jadi langkah, dan kemudian akan pindah ke fungsi itu.

358
00:16:17,000 --> 00:16:20,670
‫Oke jadi mari kita lihat apa yang kita miliki di sini.

359
00:16:20,670 --> 00:16:24,070
‫Misalnya ini. string kueri adalah durasi

360
00:16:24,070 --> 00:16:26,083
‫nama koma, jadi itu benar, kan?

361
00:16:26,990 --> 00:16:30,520
‫Oke jadi mari kita melangkah ke baris berikutnya.

362
00:16:30,520 --> 00:16:33,600
‫Baiklah dan di sinilah operasi ini

363
00:16:33,600 --> 00:16:35,263
‫benar-benar terjadi.

364
00:16:36,440 --> 00:16:38,460
‫Kemudian selanjutnya.

365
00:16:38,460 --> 00:16:40,823
‫Mari kita lihat variabel kita di sini.

366
00:16:42,500 --> 00:16:47,090
‫Jadi di sini kita sekarang melihat bidang, dan di sini kita memiliki bug.

367
00:16:47,090 --> 00:16:47,930
‫Oke?

368
00:16:47,930 --> 00:16:50,810
‫Jadi masalahnya adalah, tentu saja, kami tidak memiliki

369
00:16:50,810 --> 00:16:53,170
‫ruang antara nama dan durasi.

370
00:16:53,170 --> 00:16:54,830
‫Dan itulah mengapa itu tidak berhasil.

371
00:16:54,830 --> 00:16:58,410
‫Jadi bidang tentu saja didefinisikan di sini, dan

372
00:16:58,410 --> 00:17:02,500
‫seperti ini kami dapat menemukan bug kami dan segera memperbaikinya.

373
00:17:02,500 --> 00:17:04,940
‫Jadi ingat bahwa langkah tambahan yang

374
00:17:04,940 --> 00:17:07,780
‫kita lakukan di sini tercermin langsung dalam kode.

375
00:17:07,780 --> 00:17:08,823
‫Jadi berikan

376
00:17:09,700 --> 00:17:12,560
‫itu menyimpan, dan kemudian akan melakukannya lagi.

377
00:17:12,560 --> 00:17:14,233
‫Jadi saya bisa terus melangkah.

378
00:17:15,140 --> 00:17:17,270
‫Dan sekarang bidang sudah benar.

379
00:17:17,270 --> 00:17:19,193
‫Jadi beri nama durasi ruang.

380
00:17:20,780 --> 00:17:22,670
‫Kemudian baris kode berikutnya.

381
00:17:22,670 --> 00:17:26,330
‫Dan sekarang kita masuk ke metode select pada query.

382
00:17:26,330 --> 00:17:28,420
‫Tapi kami tidak tertarik sama sekali, jadi kami bisa

383
00:17:28,420 --> 00:17:32,543
‫mengatakan "keluar dari fungsi saat ini. " Oke?

384
00:17:32,543 --> 00:17:35,730
‫Jadi pilih yang kami pikir menjalankan fungsi

385
00:17:35,730 --> 00:17:37,880
‫ini di sini, oke?

386
00:17:37,880 --> 00:17:40,150
‫Tapi tentu saja kami tidak tertarik

387
00:17:40,150 --> 00:17:43,080
‫dengan itu, jadi kami berhenti dan pindah ke baris berikutnya.

388
00:17:43,080 --> 00:17:44,950
‫Jadi sekarang kami

389
00:17:44,950 --> 00:17:48,330
‫telah mengembalikan ini, baris berikutnya, dan lagi.

390
00:17:48,330 --> 00:17:51,373
‫Jadi sekarang kita kembali ke tempat kita sebelumnya tetapi di baris berikutnya.

391
00:17:52,590 --> 00:17:53,840
‫Jadi mari kita terus melakukan itu.

392
00:17:55,040 --> 00:17:56,750
‫Jadi sekarang kita masuk ke

393
00:17:56,750 --> 00:17:59,060
‫halaman delapan, tapi kita tidak terlalu tertarik dengan

394
00:17:59,060 --> 00:18:01,660
‫yang ini, jadi mari kita keluar dari fungsi saat ini.

395
00:18:02,950 --> 00:18:05,190
‫Dan sekarang kita di sini di definisi wisata.

396
00:18:05,190 --> 00:18:07,840
‫Yang saat ini belum dilakukan.

397
00:18:07,840 --> 00:18:10,610
‫Jadi mari kita katakan lagi langkah.

398
00:18:10,610 --> 00:18:14,070
‫Dan sekarang pada titik ini tur kita harus ditentukan.

399
00:18:14,070 --> 00:18:17,950
‫Baiklah, jadi kami memiliki sembilan tur kami di sini.

400
00:18:17,950 --> 00:18:19,250
‫Mari kita lihat mereka,

401
00:18:20,590 --> 00:18:21,810
‫dan inilah mereka.

402
00:18:21,810 --> 00:18:23,670
‫Dan sebenarnya mereka memiliki

403
00:18:23,670 --> 00:18:26,880
‫semua data, jadi bukan hanya yang kami definisikan

404
00:18:26,880 --> 00:18:28,560
‫tetapi sebenarnya tidak.

405
00:18:28,560 --> 00:18:32,220
‫Jadi kami benar-benar hanya memiliki nama dan

406
00:18:32,220 --> 00:18:35,490
‫durasi, jadi durasi, nama, dan yang lainnya

407
00:18:35,490 --> 00:18:36,980
‫tidak ditentukan.

408
00:18:36,980 --> 00:18:40,010
‫Jadi itu hanya karena kami membatasi kueri hanya pada

409
00:18:40,010 --> 00:18:41,603
‫dua bidang ini, ingat?

410
00:18:42,500 --> 00:18:45,350
‫Sekarang apa yang saya juga ingin tunjukkan kepada Anda

411
00:18:45,350 --> 00:18:49,370
‫ada di sini dalam fitur, kita dapat melihat kueri kita dan di sini kita

412
00:18:49,370 --> 00:18:52,240
‫memiliki properti bidang misalnya di mana kita melihat durasi disetel

413
00:18:52,240 --> 00:18:54,780
‫ke satu dan nama disetel ke satu.

414
00:18:54,780 --> 00:18:58,300
‫Dan itulah tepatnya dua nama yang kami pilih.

415
00:18:58,300 --> 00:19:00,420
‫Kami juga memiliki opsi

416
00:19:00,420 --> 00:19:05,420
‫ini di sini, yang pada titik ini diatur untuk membuatnya minus satu.

417
00:19:05,690 --> 00:19:07,393
‫Dan itu datang dari sini.

418
00:19:08,560 --> 00:19:10,500
‫Jadi ini di sini.

419
00:19:10,500 --> 00:19:13,360
‫Jadi pada dasarnya apa metode ini di sini, metode pengurutan

420
00:19:13,360 --> 00:19:17,350
‫ini akan dilakukan adalah bahwa ia akan menambahkan properti pengurutan ini di sini

421
00:19:17,350 --> 00:19:18,860
‫ke opsi ini, oke?

422
00:19:18,860 --> 00:19:22,110
‫Dan kemudian kami juga memiliki batas dan lewati yang tentu saja datang

423
00:19:22,110 --> 00:19:23,763
‫ke sini dari halaman delapan.

424
00:19:25,690 --> 00:19:26,523
‫Oke?

425
00:19:26,523 --> 00:19:29,160
‫Jadi saya pikir ini juga menarik dan

426
00:19:29,160 --> 00:19:33,880
‫ya, jadi kode kita sekarang benar-benar diperbaiki dan mari kita teruskan

427
00:19:33,880 --> 00:19:34,713
‫ini.

428
00:19:35,550 --> 00:19:38,630
‫Dan jadi kita sekarang harus memiliki hasil yang benar.

429
00:19:38,630 --> 00:19:41,510
‫Sekarang di sini dikatakan bahwa kami tidak mendapatkan respons

430
00:19:41,510 --> 00:19:44,593
‫apa pun, dan itu karena kami terlalu lama memperbaiki kode kami.

431
00:19:45,490 --> 00:19:47,280
‫Jadi kami mendapat kesalahan saat menghubungkan.

432
00:19:47,280 --> 00:19:48,693
‫Tapi kalau sekarang kita kirim

433
00:19:49,530 --> 00:19:51,050
‫lagi, dan sekarang kita buat lebih cepat.

434
00:19:51,050 --> 00:19:53,650
‫Atau sebenarnya kita bisa menghapus breakpoint kita sepenuhnya.

435
00:19:55,280 --> 00:19:56,780
‫Jadi mari kita

436
00:19:56,780 --> 00:19:59,570
‫tetap menjalankannya, mari kita kembali dan sekarang memang

437
00:19:59,570 --> 00:20:01,570
‫kita mendapatkan durasi dan namanya juga.

438
00:20:01,570 --> 00:20:04,260
‫Jadi itu karena kami baru saja memperbaiki

439
00:20:04,260 --> 00:20:06,550
‫kode kami menggunakan debugger NDB.

440
00:20:06,550 --> 00:20:07,990
‫Sangat bagus.

441
00:20:07,990 --> 00:20:10,840
‫Itu adalah alat yang sangat luar biasa dan

442
00:20:10,840 --> 00:20:13,260
‫bermanfaat yang akan terus kami gunakan sepanjang

443
00:20:13,260 --> 00:20:14,220
‫sisa kursus.

444
00:20:14,220 --> 00:20:17,530
‫Mungkin tidak selalu, terkadang lebih cepat memasukkan

445
00:20:17,530 --> 00:20:19,540
‫log keluar konsol.

446
00:20:19,540 --> 00:20:22,350
‫Tapi sungguh, dalam beberapa kasus yang lebih rumit, saya

447
00:20:22,350 --> 00:20:24,253
‫suka menggunakan alat semacam ini.