Home Mobile Tailwind VS Bootstrap

Tailwind VS Bootstrap

0

Halo, selamat datang kembali ke salah satu artikel dari baraja coding, di artikel ini, kita akan membahas topik yang cukup panas yaitu tentang framework css terbaik diantara tailwind dan bootstrap. Di artikel ini kita akan membahas 1 perbedaan mencolok diantara kedua framework tersebut agar kalian yang membaca bisa lebih mudah memilih mana framework css yang akan digunakan di project mendatang. Tanpa membuang waktu lagi, mari kita mulai bahas.

Tipe Class

Pertama kita akan bahas mungkin perbedaan yang paling mencolok diantara kedua framework diatas yaitu tipe class. Tipe class yang digunakan oleh tailwind adalah Utility-Class, simple-nya utility-class adalah class css yang bertujuan untuk mengubah hanya 1 property styling dari elemen. Contohnya untuk mengubah padding di tailwind, kita menggunakan class p-4 pada elemen dan property yang berubah pada elemen tersebut hanyalah padding. Dan ini berlaku pada property lain. Sementara untuk bootstrap, bootstrap memiliki tipe class Component Class yang artinya 1 class mengubah banyak property sesuai dengan jenis class tersebut, misalnya class card pada bootstrap akan mengubah padding, margin, border, border-radius, dan lain-lain.

Mungkin bootstrap juga bisa mengubah hanya 1 property pada sebuah elemen, tapi tidak sebanyak tailwind yang segala sesuatu untuk mengubah tampilan sebuah element harus di ganti dengan utility class masing-masing property.

Mungkin dititik ini kita bertanya-tanya, “kalau begitu, bootstrap lebih mudah dipakai dong? kita hanya tinggal menambahkan sedikit class, dan langsung jadi stylingnya” Bisa jadi tapi tidak sepenuhnya. Jika kita menggunakan bootstrap, mungkin elemen akan lebih cepat jadi, tetapi akan ada masalah. Karena semua website yang menggunakan bootstrap mengubah property yang sama dengan nilai yang sama, akan ada kemiripan pada semua website yang menggunakan bootstrap secara plain pada elemen-elemennya.

Tapi hal ini tidak akan terjadi pada tailwind yang notabene class-nya custom sesuai dengan class yang kita berikan. Intinya, tailwind unggul di fleksibilitas dengan styling yang kita berikan, sementara boostrap menang di kecepatan proses development.

Mungkin dititik ini kalian sudah memiliki sedikit pemahan tentang perbedaan yang tampak dari kedua framework. Jika ingin melihat lebih detail kedua framework, kalian bisa kunjungi dokumentasi resmi kedua framework tersebut disini: tailwind dan boostrap.

Terimakasih atas kesempatan membagi sedikit informasi, semoga bermanfaat.