1
00:00:01,240 --> 00:00:02,660
‫Instruktur: Dan sebelum

2
00:00:02,660 --> 00:00:05,610
‫memulai, mari kita lakukan rekap cepat rendering sisi

3
00:00:05,610 --> 00:00:07,440
‫server dan sisi klien.

4
00:00:07,440 --> 00:00:09,860
‫Dan juga, saya ingin menunjukkan kepada Anda dalam video

5
00:00:09,860 --> 00:00:12,850
‫ini situs web yang dirender di sisi server yang akan kita bangun

6
00:00:12,850 --> 00:00:14,393
‫selama beberapa jam ke depan.

7
00:00:15,670 --> 00:00:18,680
‫Jadi, ingat bagaimana dalam rendering sisi klien,

8
00:00:18,680 --> 00:00:20,600
‫pembangunan situs web yang

9
00:00:20,600 --> 00:00:22,720
‫sebenarnya terjadi di sisi klien.

10
00:00:22,720 --> 00:00:25,330
‫Dan untuk itu, kita membutuhkan sumber

11
00:00:25,330 --> 00:00:27,722
‫data, yang biasanya berupa API

12
00:00:27,722 --> 00:00:30,590
‫yang mengirimkan data ke klien sesuai permintaan.

13
00:00:30,590 --> 00:00:32,600
‫Jadi, itulah yang telah kami bangun hingga

14
00:00:32,600 --> 00:00:34,490
‫saat ini dalam kursus ini.

15
00:00:34,490 --> 00:00:36,750
‫Tapi sekarang setelah Anda menguasai

16
00:00:36,750 --> 00:00:39,900
‫bagian itu, saatnya untuk beralih ke rendering sisi

17
00:00:39,900 --> 00:00:43,030
‫server dan benar-benar membangun situs web di server.

18
00:00:43,030 --> 00:00:45,780
‫Dan aspek utama dari rendering sisi server

19
00:00:45,780 --> 00:00:47,930
‫adalah membangun HTML yang

20
00:00:47,930 --> 00:00:52,140
‫sebenarnya, pada dasarnya karena di sanalah semua data kita akan disimpan.

21
00:00:52,140 --> 00:00:54,480
‫Dan untuk melakukan itu, kami menggunakan

22
00:00:54,480 --> 00:00:56,090
‫templat, yang memiliki tempat

23
00:00:56,090 --> 00:00:59,960
‫penampung di mana kami kemudian akan menyuntikkan data kami seperlunya.

24
00:00:59,960 --> 00:01:02,200
‫Jadi, setiap kali ada permintaan,

25
00:01:02,200 --> 00:01:04,170
‫katakanlah untuk beranda,

26
00:01:04,170 --> 00:01:07,172
‫kami kemudian mendapatkan data yang diperlukan dari

27
00:01:07,172 --> 00:01:09,280
‫database, menyuntikkannya ke dalam template,

28
00:01:09,280 --> 00:01:11,410
‫yang kemudian akan menampilkan HTML,

29
00:01:11,410 --> 00:01:13,610
‫dan akhirnya mengirim HTML itu,

30
00:01:13,610 --> 00:01:15,890
‫bersama dengan CSS dan JavaScript

31
00:01:15,890 --> 00:01:18,990
‫dan file gambar , kembali ke klien.

32
00:01:18,990 --> 00:01:21,320
‫Cukup langsung, bukan?

33
00:01:21,320 --> 00:01:24,290
‫Sekarang, kita masih bisa menggunakan API untuk

34
00:01:24,290 --> 00:01:26,640
‫beberapa hal di front

35
00:01:26,640 --> 00:01:29,840
‫end, dan sebenarnya, kita juga akan melakukannya.

36
00:01:29,840 --> 00:01:32,600
‫Oke, bagaimanapun, izinkan saya menunjukkan kepada Anda apa yang

37
00:01:32,600 --> 00:01:35,150
‫sebenarnya akan kita bangun di bagian ini.

38
00:01:36,690 --> 00:01:39,900
‫Jadi, ini adalah situs web Natours yang telah dirender terakhir, dan

