‫Jonas: Selamat datang kembali, jadi
‫sekarang saatnya untuk mulai membangun API kami.
‫Jadi kuliah ini benar-benar akan menjadi
‫langkah pertama dalam perjalanan panjang membangun proyek kursus utama ini.
‫Dan izinkan saya memulai dengan menunjukkan lagi
‫proyek yang sedang kita bicarakan.
‫Jadi ini adalah proyek Natours.
‫Ini pada dasarnya adalah sebuah
‫aplikasi di mana kita dapat melihat tur dan juga memesannya.
‫Kami dapat membuat akun pengguna, kami dapat masuk, dan
‫benar-benar melakukan segala macam hal yang berbeda.
‫Jadi misalnya, kita bisa melihat tur di sini.
‫Ini memiliki semua detail ini, peta
‫ini, memiliki ulasan dari pengguna lain yang menggunakan platform, dan kami bahkan
‫dapat memesan tur saat itu.
‫Kita harus masuk sebelum dapat memesan dan saya tidak
‫akan melakukannya sekarang karena
‫ini hanya demo yang sangat sederhana di sini,
‫jadi saya hanya ingin menunjukkan kepada Anda antarmuka grafis
‫ini, pada dasarnya, dari proyek yang sedang kita bangun .
‫Sekarang bagian yang Anda lihat di
‫sini sebenarnya adalah bagian yang akan kita
‫bangun di akhir
‫kursus, karena bagian pertama kursus ini
‫adalah membangun API menggunakan data yang sama persis dengan yang
‫Anda lihat di sini di dinamika ini situs web.
‫Jadi sekali lagi, kita
‫mulai dengan membangun API dan kemudian situs web yang dirender secara
‫dinamis, dan saya memilih
‫untuk melakukannya seperti ini karena
‫dengan cara ini, kita tidak perlu mencampur semua konten
‫yang berbeda ini bersama-sama, jadi untuk mempelajari Express dan Mongodb dan Mongoose,
‫saya merasa lebih mudah untuk hanya bekerja dengan
‫data dan tidak perlu khawatir tentang hal-hal grafis,
‫meskipun itu mungkin sedikit lebih menarik karena
‫Anda bisa melihat hasil nyata dalam antarmuka yang
‫indah ini.
‫Tapi untuk belajar, lebih baik lagi, cukup
‫berurusan dengan data itu
‫sendiri dan khawatir membuatnya indah nanti.
‫Oke, jadi izinkan saya menunjukkan kepada Anda API juga.
‫Dan untuk itu tentunya saya menggunakan Postman.
‫Buat tab baru di sini.
‫Jadi API terakhir yang kami akses di
‫slash API, slash versi satu, dan kemudian
‫misalnya, kami dapat melihat tur.
‫Jadi kami menggunakan permintaan
‫get dan kemudian kami mendapatkan semua tur yang berbeda ini.
‫Benar, sekali lagi, tur yang sama
‫persis yang Anda lihat di
‫antarmuka grafis, jadi di situs web yang dirender sebelumnya.
‫Oke, kita juga dapat melanjutkan, mengambil ID, dan hanya meminta ID
‫itu, jadi dalam tur itu untuk ID itu, dan jadi Anda lihat bahwa sekarang
‫kami hanya memiliki satu ini di sini dengan lebih
‫banyak data daripada sebelumnya.
‫Jadi kami punya lokasi
‫awal di sini, kami memiliki pemandu wisata yang pada gilirannya memiliki
‫ID lain, kami memiliki lokasi, kami memiliki ulasan, jadi
‫semua itu kami miliki dalam tur.
‫Jadi Anda tahu, ini adalah hal yang
‫sangat canggih dan kami sebenarnya memiliki lebih dari sekadar tur.
‫Kami memiliki pengguna tetapi kami tidak akan dapat
‫mengaksesnya karena kami perlu diautentikasi.
‫Jadi Anda belum masuk dan sekarang, kami
‫harus masuk ke aplikasi kami.
‫Sekarang pada titik ini, saya akan berhenti
‫menunjukkan kepada Anda semua fitur karena kami
‫akan membangun ini
‫di sepanjang kursus, hanya untuk menunjukkan kepada Anda bahwa ada banyak
‫hal yang terjadi di sini sehingga ada banyak materi dan hal
‫yang harus dipelajari di depan Anda, jadi
‫saya harap Anda bersemangat untuk
‫itu, dan Anda ingin mengambil langkah pertama bersama saya sekarang.
‫Jadi mari kita kembali dan menerapkan rute
‫wisata atau mulai menerapkannya, setidaknya.
‫Oke, jadi potongan kode ini di sini, kita tidak perlu
‫lagi, dan saya tidak menghapusnya, hanya mengomentarinya.
‫Jadi sekali lagi, kami menggunakan aplikasi. get karena
‫dalam kuliah ini,
‫kita akan mulai dengan
‫menangani permintaan get dan URL akan menjadi slash API dan tur.
‫Jadi saya tidak
‫menggunakan v1, saya bisa langsung
‫menggunakan v1, jadi sebaiknya tentukan versi API.
‫Oke, jadi jika Anda ingin
‫melakukan beberapa perubahan pada
‫API Anda, Anda bisa melakukannya tetapi cukup pada
‫v2 tanpa merusak semua orang yang masih menggunakan v1.
‫Oke, jadi pada dasarnya, Anda dapat membuat
‫cabang, membuat versi baru API
‫Anda, tetapi semua pengguna masih dapat menggunakannya.
‫Jika kami melakukannya
‫seperti ini dan Anda melakukan perubahan kemudian ke tur
‫slash API, maka pengguna
‫yang mulai menggunakannya sebelum Anda melakukan perubahan akan mengalami beberapa masalah.
‫Oke, jadi kita harus selalu menentukan versi API.
‫Kita juga bisa melakukannya
‫di subdomain, tetapi lebih mudah dengan memasukkannya ke dalam URL.
‫Oke, dan tentu saja, pengendali rute kami.
‫Jadi ini adalah bagaimana kita biasanya memanggil fungsi ini.
‫Kami menyebutnya pengendali rute.
‫Oke, jadi hanya untuk membiasakan diri dengan istilah Express ini.
‫Sekarang apa yang ingin kita lakukan ketika seseorang melewati rute ini?
‫Yah, kami hanya ingin mengirim kembali semua tur.
‫Jadi itu mirip dengan apa yang baru saja
‫kita pelajari di kuliah terakhir, kan.
‫Kami memiliki URL ini atau titik akhir ini, tur garis
‫miring, dan itu biasanya akan mengirim kembali semua data
‫untuk sumber daya itu, kan.
‫Jadi, tur juga merupakan sumbernya sekarang, dan saya mulai
‫dengan tur di
‫sini karena, menurut saya, ini yang
‫paling jelas karena kami sedang membangun situs web atau
‫aplikasi Web untuk menjual tur, kan.
‫Sekarang di mana kita sebenarnya
‫mendapatkan tur yang ingin kita kirim kembali ke klien?
‫Nah, ini ada di folder
‫dev-data, lalu data, dan kemudian tours-simple.
‫Jadi ini file JSON, dan sangat mirip
‫dengan yang kami miliki untuk
‫note farm, jadi sekali lagi, ini adalah array objek
‫JSON yang kemudian memiliki banyak data tentang setiap tur.
‫Dan ya,
‫itulah data yang akan kami kirimkan ke klien.
‫Sekarang sebelum kita
‫dapat mengirim data, kita sebenarnya perlu membacanya
‫terlebih dahulu dan sekali lagi, kita tidak melakukannya di dalam
‫route handler, tetapi kita melakukannya sebelumnya.
‫Oke, dan seperti yang saya jelaskan di proyek
‫sebelumnya, kita bisa melakukannya
‫karena kode level atas hanya dieksekusi sekali,
‫yaitu tepat setelah aplikasi startup, kan.
‫Dan sekarang setelah Anda mengetahui semua tentang
‫loop acara, itu lebih masuk akal bagi Anda pada saat ini, kan.
‫Jadi hanya fungsi panggilan balik ini, misalnya di sini, yang
‫akan berjalan di dalam loop acara dan
‫di sini, kita tidak dapat memiliki blok dan kode apa pun.
‫Tapi di luar, itu tidak masalah sama sekali.
‫Jadi itu cukup membaca tur ke dalam variabel
‫di luar semua ini secara sinkron.
‫Jadi fs, dan untuk itu,
‫tentu saja, kita benar-benar membutuhkan modul, jadi
‫kita melakukannya di sini di atas.
‫Dan saya suka selalu memulai dengan modul inti
‫dan saya melakukannya di bagian pertama.
‫Jadi perlu, fs, jadi
‫fs. readFileSync, sudah ada di sini.
‫Dan sekarang, mari kita gunakan dirname.
‫Dan sekali lagi,
‫pada titik ini, Anda sudah
‫tahu mengapa kami sebenarnya memiliki akses ke variabel ini di sini, jadi dirname adalah
‫folder tempat skrip saat ini berada,
‫dan itu adalah folder utama ini.
‫Jadi dari sini, kita perlu pindah ke dev-data,
‫lalu ke data, dan kemudian di
‫sana, kita punya tours-simple. json.
‫Oke, dan sekarang mari kita juga, tepat di langkah ini di
‫sini, mengurai hasil ini.
‫Jadi JSON, sebenarnya yang huruf besar,
‫jadi JSON. parse, sehingga JSON yang kita
‫miliki di sini secara otomatis akan dikonversi menjadi
‫objek Javascript atau array objek Javascript sebenarnya.
‫Jadi simpan dan ini akan memformat ulang dan sekarang yang harus
‫kita lakukan adalah
‫benar-benar mengirimkannya kembali ke klien, jadi
‫res. json,
‫dan izinkan saya benar-benar menentukan kode
‫status di sini, bahkan
‫jika 200 adalah standarnya, saya suka melakukannya di setiap respons.
‫Baiklah, jadi JSON, dan apa yang ingin kita kirim kembali sekarang?
‫Bukan pesan, itu pasti.
‫Jadi apa yang ingin kita kirim kembali?
‫Nah, ingat bahwa
‫kita akan menggunakan standar pemformatan Jsend JSON.
‫Oke, dan di sana, kami menentukan status,
‫dan status, dan itu
‫bisa sukses, gagal, atau error, oke.
‫Jadi sukses itu jelas.
‫Itu ketika kita memiliki kode 200 atau
‫201 atau benar-benar sembarang kode yang dimulai dengan 200.
‫Kemudian kita mengalami fail, yang merupakan kesalahan pada klien, dan
‫kemudian kita juga
‫mengalami kesalahan, ketika terjadi kesalahan pada server.
‫Baiklah, tapi kita akan menggunakannya nanti.
‫Bagaimanapun, kami juga memiliki properti data yang, seperti yang
‫saya sebutkan,
‫yang disebut amplop untuk data kami.
‫Jadi kita tentukan properti
‫data dan data itu pada gilirannya akan memiliki objek
‫yang kemudian berisi data, jadi langkah
‫respons yang sebenarnya ingin kita kirim.
‫Dan dalam hal ini adalah wisata.
‫Jadi wisata dan kemudian wisata, yang merupakan nama
‫yang sama dalam hal ini.
‫Jadi dengan ES6, sebenarnya kita tidak perlu menentukan kunci
‫dan nilainya jika memiliki nama yang sama, jadi
‫kita bisa menulis tur saja,
‫tetapi saya hanya ingin menentukan
‫di sini bahwa saya menulis tur di
‫sini karena, nah, itu adalah nama sumber daya dan titik
‫akhir, dan itulah sebabnya,
‫di dalam data, saya kemudian mengirim kembali objek yang memiliki properti tur.
‫Oke, jadi jika ini disebut x, misalnya, maka
‫saya akan menyebutnya di
‫sini x, tapi di sini, saya masih perlu mengatakan tur, oke.
‫Saya mengembalikannya ke tur karena itu lebih masuk akal dan sekarang
‫saya dapat menghapus ini di sini dan membiarkannya seperti ini.
‫Dan itu sebenarnya yang harus kita lakukan.
‫Jadi kami membaca data kami dan kemudian kami memformat
‫respons kami seperti ini di sini, menggunakan spesifikasi data JSend.
‫Oke, jadi hal yang sangat sederhana.
‫Sekarang mari kita uji
‫dan sekarang kita harus mengubah, tentu saja,
‫URL, jadi kita memiliki slash API, slash versi satu, dan tur.
‫Jadi itu adalah URL kami.
‫Kami masih melakukan permintaan
‫get, dan itulah yang kami tanggapi dalam
‫kode, jadi ingat, gunakan metode
‫get ini, dan tekan Send, dan memang, ini dia.
‫Jadi di sini, kami memiliki semua tur kami.
‫Jadi, luar biasa, itu sangat keren.
‫Benar-benar, pekerjaan yang sangat bagus.
‫Sekarang hanya untuk menyelesaikan, hal lain
‫yang saya suka lakukan biasanya ketika kami mengirim beberapa
‫tanggapan adalah memasukkan bidang yang
‫disebut hasil dengan jumlah hasil yang kami kirim.
‫Oke, dan ini sebenarnya bukan
‫bagian dari spesifikasi
‫JSend, tapi saya masih sangat
‫suka melakukannya karena itu sangat
‫memudahkan klien untuk mendapatkan informasi yang
‫sangat cepat tentang data yang diterimanya.
‫Jadi kita tahu bahwa tur adalah rangkaian dan yang
‫harus kita lakukan hanyalah mengatakan tur. panjang.
‫Oke, dan ini sebenarnya hanya
‫masuk akal setiap kali kita mengirim array, jadi banyak objek.
‫Jika kami hanya mengirim satu tur, maka tidak
‫masuk akal untuk mendapatkan hasil seperti satu,
‫benar, jadi saya
‫hanya melakukan ini setiap kali kami mengirim array
‫dengan banyak objek di sana.
‫Jadi mari kita lakukan itu lagi.
‫Dan memang, kami memiliki sembilan hasil, lalu
‫kami memiliki properti data, lalu di sana, tur, untuk
‫menentukan bahwa kami mengirim
‫tur, dan kemudian larik dengan sembilan tur di sana.
‫Jadi Anda dapat melihat objek lain
‫dan objek lain dan
‫objek lainnya, dan
‫sampai akhir, jadi itulah langkah pertama ke API kami.
‫Tentu saja, pada titik ini, ini seperti API berbasis file, jadi kami membaca
‫data ini dari API, tetapi nanti,
‫tentu saja, kami akan menyimpan
‫data ini dalam database dan kemudian membacanya dari sana.
‫Tapi bagaimanapun, ini sudah terlihat seperti nyata
‫dan itu pasti membuatku merasa sangat
‫baik, dan kuharap itu membuatmu merasa baik juga.
‫Jadi itu saja untuk mendapatkan permintaan.
‫Selanjutnya, kita akan mengurus permintaan posting sehingga
‫kita benar-benar dapat menambahkan tur baru ke data kita.