DevidJoshua / devid-joshua-vue-fundamental

Sebagai prasyarat seminar
1 stars 0 forks source link

Menambahkan Deskripsi Repositori, Menghapus Kode yg Tidak Perlu dan Gaya Penulisan Kode #1

Open jefrydco opened 4 years ago

jefrydco commented 4 years ago

Hi Mas Devid, terima kasih sudah mengirimkan kode belajar Vue.js Fundamental, saya sangat mengapresiasi kerja keras Mas Devid.

Mas juga sudah menggunakan kerangka kerja Bootsrap untuk gaya pada aplikasi pencari teks pada YouTube ini. Luar biasa Mas!

Saya ada beberapa saran Mas untuk kode yg Mas kirimkan:

  1. Menambahkan Deskripsi Repositori Agar repositori kita memiliki deskripsi, Mas bisa menambahkan berkas bernama readme.md di dalam direktori proyeknya Mas. Contohnya seperti ini Mas, https://github.com/jefrydco/jefrydco/blob/master/README.md

Hasilnya nanti akan seperti berikut:

jefrydco

Pada berkas tersebut Mas juga dapat menuliskan deskripsi seputar aplikasi pada repo ini dan bagaimana cara menjalankannya. Mas dapat menggunakan penulisan berformat markdown atau HTML.

  1. Menghapus Kode yg Tidak Perlu Mas menambahkan perpustakaan JavaScript eksternal jQuery, Popper dan Bootstrap pada berkas index.html baris ke 100-102 berikut:

https://github.com/DevidJoshua/devid-joshua-vue-fundamental/blob/b559c3aafa7a5a1e1d3a8f3eadb10f155d3ab201/index.html#L100-L102

Saya lihat Mas tidak menggunakan perpustakaan JavaScript tersebut pada aplikasi ini sehingga saya rasa akan lebih baik jika di hapus Mas.

  1. Spasi Antar Operator JavaScript Saya mengambil contoh kode pada berkas index.html pada baris ke 192 berikut:

https://github.com/DevidJoshua/devid-joshua-vue-fundamental/blob/b559c3aafa7a5a1e1d3a8f3eadb10f155d3ab201/index.html#L192

Saya sarankan Mas untuk menambahkan spasi antar operator =, sehingga kode tersebut kurang lebih akan menjadi seperti berikut:

this.pagination.total = response.total || response.data.length

Begitu juga pada baris ke 196 berikut:

https://github.com/DevidJoshua/devid-joshua-vue-fundamental/blob/b559c3aafa7a5a1e1d3a8f3eadb10f155d3ab201/index.html#L135-L136

menurut saya akan lebih baik jika kita menambahkan spasi setelah :, kurang lebih kode tersebut akan menjadi seperti berikut:

watch: {
  url: function() {
    // Kode di dalam
  }
}
  1. { tidak Perlu di Letakkan di Baris Baru Masih pada berkas index.html pada baris 185-186 berikut:

https://github.com/DevidJoshua/devid-joshua-vue-fundamental/blob/b559c3aafa7a5a1e1d3a8f3eadb10f155d3ab201/index.html#L185-L186

Setelah ekspresi kondisi Mas tidak perlu menaruh { di baris baru. Menurut saya akan lebih baik jika kita menuliskannya seperti berikut:

if(this.isValidURL(this.url)) {
  // Kode di dalamnya
} 

Begitu juga untuk deklarasi fungsi pada baris 213-214 berikut:

https://github.com/DevidJoshua/devid-joshua-vue-fundamental/blob/b559c3aafa7a5a1e1d3a8f3eadb10f155d3ab201/index.html#L213-L214

Dan deklarasi kondisi switch case pada baris 215-216 berikut:

https://github.com/DevidJoshua/devid-joshua-vue-fundamental/blob/b559c3aafa7a5a1e1d3a8f3eadb10f155d3ab201/index.html#L215-L216

Gaya penulisan tersebut kurang umum digunakan pada kalangan pengembang perangkat lunak JavaScript Mas.

Lebih lengkap mengenai gaya penulisan kode, Mas dapat membaca pada tautan berikut Mozilla Developer Network.

  1. Menggunakan Parameter pada Fungsi Pengamat Pada berkas index.html baris ke 136 berikut:

https://github.com/DevidJoshua/devid-joshua-vue-fundamental/blob/b559c3aafa7a5a1e1d3a8f3eadb10f155d3ab201/index.html#L136-L138

Mas mengakses nilai variabel url langsung dari this.

Parameter pada fungsi pengamat sebenarnya menerima 2 parameter Mas, parameter pertama adalah nilai yg baru dan parameter kedua adalah nilai yg lama. Sehingga kode di atas kurang lebih akan menjadi:

watch: {
  url: function(urlBaru, urlLama) {
    if(!this.isValidURL(this.url)) {
      this.clearAllResultAndPagination()
    }
  }
}

Walaupun keduanya sama-sama dapat bekerja dengan baik, dari Vue.js nya sendiri memberikan contoh penggunaan yg demikian Mas. Lebih lanjut mengenai pengamat dapat Mas akses melalui tautan berikut, Dokumentasi Vue.js Bahasa Indonesia - API - Watch.

Kemudian untuk pengondisian, sebaiknya Mas selalu menggunakan ekspresi yg dijabarkan daripada ekspresi singkat. Lebih lanjut Mas dapat membaca mengenai ekspresi yg dijabarkan pada tautan berikut, Mozilla Developer Network - JavaScript Styleguide.

Semangat Mas! 😄

DevidJoshua commented 4 years ago

Terimakasih bang untuk ilmu dan masukkannya .. untuk perubuhan saya sudah push.

jefrydco commented 4 years ago

Hi Mas @DevidJoshua , terima kasih kembali Mas. Jika Mas sudah menambahkan perubahannya, Mas bisa menutup isu ini ya. Terima kasih sudah menambahkan perubahan tersebut. Semangat selalu Mas! 😄