1 00:00:01,180 --> 00:00:02,070 ‫Instruktur: Dalam 2 00:00:02,070 --> 00:00:04,620 ‫video ini, kita akan membuat halaman akun pengguna 3 00:00:04,620 --> 00:00:07,270 ‫sebagian besar menggunakan konsep yang sudah kita ketahui 4 00:00:07,270 --> 00:00:08,823 ‫dan sudah digunakan sebelumnya. 5 00:00:10,560 --> 00:00:12,470 ‫Dan mari kita mulai dengan melihat 6 00:00:12,470 --> 00:00:15,340 ‫apa yang sebenarnya saya maksud dengan halaman akun pengguna di 7 00:00:15,340 --> 00:00:20,230 ‫situs referensi kami jadi di sini di natours. pengembang 8 00:00:20,230 --> 00:00:22,920 ‫Jadi kami sudah merender menu ini di 9 00:00:22,920 --> 00:00:24,210 ‫sini di 10 00:00:24,210 --> 00:00:27,430 ‫situs web kami, tetapi ketika kami mengklik pengguna ini, 11 00:00:27,430 --> 00:00:30,210 ‫kami mendapatkan akses ke halaman akun pengguna. 12 00:00:30,210 --> 00:00:33,349 ‫Jadi di sini, kita dapat mengubah beberapa pengaturan 13 00:00:33,349 --> 00:00:35,807 ‫dasar, juga mengunggah foto baru, tetapi 14 00:00:35,807 --> 00:00:37,540 ‫yang ini sebenarnya akan 15 00:00:37,540 --> 00:00:39,013 ‫kita lakukan di 16 00:00:40,043 --> 00:00:44,690 ‫bagian berikutnya, dan pengguna juga dapat memperbarui kata sandinya di halaman ini. 17 00:00:44,690 --> 00:00:47,590 ‫Kemudian, di sisi kiri ada beberapa item menu, 18 00:00:47,590 --> 00:00:49,740 ‫yang sebenarnya tidak akan kami 19 00:00:49,740 --> 00:00:52,120 ‫implementasikan sehingga kami hanya akan mengimplementasikan 20 00:00:52,120 --> 00:00:55,027 ‫menu, tetapi tidak benar-benar halaman yang mereka tunjuk, 21 00:00:55,027 --> 00:00:57,840 ‫dan kemudian jika pengguna adalah administrator, kami 22 00:00:57,840 --> 00:01:00,690 ‫juga merender bagian ini ke bawah. di sini. 23 00:01:00,690 --> 00:01:04,380 ‫Oke, jadi inilah yang akan kita bangun dalam kuliah 24 00:01:04,380 --> 00:01:06,440 ‫ini, dan dalam beberapa 25 00:01:06,440 --> 00:01:09,440 ‫kuliah berikutnya kita akan benar-benar memperbarui pengaturannya. 26 00:01:09,440 --> 00:01:13,113 ‫Jadi, pada dasarnya membuat tombol-tombol ini berfungsi di sini. 27 00:01:14,227 --> 00:01:15,060 ‫Baiklah? 28 00:01:15,060 --> 00:01:17,620 ‫Tapi untuk saat ini, itu hanya merender halaman ini di sini 29 00:01:17,620 --> 00:01:19,443 ‫di this . saya URL. 30 00:01:21,370 --> 00:01:22,610 ‫Oke? 31 00:01:22,610 --> 00:01:25,343 ‫Jadi, mari kita mulai dengan template pug. 32 00:01:26,250 --> 00:01:28,080 ‫Baiklah, dan seperti biasa, 33 00:01:28,080 --> 00:01:30,873 ‫saya sudah memiliki template akun ini di sini. 34 00:01:32,050 --> 00:01:34,453 ‫Jadi mari kita ambil itu, salin, 35 00:01:37,810 --> 00:01:40,253 ‫lalu buat tampilan baru di sini, yang 36 00:01:42,730 --> 00:01:44,360 ‫saya sebut akun. 37 00:01:44,360 --> 00:01:46,810 ‫Dan sekarang kami ingin memperluas 38 00:01:51,281 --> 00:01:56,270 ‫basis dan kami ingin membuat blok yang disebut konten seperti biasa. 39 00:01:56,270 --> 00:01:59,863 ‫Dan di sinilah kami benar-benar menempelkan konten kami. 40 00:02:00,740 --> 00:02:02,010 ‫Baiklah? 41 00:02:02,010 --> 00:02:04,000 ‫Sekarang kita perlu membuat 42 00:02:05,850 --> 00:02:09,803 ‫indentasi semua ini untuk membuatnya di dalam blok. 43 00:02:10,640 --> 00:02:15,640 ‫Hebat, jadi, pertama-tama kita memiliki navigasi, kan? 44 00:02:15,670 --> 00:02:18,540 ‫Jadi pengaturan, pemesanan, ulasan, dan tagihan 45 00:02:18,540 --> 00:02:21,020 ‫yang kami lihat ada di 46 00:02:21,020 --> 00:02:25,430 ‫sisi kiri halaman, dan kami juga memiliki navigasi Admin, bukan? 47 00:02:25,430 --> 00:02:28,590 ‫Dan mereka sudah melihat banyak kode duplikat di sini. 48 00:02:28,590 --> 00:02:31,770 ‫Jadi pada dasarnya elemen daftar item di 49 00:02:31,770 --> 00:02:34,950 ‫sini, mereka muncul sebenarnya delapan kali. 50 00:02:34,950 --> 00:02:38,970 ‫Jadi empat kali di atas sini dan empat kali di bawah sini 51 00:02:38,970 --> 00:02:41,730 ‫jadi mari kita dengan cepat membuat mixin untuk 52 00:02:41,730 --> 00:02:44,330 ‫membuat kode kita terlihat sedikit lebih bersih. 53 00:02:44,330 --> 00:02:46,310 ‫Baiklah, jadi saya akan 54 00:02:46,310 --> 00:02:48,610 ‫melanjutkan dan benar-benar menyalin salah satunya. 55 00:02:48,610 --> 00:02:52,953 ‫Dan kemudian buat mixin baru bernama navItem. 56 00:02:55,600 --> 00:02:57,480 ‫Oke, jadi kami melakukan itu sebelumnya. 57 00:02:57,480 --> 00:02:59,120 ‫Jadi ini sangat mirip. 58 00:02:59,120 --> 00:03:01,500 ‫Jadi apa yang perlu kita masukkan 59 00:03:01,500 --> 00:03:05,100 ‫ke dalam mixin ini untuk menyesuaikan setiap item pada dasarnya? 60 00:03:05,100 --> 00:03:07,773 ‫Nah, yang akan berubah adalah tautannya. 61 00:03:08,960 --> 00:03:13,960 ‫Juga teks, jadi pengaturan, pemesanan, dan lain-lain. 62 00:03:14,790 --> 00:03:16,360 ‫Jadi itu teks. 63 00:03:16,360 --> 00:03:19,240 ‫Kemudian ikonnya juga akan berubah, dan 64 00:03:19,240 --> 00:03:21,980 ‫akhirnya Anda melihat bahwa 65 00:03:21,980 --> 00:03:25,690 ‫yang pertama ini memiliki kelas side-nav--active, bukan? 66 00:03:25,690 --> 00:03:30,530 ‫Jadi kami juga akan menentukan aktif seperti di sini pada dasarnya. 67 00:03:30,530 --> 00:03:33,110 ‫Dan kemudian ketika kita ingin menandai sebuah item 68 00:03:33,110 --> 00:03:35,390 ‫sebagai aktif, kita cukup melewati sini. 69 00:03:35,390 --> 00:03:36,762 ‫Oke? 70 00:03:36,762 --> 00:03:39,573 ‫Jadi sekarang kita perlu memperbaiki lekukan di sini. 71 00:03:47,530 --> 00:03:49,123 ‫Dan kemudian berikan data kami. 72 00:03:54,930 --> 00:03:56,363 ‫Berikutnya adalah teks. 73 00:03:59,900 --> 00:04:01,900 ‫Jadi ini, tentu saja pada 74 00:04:01,900 --> 00:04:06,607 ‫titik ini, bukanlah hal baru jadi saya melakukannya dengan cukup cepat di sini, bukan? 75 00:04:07,910 --> 00:04:12,000 ‫Jadi icon lalu nama icon yang kita lewati. 76 00:04:12,000 --> 00:04:13,860 ‫Jadi seperti yang kita lakukan 77 00:04:13,860 --> 00:04:15,640 ‫sebelumnya, dan akhirnya aktif 78 00:04:15,640 --> 00:04:18,220 ‫di sini, ingat, akan benar atau salah. 79 00:04:18,220 --> 00:04:21,840 ‫Dan jika benar maka kita ingin menambahkan kelas ini. 80 00:04:21,840 --> 00:04:22,753 ‫Jadi mari kita salin. 81 00:04:23,950 --> 00:04:27,063 ‫Dan kemudian di sini mari kita tentukan atribut kelas. 82 00:04:29,820 --> 00:04:31,470 ‫Dan kemudian seperti yang kita 83 00:04:31,470 --> 00:04:33,910 ‫lakukan, mari kita lakukan turnery statement di sini. 84 00:04:33,910 --> 00:04:38,480 ‫Jadi katakanlah jika aktif, pada dasarnya, maka di 85 00:04:38,480 --> 00:04:42,003 ‫sini kita ingin memiliki side-nav--active. 86 00:04:43,010 --> 00:04:45,490 ‫Dan jika tidak maka kita tidak menginginkan apa-apa. 87 00:04:45,490 --> 00:04:47,243 ‫Jadi nama kelas kosong, pada dasarnya. 88 00:04:49,030 --> 00:04:49,980 ‫Baiklah. 89 00:04:49,980 --> 00:04:53,800 ‫Jadi sekarang kita bisa mengganti ini dengan mixin kita. 90 00:04:53,800 --> 00:04:57,270 ‫Jadi itu disebut navItem, dan jadi ingat, kita 91 00:04:57,270 --> 00:05:00,180 ‫menulis + dan kemudian navItem. 92 00:05:01,820 --> 00:05:05,230 ‫Jadi di sini tautannya adalah tautan kosong. 93 00:05:05,230 --> 00:05:07,520 ‫Dan sebenarnya untuk mereka semua untuk saat ini. 94 00:05:07,520 --> 00:05:08,353 ‫Kemudian 95 00:05:09,780 --> 00:05:10,623 ‫Pengaturan, lalu 96 00:05:12,420 --> 00:05:14,980 ‫nama ikon yang juga pengaturan, tetapi 97 00:05:14,980 --> 00:05:16,083 ‫dalam huruf kecil. 98 00:05:18,341 --> 00:05:21,060 ‫Dan akhirnya yang ini benar-benar aktif, jadi 99 00:05:21,060 --> 00:05:22,323 ‫kami memasukkan true. 100 00:05:25,541 --> 00:05:28,057 ‫Baiklah, mari kita duplikat. 101 00:05:31,710 --> 00:05:36,513 ‫Miliki tas kerja dan kami memiliki Pemesanan Saya. 102 00:05:37,680 --> 00:05:39,490 ‫Mari kita buat huruf kecil itu. 103 00:05:39,490 --> 00:05:43,090 ‫Baiklah, duplikat dua kali lagi. 104 00:05:43,090 --> 00:05:44,480 ‫Jadi di sini 105 00:05:48,360 --> 00:05:49,990 ‫kita memiliki bintang dan 106 00:05:53,600 --> 00:05:56,423 ‫kemudian di sini kartu kredit untuk penagihan. 107 00:05:59,550 --> 00:06:00,383 ‫Baiklah. 108 00:06:04,270 --> 00:06:06,820 ‫Dan sekarang kita memiliki navigasi admin. 109 00:06:06,820 --> 00:06:08,560 ‫Dan yang ini hanya 110 00:06:08,560 --> 00:06:11,660 ‫akan terlihat jika pengguna saat ini adalah administrator. 111 00:06:11,660 --> 00:06:15,660 ‫Jadi, mari kita definisikan itu menggunakan pernyataan if. 112 00:06:15,660 --> 00:06:18,370 ‫Jadi di sini kita perlu menguji apakah peran 113 00:06:18,370 --> 00:06:20,360 ‫pengguna sama dengan admin, bukan? 114 00:06:20,360 --> 00:06:21,270 ‫Dan itu, 115 00:06:21,270 --> 00:06:23,450 ‫sekali lagi, salah satu dari pernyataan if yang 116 00:06:23,450 --> 00:06:26,410 ‫lebih kompleks dan jadi kita harus menggunakan JavaScript untuk itu. 117 00:06:26,410 --> 00:06:29,441 ‫Jadi saya menggunakan kode unbuffered di sini lagi. 118 00:06:29,441 --> 00:06:30,640 ‫Dan kemudian jika 119 00:06:32,560 --> 00:06:35,710 ‫dan kita akan memiliki akses ke variabel pengguna di sini. 120 00:06:35,710 --> 00:06:38,290 ‫Jadi seperti yang kami lakukan di template lain. 121 00:06:38,290 --> 00:06:41,200 ‫Jadi pada dasarnya kita akan menyebarkannya ke sini. 122 00:06:41,200 --> 00:06:44,750 ‫Dan tentu saja, pengguna memiliki atribut role, jadi 123 00:06:44,750 --> 00:06:47,210 ‫kami menguji apakah itu admin. 124 00:06:47,210 --> 00:06:51,230 ‫Dan jika sudah maka kita ingin menampilkan semua ini. 125 00:06:51,230 --> 00:06:54,963 ‫Jadi sekarang perlu satu tingkat menjorok. 126 00:06:56,760 --> 00:06:57,593 ‫Oke? 127 00:06:57,593 --> 00:07:00,270 ‫Dan tentu saja sekarang kami ingin mengganti 128 00:07:00,270 --> 00:07:03,023 ‫semua ini di sini dengan mixin kami juga. 129 00:07:07,900 --> 00:07:09,083 ‫Jadi empat kali. 130 00:07:10,370 --> 00:07:13,003 ‫Yang ini disebut peta. 131 00:07:14,380 --> 00:07:15,613 ‫Kelola tur. 132 00:07:23,350 --> 00:07:24,823 ‫Yang ini adalah Kelola pengguna. 133 00:07:38,080 --> 00:07:39,323 ‫Kelola ulasan. 134 00:07:41,400 --> 00:07:43,800 ‫Dan akhirnya kita punya satu dengan koper. 135 00:07:46,450 --> 00:07:49,030 ‫Dan yang ini tidak memiliki teks di sini, 136 00:07:49,030 --> 00:07:50,723 ‫tetapi ini adalah Kelola pemesanan. 137 00:07:55,548 --> 00:07:56,830 ‫Baiklah. 138 00:07:56,830 --> 00:08:01,830 ‫Jadi mari kita singkirkan itu dan lanjutkan pekerjaan kita di sini. 139 00:08:01,850 --> 00:08:03,830 ‫Jadi yang ini di sini 140 00:08:03,830 --> 00:08:06,130 ‫akan menjadi formulir untuk mengubah pengaturan pengguna. 141 00:08:06,130 --> 00:08:10,600 ‫Dan data pribadi akan berada di sini dalam nilai-nilai ini, oke? 142 00:08:10,600 --> 00:08:14,460 ‫Jadi pada dasarnya dalam elemen input HTML, nilainya adalah jenis 143 00:08:14,460 --> 00:08:17,300 ‫teks yang telah ditentukan sebelumnya yang 144 00:08:17,300 --> 00:08:20,220 ‫dapat kita masukkan ke dalam elemen input. 145 00:08:20,220 --> 00:08:21,690 ‫Dan biasanya apa yang kita masukkan 146 00:08:21,690 --> 00:08:23,930 ‫di sana adalah nilai saat ini dari input itu, 147 00:08:23,930 --> 00:08:25,160 ‫jadi dari bidang itu. 148 00:08:25,160 --> 00:08:28,780 ‫Dan sekarang, itu tentu saja nama pengguna. 149 00:08:28,780 --> 00:08:30,130 ‫Jadi mari kita taruh itu di sini. 150 00:08:34,940 --> 00:08:36,480 ‫Pengguna. nama. 151 00:08:36,480 --> 00:08:40,202 ‫Dan kemudian di sini tentu 152 00:08:40,202 --> 00:08:42,693 ‫saja email. 153 00:08:45,610 --> 00:08:49,343 ‫Dan di sini kita juga memiliki gambar pengguna. 154 00:08:54,060 --> 00:08:59,060 ‫Jadi pengguna garis miring gambar memangkas nama gambar itu sendiri. 155 00:09:01,610 --> 00:09:02,443 ‫Oke. 156 00:09:04,350 --> 00:09:06,783 ‫Lalu di bawah sini tidak ada yang bisa dilakukan. 157 00:09:07,720 --> 00:09:08,670 ‫Baiklah? 158 00:09:08,670 --> 00:09:10,470 ‫Dan sebenarnya hanya itu. 159 00:09:10,470 --> 00:09:12,640 ‫Jadi itu benar-benar semua data yang 160 00:09:12,640 --> 00:09:14,620 ‫berasal dari objek pengguna yang 161 00:09:14,620 --> 00:09:15,823 ‫harus kita masukkan. 162 00:09:17,300 --> 00:09:20,110 ‫Oke, itu dia templatenya. 163 00:09:20,110 --> 00:09:25,110 ‫Sekarang mari kita lanjutkan dan tambahkan rute ke viewRouter. 164 00:09:25,460 --> 00:09:29,813 ‫Jadi di sini, dan yang ini akan dipanggil /me. 165 00:09:32,480 --> 00:09:35,560 ‫Jadi kita akan memiliki pengontrol bernama getAccount. 166 00:09:37,940 --> 00:09:39,330 ‫Nah, yang ini, 167 00:09:39,330 --> 00:09:42,470 ‫tentu saja, akan menjadi rute yang dilindungi, bukan? 168 00:09:42,470 --> 00:09:45,240 ‫Karena hanya jika kita benar-benar login 169 00:09:45,240 --> 00:09:48,260 ‫maka kita akan mendapatkan akses ke halaman ini. 170 00:09:48,260 --> 00:09:52,020 ‫Jadi kita perlu menggunakan middleware pelindung kita di sini. 171 00:09:52,020 --> 00:09:55,973 ‫Jadi itu adalah authController. melindungi. 172 00:09:57,360 --> 00:09:58,730 ‫Oke? 173 00:09:58,730 --> 00:10:02,100 ‫Jadi seperti yang kami lakukan dengan semua atau rute yang dilindungi lainnya. 174 00:10:02,100 --> 00:10:04,500 ‫Sekarang satu masalah yang saya lihat 175 00:10:04,500 --> 00:10:06,560 ‫dengan ini adalah bahwa melindungi 176 00:10:06,560 --> 00:10:09,280 ‫middleware di sini sangat mirip dengan isLoggedIn. 177 00:10:09,280 --> 00:10:12,270 ‫Jadi kami benar-benar akan melakukan beberapa operasi duplikat di 178 00:10:12,270 --> 00:10:13,610 ‫sana, yang tidak ideal. 179 00:10:13,610 --> 00:10:16,500 ‫Karena ingat bahwa isLoggedIn ini 180 00:10:16,500 --> 00:10:19,930 ‫akan berjalan untuk semua permintaan, bukan? 181 00:10:19,930 --> 00:10:22,400 ‫Jadi mari kita cepat melihat ini sehingga 182 00:10:22,400 --> 00:10:24,203 ‫saya dapat membuat poin saya. 183 00:10:25,300 --> 00:10:30,300 ‫Jadi dalam melindungi kita mendapatkan pengguna saat ini di sini. 184 00:10:30,720 --> 00:10:33,020 ‫Jadi kami memiliki findById ini di sini. 185 00:10:33,020 --> 00:10:34,580 ‫Tapi kami melakukan 186 00:10:36,757 --> 00:10:39,650 ‫hal yang sama di sini saat login, oke? 187 00:10:39,650 --> 00:10:44,010 ‫Jadi dengan menggunakan isLoggedIn dan melindungi pada saat yang sama, kami akan melakukan 188 00:10:44,010 --> 00:10:45,720 ‫kueri ini dua kali. 189 00:10:45,720 --> 00:10:48,410 ‫Dan itu tentu saja tidak ideal. 190 00:10:48,410 --> 00:10:51,980 ‫Jadi mari kita letakkan isLoggedIn di sini hanya 191 00:10:51,980 --> 00:10:55,210 ‫di bawah rute yang tidak dilindungi, oke? 192 00:10:55,210 --> 00:10:56,660 ‫Karena pada 193 00:10:56,660 --> 00:10:58,690 ‫jalur terproteksi ini pemeriksaan apakah 194 00:10:58,690 --> 00:11:02,270 ‫pengguna sudah login akan benar-benar terjadi juga, kan? 195 00:11:02,270 --> 00:11:03,870 ‫Tapi tidak di middleware ini, 196 00:11:03,870 --> 00:11:05,450 ‫tapi kemudian di 197 00:11:05,450 --> 00:11:09,000 ‫protect middleware karena pada dasarnya memeriksa itu juga, kan? 198 00:11:09,000 --> 00:11:12,573 ‫Jadi mari kita potong dari sini dan cukup tempel 199 00:11:12,573 --> 00:11:15,393 ‫di rute lain yang tidak dilindungi. 200 00:11:18,550 --> 00:11:20,300 ‫Oke, masuk akal? 201 00:11:20,300 --> 00:11:23,340 ‫Jadi seperti ini kami tidak memiliki masalah ini 202 00:11:23,340 --> 00:11:26,400 ‫pada dasarnya melakukan permintaan yang sama persis dua kali 203 00:11:26,400 --> 00:11:28,580 ‫di semua middlewares yang dilindungi. 204 00:11:28,580 --> 00:11:31,680 ‫Dan itu sedikit lebih baik untuk kinerja kami. 205 00:11:31,680 --> 00:11:34,722 ‫Sekarang satu hal yang kami lakukan di isLoggedIn 206 00:11:34,722 --> 00:11:36,900 ‫yang saat ini tidak kami 207 00:11:36,900 --> 00:11:39,880 ‫lakukan di lindungi adalah ini di sini. 208 00:11:39,880 --> 00:11:43,510 ‫Jadi kami menempatkan pengguna saat ini pada respons. penduduk setempat. 209 00:11:43,510 --> 00:11:45,534 ‫Jadi mari kita lakukan 210 00:11:45,534 --> 00:11:48,220 ‫hal yang sama sekarang di currentUser. 211 00:11:48,220 --> 00:11:51,543 ‫Jadi mari kita lakukan hal yang sama di sini di middleware protect. 212 00:11:53,020 --> 00:11:56,510 ‫Jadi Anda menempatkan currentUser keduanya berdasarkan permintaan. pengguna dan pada 213 00:11:56,510 --> 00:11:59,590 ‫respon. penduduk setempat, oke? 214 00:11:59,590 --> 00:12:01,600 ‫Sehingga kita dapat menggunakannya 215 00:12:01,600 --> 00:12:03,690 ‫secara otomatis di semua template setelahnya. 216 00:12:03,690 --> 00:12:07,560 ‫Jadi dalam hal ini, dalam template akun kita, oke? 217 00:12:07,560 --> 00:12:08,693 ‫Jadi, simpanlah. 218 00:12:10,080 --> 00:12:14,040 ‫Dan sekarang kita perlu menambahkan pengontrol getAccount ini untuk, 219 00:12:14,040 --> 00:12:16,903 ‫tentu saja, memperbaiki kesalahan yang kita dapatkan 220 00:12:16,903 --> 00:12:18,293 ‫saat ini. 221 00:12:19,450 --> 00:12:20,900 ‫Jadi itu di viewsController,. permintaan dan tanggapan getAccount. 222 00:12:27,467 --> 00:12:32,467 ‫Dan Anda akan melihat sebentar lagi mengapa kita hanya membutuhkan keduanya. 223 00:12:34,370 --> 00:12:37,170 ‫Jadi untuk mendapatkan halaman akun, yang perlu kita lakukan 224 00:12:38,100 --> 00:12:39,580 ‫hanyalah merender halaman itu. 225 00:12:39,580 --> 00:12:43,370 ‫Kami bahkan tidak perlu menanyakan pengguna saat ini 226 00:12:43,370 --> 00:12:45,910 ‫karena itu sudah dilakukan di 227 00:12:45,910 --> 00:12:47,760 ‫middleware pelindung, bukan? 228 00:12:47,760 --> 00:12:50,030 ‫Dan yang benar-benar perlu kita lakukan adalah 229 00:12:50,030 --> 00:12:51,810 ‫melakukan sesuatu seperti ini. 230 00:12:51,810 --> 00:12:54,110 ‫Jadi salin kode ini, lalu 231 00:12:54,110 --> 00:12:55,870 ‫di sini akun. 232 00:12:55,870 --> 00:12:59,030 ‫Dan beri judul akun Anda. 233 00:12:59,030 --> 00:13:04,030 ‫Baiklah, jadi itu membuat kesalahan itu hilang. 234 00:13:04,430 --> 00:13:07,840 ‫Dan sekarang sebagai bagian terakhir dari teka-teki, mari tambahkan tautan 235 00:13:07,840 --> 00:13:09,880 ‫yang benar, sebenarnya, di header. 236 00:13:09,880 --> 00:13:13,063 ‫Jadi di sini, di header kami sekarang, tautannya 237 00:13:15,000 --> 00:13:18,110 ‫tidak mengarah ke halaman akun ini, bukan? 238 00:13:18,110 --> 00:13:21,670 ‫Jadi itu menunjuk ke mana-mana. 239 00:13:21,670 --> 00:13:24,043 ‫Dan sekarang seharusnya menunjuk ke /me. 240 00:13:25,110 --> 00:13:27,713 ‫Oke, dan itu harus 241 00:13:28,820 --> 00:13:32,380 ‫menjadi bagian terakhir untuk benar-benar membuatnya bekerja. 242 00:13:32,380 --> 00:13:33,763 ‫Jadi mari masuk ke sini 243 00:13:34,980 --> 00:13:36,840 ‫sekarang dengan uji satu, dua, tiga, empat. 244 00:13:38,281 --> 00:13:40,513 ‫Kami berhasil login. 245 00:13:42,050 --> 00:13:44,320 ‫Dan sekarang setelah mengklik di sini kita mendapatkan halaman kita. 246 00:13:44,320 --> 00:13:48,950 ‫Fantastis. 247 00:13:48,950 --> 00:13:50,590 ‫Sekarang ada satu kesalahan di sini dengan foto Pengguna. 248 00:13:50,590 --> 00:13:54,030 ‫Jadi mari kita perbaiki itu. 249 00:13:54,030 --> 00:13:55,270 ‫Tapi selain itu, sebenarnya semuanya berfungsi dengan baik. 250 00:13:55,270 --> 00:13:59,460 ‫Kami juga mendapatkan menu ini di sini karena kami sedang dalam 251 00:13:59,460 --> 00:14:03,750 ‫admin dan jadi mari kita uji itu juga dalam sedetik untuk melihat 252 00:14:03,750 --> 00:14:06,370 ‫apakah itu menghilang untuk pengguna lain. 253 00:14:06,370 --> 00:14:08,903 ‫Dan sebenarnya kami juga mendapatkan kesalahan ini 254 00:14:11,180 --> 00:14:14,150 ‫di sini karena kami memiliki permintaan gambar yang gagal. 255 00:14:14,150 --> 00:14:17,500 ‫Jadi kita sudah melihat bahwa kita mungkin melakukan sesuatu 256 00:14:17,500 --> 00:14:19,070 ‫yang salah di sana. 257 00:14:19,070 --> 00:14:20,920 ‫Jadi di sini, 258 00:14:22,070 --> 00:14:25,860 ‫di gambar, tentu saja, itu bukan pengguna. nama, itu adalah pengguna. foto. 259 00:14:25,860 --> 00:14:30,500 ‫Jadi simpan itu, muat ulang di sini. 260 00:14:30,500 --> 00:14:33,670 ‫Dan sekarang memang, di sana kita pergi. 261 00:14:33,670 --> 00:14:35,483 ‫Baiklah? 262 00:14:36,840 --> 00:14:37,673 ‫Jadi sekarang mari kita logout, lihat apa yang terjadi kemudian. 263 00:14:37,673 --> 00:14:41,200 ‫Dan kemudian kita mendapatkan kesalahan semacam ini. 264 00:14:41,200 --> 00:14:43,460 ‫Dan itu pada dasarnya karena kami 265 00:14:43,460 --> 00:14:46,200 ‫mencoba mengakses rute yang dilindungi ini saat tidak masuk. 266 00:14:46,200 --> 00:14:49,417 ‫Baiklah? 267 00:14:49,417 --> 00:14:50,250 ‫Jadi mari kita coba lagi sekarang. 268 00:14:51,470 --> 00:14:54,540 ‫Jadi jika kami mencoba masuk 269 00:14:54,540 --> 00:14:58,720 ‫dengan /me, maka kami mendapatkan Anda tidak masuk, oke? 270 00:14:58,720 --> 00:15:01,920 ‫Dan sebelum kami mendapatkan kesalahan yang tampak aneh 271 00:15:01,920 --> 00:15:04,550 ‫karena kami sebenarnya sedang dalam pengembangan. 272 00:15:04,550 --> 00:15:07,070 ‫Tetapi dalam produksi, tentu saja, kami tidak akan melihat kesalahan aneh 273 00:15:07,070 --> 00:15:08,290 ‫yang kami lihat sebelumnya. 274 00:15:08,290 --> 00:15:11,850 ‫Benar? 275 00:15:11,850 --> 00:15:12,710 ‫Tapi apa 276 00:15:12,710 --> 00:15:15,410 ‫yang kita lihat sekarang, tentu saja, rute kita benar-benar terlindungi. 277 00:15:15,410 --> 00:15:16,930 ‫Jadi kita tidak bisa mengaksesnya jika kita tidak login. 278 00:15:16,930 --> 00:15:20,090 ‫Sekarang hanya untuk menyelesaikan, mari kita benar-benar masuk dengan beberapa 279 00:15:20,090 --> 00:15:21,270 ‫akun lain hanya 280 00:15:21,270 --> 00:15:23,750 ‫untuk melihat apakah bagian administrator juga berfungsi. 281 00:15:23,750 --> 00:15:28,390 ‫Jadi mari, sekali lagi, gunakan Laura di sini. 282 00:15:28,390 --> 00:15:31,320 ‫Dan Anda melihat bahwa dia hanyalah pengguna biasa. 283 00:15:31,320 --> 00:15:33,520 ‫Baiklah. 284 00:15:41,620 --> 00:15:42,543 ‫Dan sekarang 285 00:15:44,780 --> 00:15:47,950 ‫kita mendapatkan user account-nya, tanpa menu admin tentunya. 286 00:15:47,950 --> 00:15:49,740 ‫Oke, sempurna. 287 00:15:49,740 --> 00:15:51,380 ‫Jadi itu adalah membangun halaman akun. 288 00:15:51,380 --> 00:15:53,570 ‫Dan seperti yang saya katakan sebelumnya, 289 00:15:53,570 --> 00:15:55,830 ‫di video berikutnya, kami akan benar-benar 290 00:15:55,830 --> 00:15:57,700 ‫memperbarui pengaturan akun ini.