39
00:01:39,900 --> 00:01:44,000
‫sebenarnya ada di www. alam. dev, dan jika Anda

40
00:01:44,000 --> 00:01:45,360
‫mau, langsung saja

41
00:01:45,360 --> 00:01:46,193
‫buka

42
00:01:46,193 --> 00:01:48,150
‫halaman ini di browser Anda

43
00:01:48,150 --> 00:01:49,500
‫sekarang, dan lihatlah.

44
00:01:49,500 --> 00:01:52,360
‫Anda harus menentukan W-W-W ini, oke?

45
00:01:52,360 --> 00:01:54,320
‫Jika tidak, itu tidak akan berhasil.

46
00:01:54,320 --> 00:01:56,760
‫Bagaimanapun, di sini Anda melihat semua tur

47
00:01:56,760 --> 00:01:58,060
‫yang telah kami

48
00:01:58,060 --> 00:02:00,020
‫kerjakan saat kami membangun API

49
00:02:00,020 --> 00:02:02,940
‫kami, dan semua data di sini benar-benar sama persis.

50
00:02:02,940 --> 00:02:06,133
‫Jadi, kesembilan tur kami ada di sini,

51
00:02:07,010 --> 00:02:07,920
‫kan,

52
00:02:07,920 --> 00:02:09,800
‫dan sekali lagi, inilah

53
00:02:09,800 --> 00:02:12,700
‫yang akan kami bangun di bagian ini.

54
00:02:12,700 --> 00:02:16,000
‫Mari kita lihat salah satu halaman detailnya di sini.

55
00:02:16,000 --> 00:02:18,100
‫Jadi, Park Camper,

56
00:02:18,100 --> 00:02:21,170
‫dan memang, Anda memiliki peringkat rata-rata.

57
00:02:21,170 --> 00:02:22,773
‫Anda memiliki semua pemandu wisata.

58
00:02:24,030 --> 00:02:25,600
‫Anda memiliki beberapa gambar.

59
00:02:25,600 --> 00:02:29,870
‫Anda memiliki semua lokasi dan ditampilkan di peta, sebenarnya.

60
00:02:29,870 --> 00:02:31,610
‫Dan Anda juga memiliki ulasan.

61
00:02:31,610 --> 00:02:34,060
‫Dan ini, sekali lagi, adalah

62
00:02:34,060 --> 00:02:37,380
‫ulasan nyata yang datang dari pengguna nyata di database.

63
00:02:37,380 --> 00:02:39,940
‫Jadi, jika Anda ingin melihat tur ini

64
00:02:39,940 --> 00:02:41,363
‫di Postman, katakanlah,

65
00:02:43,500 --> 00:02:46,250
‫jadi mari dapatkan semua tur di sini

66
00:02:47,980 --> 00:02:51,100
‫terlebih dahulu hanya untuk mendapatkan ID Park Camper.

67
00:02:51,100 --> 00:02:52,393
‫Jadi, Penjelajah Laut,

68
00:02:55,770 --> 00:02:57,003
‫Pengembara Kota,

69
00:02:58,180 --> 00:02:59,880
‫jadi di mana itu?

70
00:02:59,880 --> 00:03:01,233
‫Ah, ini Park Camper.

71
00:03:02,170 --> 00:03:04,123
‫Jadi, jika kita mendapatkan tur ini sekarang,

72
00:03:08,950 --> 00:03:10,650
‫maka Anda akan melihat bahwa,

73
00:03:10,650 --> 00:03:12,690
‫misalnya, pemandu wisata adalah orang yang sama persis.

74
00:03:12,690 --> 00:03:15,123
‫Jadi, ada Aarav, Ben, dan

75
00:03:16,130 --> 00:03:19,410
‫Kate, dan memang, mereka adalah orang-orang yang sebenarnya

76
00:03:19,410 --> 00:03:21,080
‫adalah pemandu wisata.

77
00:03:21,080 --> 00:03:22,730
‫Jadi,

78
00:03:22,730 --> 00:03:25,210
‫ketiganya, dan sekali lagi,

