Clean Code Untuk Kebaikan Semua

credit: https://cdn.dribbble.com/users/71691/screenshots/6283648/cleancode_2x.png

Artikel ini dibuat dalam rangka tugas mata kuliah Proyek Perangkat Lunak (PPL) Fasilkom UI 2020

Selama pengembangan proyek, clean code adalah salah satu hal yang harus diproritaskan selama membuat program. Apa itu clean code? Secara simpel, clean code adalah kode yang dapat dimengerti dengan cepat oleh orang yang membacanya. Clean code juga merupakan kode yang sederhana (lingkup kecil) dan dapat digunakan kembali (reusable).

Berdasarkan definisi di atas, contoh-contoh prinsip clean code ialah:

1. Kode mudah dimengerti orang lain. Hal ini berarti penamaan variabel yang jelas dan konsisten, struktur kode dan flow program terlihat rapi, penggunaan spasi ataupun simbol lain yang sesuai. Tanpa hal ini, rekan kerjamu akan sangat kebingungan ketika membaca kodinganmu.
2. Ruang lingkup kode kecil. Kesederhanaan adalah hal penting pada clean code. Fungsi yang dibuat tidak terlalu kompleks, melainkan hanya melakukan satu task simpel. Kode terlalu kompleks hanya membuat ribet dan membuat debugging menjadi semakin susah.
3. Kode dapat di-reuse. Membuat kode duplikat di sana sini hanya akan memperpanjang baris program tanpa makna yang berarti.

Pada PPL ini, berikut contoh kode yang saya buat.

Namun, ternyata SonarQube menemukan masalah code smell pada kode ini, tepatnya pada baris ke-4. Code smell yang ada yakni ialah “canvas variable has been declared”. Hal itu cukup membuat saya bingung karena variabel canvas sebelumnya tidak pernah dibuat dan saya sempat kesulitan mencari solusinya.

Ternyata, saya baru tahu bahwa canvas adalah salah satu variabel yang sudah otomatis dimiliki oleh HTML sehingga penggunaannya cukup dengan memanggil dirinya. Perbaikan kode menjadi seperti berikut.

Isu code smell pada SonarQube pun sudah terselesaikan. Selain itu mengenai fungsionalitas fungsi, hanya sekali lihat saja, tim saya akan langsung tahu bahwa ini merupakan fungsi untuk mengambil foto. Namun, hal ini masih bisa saya perbaiki lagi dengan menambahkan dokumentasi fungsi seperti tipe data apa yang dikembalikan. Lalu, ini adalah fungsi lain yang saya buat.

Terlihat bahwa fungsi ini sudah jelas akan melakukan task “mengambil foto dan mengganti instruksi”. Per barisnya juga sudah cukup jelas, yakni pertama akan memanggil fungsi capturePhoto() sebelumnya, lalu menyimpannya ke variabel bernama captured.images sebelum akhirnya memanggil fungsi changeInstruction() untuk mengganti instruksi.

Dengan menerapkan clean code, tim saya dapat dengan cepat me-review program yang telah saya buat dan mendeteksi bila ada kesalahan atau error. Selain itu, bila mereka ingin mengutak-atik fungsi yang telah dibuat, mereka dapat melakukannya dengan cepat karena kodenya sudah mudah dimengerti.

Sekian tentang clean code, semoga bermanfaat :)