dkonten.com – Saat mengerjakan desain full-stack, saya seringkali mengalami dilema besar. Bagaimana cara terbaik untuk mendesain aplikasi web? Apakah saya harus menulis CSS sendiri atau menggunakan framework yang sudah ada? Jika saya memilih framework, framework mana yang sebaiknya saya gunakan? Apakah saya harus memilih library berbasis komponen seperti Bootstrap atau library berbasis utilitas seperti Tailwind? Teknologi CSS semakin berkembang, dan saya harus riset terlebih dahulu untuk memahami pro dan kontra dari setiap pilihan.
Vanilla CSS
Pada awalnya, saya berpikir untuk menulis CSS saya sendiri dari awal, alias menggunakan Vanilla CSS. Namun, saya segera menyadari bahwa saya harus menghindari langkah ini. Mengapa? Karena saya malas 😂 😂, tetapi, menulis CSS sendiri memiliki keuntungannya. Kamu memiliki kendali penuh atas desain Kamu. Apa yang Kamu lihat adalah apa yang Kamu dapatkan, secara harfiah. Kamu bisa memberi nama Class dan ID sesuka hati Kamu. Karena Kamu memegang kendali, Kamu tidak akan pernah memiliki kode yang tidak perlu di file CSS Kamu. Namun, kendali penuh ini juga bisa menjadi pedang bermata dua. Kecuali Kamu adalah ahli CSS, penamaan Kamu mungkin tidak sesuai dengan konvensi industri. Selain itu, jika Kamu memiliki aplikasi web yang kompleks, menulis CSS bisa menjadi tugas yang sangat memakan waktu, bahkan mungkin memerlukan dedikasi penuh.
Bootstrap
Pilihan kedua saya adalah menggunakan Bootstrap, library berbasis komponen yang sudah teruji dan terbukti. Bootstrap menawarkan library komponen yang siap digunakan dan berfungsi langsung. Ada banyak keuntungan menggunakan Bootstrap. Kamu dapat menggunakan komponennya untuk membangun halaman web Kamu dengan cepat dan efektif. Kamu juga tidak perlu menjadi ahli CSS untuk memanfaatkan sepenuhnya library ini. Jika Kamu bekerja dalam tim, mereka kemungkinan besar sudah familiar dengan konvensi penamaan yang digunakan Bootstrap pada komponennya. Namun, keluhan terbesar yang sering saya dengar tentang Bootstrap adalah pengembang berpengalaman dapat dengan mudah mengetahui jika Kamu menggunakan komponennya. “Semua situs web terlihat sama” adalah ungkapan yang mungkin pernah Kamu dengar terkait Bootstrap. Hal ini mungkin disebabkan oleh fakta bahwa Bootstrap tidak menawarkan banyak penyesuaian pada komponennya. Penyesuaian sering kali memerlukan penulisan kode yang monoton, yang sebaiknya dilakukan dengan CSS vanilla. Selain itu, tergantung pada cara Kamu mengimpor Bootstrap, library ini dapat meninggalkan sisa kode yang tidak terpakai di file Kamu.
Tailwind CSS
Pilihan ketiga, dan yang akhirnya saya gunakan, adalah Tailwind CSS. Tailwind adalah framework desain berbasis utilitas yang tampaknya telah menggemparkan dunia web development. Alih-alih menyempurnakan komponen sepenuhnya, Tailwind menyediakan banyak kelas utilitas untuk fleksibilitas dan penyesuaian. Tailwind bukanlah framework desain yang berpendirian keras, tetapi memberikan landasan desain yang kuat dan konsisten. Kekuatan terbesar Tailwind adalah kemampuannya untuk merasakan pengalaman di antara konvensi (Bootstrap) dan konfigurasi (CSS vanilla). Jika Kamu bekerja dengan kerangka front-end (React dalam kasus saya), Kamu dapat mengabstraksi semua kode ke dalam komponennya sendiri. Semua kode sumber terpusat di satu tempat, dan Kamu dapat menggunakan kembali komponen tersebut di mana saja. Kelemahan terbesar Tailwind adalah kurva pembelajaran yang curam. Meskipun kuat, memulai belajar Tailwind bisa terasa menakutkan.
Kesimpulan
Ini adalah pandangan saya tentang framework CSS yang tersedia. Jika Kamu menyukai desain kustom atau sedang mengerjakan proyek kecil, CSS vanilla adalah pilihan yang baik. Jika Kamu perlu membangun situs web dengan cepat atau tidak ingin terlalu terlibat dengan CSS, Bootstrap cocok untuk Kamu. Jika Kamu ingin bekerja di antara keduanya sambil juga memiliki pola desain kustom, lihatlah Tailwind CSS. Setiap pilihan memiliki pro dan kontranya masing-masing, dan pilihan terbaik tergantung pada kebutuhan spesifik proyek Kamu dan keahlian Kamu dalam desain web.
Dengan memahami kelebihan dan kekurangan masing-masing pilihan, Kamu dapat membuat keputusan yang lebih tepat dan efektif dalam memilih alat yang tepat untuk proyek web Kamu. Semoga artikel ini membantu Kamu dalam menentukan pilihan yang paling sesuai dengan kebutuhan dan preferensi Kamu!