79
00:03:25,210 --> 00:03:29,890
‫ulasannya juga dari Ayla, Laura, Isabel, dan Alexander,

80
00:03:29,890 --> 00:03:33,690
‫ditambah yang lain di sana juga.

81
00:03:33,690 --> 00:03:36,640
‫Jadi, jika kita melihat ulasan di

82
00:03:36,640 --> 00:03:38,807
‫sini, maka memang,

83
00:03:38,807 --> 00:03:43,090
‫mereka berasal dari Ayla dan Laura dan Isabel dan...

84
00:03:43,090 --> 00:03:46,150
‫Ya, jadi sungguh, Anda melihat bahwa data

85
00:03:46,150 --> 00:03:48,520
‫ini benar-benar data yang

86
00:03:48,520 --> 00:03:53,023
‫mendasari dari mana situs web ini dihasilkan secara dinamis, oke?

87
00:03:54,140 --> 00:03:56,260
‫Kemudian, kita juga bisa masuk, dan

88
00:03:56,260 --> 00:03:57,890
‫salah satu pengguna yang

89
00:03:57,890 --> 00:04:00,353
‫kita miliki di database akan bekerja untuk itu.

90
00:04:01,750 --> 00:04:04,723
‫Jadi, jika kita melihat salah satu pengguna kita, jadi,

91
00:04:06,430 --> 00:04:08,620
‫misalnya, mari kita gunakan Steve di sini,

92
00:04:08,620 --> 00:04:10,593
‫yang sebenarnya adalah pemandu wisata.

93
00:04:12,690 --> 00:04:14,093
‫Jadi, kita ambil

94
00:04:16,600 --> 00:04:17,630
‫contoh,

95
00:04:17,630 --> 00:04:19,563
‫gunakan email, dan kata

96
00:04:21,010 --> 00:04:23,010
‫sandinya, seperti biasa, test1234.

97
00:04:23,010 --> 00:04:25,070
‫Oke, jadi kami masuk, dan ini

98
00:04:25,070 --> 00:04:26,880
‫sebenarnya terjadi di balik layar

99
00:04:26,880 --> 00:04:28,390
‫menggunakan API kami.

100
00:04:28,390 --> 00:04:31,120
‫Oke, dan sekarang, di sini kita memiliki Steve.

101
00:04:31,120 --> 00:04:33,663
‫Kita bahkan bisa membuka akunnya.

102
00:04:35,620 --> 00:04:37,780
‫Kami kemudian dapat mengubah kata sandi,

103
00:04:37,780 --> 00:04:39,720
‫dan itu, sekali lagi, akan

104
00:04:39,720 --> 00:04:42,840
‫terjadi di balik layar menggunakan titik akhir API persis

105
00:04:42,840 --> 00:04:46,083
‫yang kami buat untuk pengguna yang mengubah kata sandinya.

106
00:04:47,830 --> 00:04:49,610
‫Anda kemudian juga dapat memeriksa

107
00:04:49,610 --> 00:04:51,460
‫pemesanan pengguna tertentu ini, yang dalam

108
00:04:51,460 --> 00:04:53,180
‫hal ini, tidak boleh

109
00:04:53,180 --> 00:04:55,170
‫ada karena dia adalah pemandu wisata.

110
00:04:55,170 --> 00:04:56,773
‫Jadi, Anda lihat di sini kosong,

111
00:04:57,900 --> 00:04:58,970
‫tapi bagaimanapun juga...

112
00:04:59,830 --> 00:05:01,520
‫Ya, itulah yang ingin

113
00:05:01,520 --> 00:05:03,800
‫saya tunjukkan kepada Anda karena inilah yang

114
00:05:03,800 --> 00:05:06,130
‫akan kita lakukan sepanjang sisa bagian ini.

115
00:05:06,130 --> 00:05:07,980
‫Jadi, saya harap Anda bersemangat tentang

116
00:05:07,980 --> 00:05:09,000
‫itu, seperti saya,

117
00:05:09,000 --> 00:05:10,573
‫dan sekarang mari kita mulai.