Tailwind keren, tapi saya pindah ke lain hati.

MMaximilian Schwarzmüller
Computing/SoftwareSmall Business/StartupsAdult EducationInternet Technology

Transcript

00:00:00Untuk beberapa proyek baru yang sedang saya kerjakan, bahkan untuk sebagian besar proyek baru saya saat ini,
00:00:05saya sebenarnya sudah beralih dari Tailwind. Saya tidak lagi menggunakan Tailwind di proyek-proyek tersebut,
00:00:11begitu juga dengan ShadCN. Dan ada alasannya. Alasannya bukan karena Tailwind itu buruk,
00:00:18tentu saja tidak. Justru sebaliknya. Itu adalah library yang luar biasa. Saya ingin memperjelas hal itu.
00:00:22Dan saya sebenarnya merasa agak tidak enak membuat video ini, episode kali ini, karena
00:00:27baru beberapa minggu yang lalu, saya membahas tentang masalah finansial besar yang dihadapi Tailwind saat itu.
00:00:32Sekarang, untungnya sejak saat itu, keadaannya jauh lebih baik. Banyak sponsor baru yang bergabung. Dan sekarang saya rasa
00:00:38situasi keuangan mereka sudah jauh lebih stabil. Karena tentu saja, Tailwind memang luar biasa.
00:00:43Dan ada orang-orang yang bekerja dengan sepenuh hati dan energi pada proyek tersebut. Poin saya bukanlah
00:00:49bahwa itu buruk, atau saya ingin meyakinkan orang lain untuk tidak menggunakannya. Saya hanya menggunakan saluran ini untuk
00:00:56berbagi pemikiran, opini, dan sedikit wawasan tentang cara saya bekerja. Jadi saya pikir itu mungkin
00:01:01menarik. Jadi, mengapa saya tidak menggunakan Tailwind jika menurut saya itu luar biasa? Saya harus sedikit mundur ke belakang.
00:01:07Beberapa tahun lalu, sebelum adanya revolusi AI, atau sebelum AI menjadi sehebat sekarang dalam menulis kode,
00:01:15saya menggunakan Tailwind seperti kebanyakan orang, saya rasa seperti kebanyakan developer di mana pun. Namun, karena satu alasan utama,
00:01:21yaitu karena Tailwind memungkinkan saya untuk melakukan iterasi kode dengan cepat. Anda tahu, saya tidak pernah benar-benar menggunakan Figma
00:01:28atau alat sejenis lainnya. Terutama juga karena situasi saya yang kebanyakan bekerja sendirian.
00:01:34Dan jika saya bekerja sendirian di proyek saya, saya tidak benar-benar harus menggunakan alat desain tersebut. Bagi saya,
00:01:40selalu lebih cepat untuk melakukan iterasi desain langsung dari dalam kode. Saya bisa menulis kode,
00:01:45dan dengan Tailwind, karena kelas-kelasnya ada di dalam baris kode DOM atau JSX Anda, Anda bisa
00:01:50dengan cepat memperbarui kode, memperbarui gaya tersebut, dan mencoba berbagai gaya. Mencoba menyesuaikan margin tersebut.
00:01:57Dan itu adalah alur kerja yang sangat, sangat efisien. Itulah alasan utama bagi saya dan mungkin juga
00:02:04bagi beberapa pengembang lain mengapa saya menggunakan Tailwind. Saya tahu bagi banyak pengembang lain,
00:02:10mungkin mayoritas, alasan kuat lainnya adalah karena mereka sangat membenci CSS. Saya tahu CSS tidak populer
00:02:17di kalangan pengembang web. Dan saya mengerti alasannya. CSS bisa terlihat sangat rumit. Ada ratusan bahkan ribuan
00:02:23properti dan nilai. Dan ya, itu bisa sangat menciutkan nyali. Namun, harus saya katakan,
00:02:31CSS modern telah berkembang pesat. Banyak hal yang lebih mudah sekarang dibandingkan di masa lalu. Maksud saya, Flexbox sudah
00:02:37tidak baru lagi, tapi ia membuat banyak hal jadi lebih mudah. Sekarang bayangkan Flexbox di area lain
00:02:44di mana menentukan warna menjadi jauh lebih mudah daripada sebelumnya. Sekarang Anda punya "relative colors" di CSS.
00:02:51Dan omong-omong, di kanal Akatamine saya, saya meluncurkan beberapa video yang membahas tentang fitur
00:02:55browser dan CSS modern seperti warna, "relative colors", atau "container queries", yang juga luar biasa
00:03:01untuk membangun komponen yang ukurannya berubah secara dinamis tanpa bergantung pada viewport, melainkan pada ruang
00:03:08yang tersedia untuk komponen tersebut. Jadi CSS sudah berkembang sangat jauh. Masalahnya adalah Anda juga bisa menggunakan semua
00:03:14fitur CSS modern ini dengan Tailwind, atau setidaknya sebagian besar, tetapi Anda juga bisa menulis vanilla CSS
00:03:23dan Anda bisa melakukannya lebih mudah sekarang dengan AI, tentu saja, karena meskipun Anda benci menggunakan CSS,
00:03:28mengetahui tentang fitur-fitur tertentu dan dukungan browser-nya saja sudah cukup. Anda bisa mengarahkan AI ke
00:03:34fitur yang ingin Anda gunakan, tambahkan beberapa dokumentasi, beberapa artikel MDN yang menjelaskan fitur tersebut, dan AI
00:03:39dapat menuliskan kodenya untuk Anda. Anda mungkin bertanya-tanya mengapa harus melakukan itu? Mengapa tidak pakai Tailwind saja? Maksud saya,
00:03:45Tailwind juga punya semua fitur modern itu, ada satu setengah alasan, setidaknya bagi saya.
00:03:51Alasan yang kurang penting adalah bahwa Tailwind mungkin tidak selalu mendukung semua fitur terbaru,
00:03:58dan yang lebih penting, AI belum tentu tahu tentang semua fitur Tailwind. Maksud saya, Tailwind punya
00:04:05banyak fitur, tapi AI tidak menggunakan semuanya. AI cenderung menggunakan kelas-kelas yang itu-itu saja dan sering kali
00:04:13masih memakai sintaks kelas yang lama, jadi Anda melewatkan fitur-fitur tertentu di sini. Hal yang sama bisa terjadi
00:04:17pada Anda jika menggunakan vanilla CSS, tentu saja. Jika Anda tidak memberi tahu AI untuk menggunakan fitur tertentu,
00:04:22ia mungkin tidak akan menggunakannya, tetapi Anda bisa mempelajari beberapa fitur CSS paling penting yang ingin Anda gunakan dan
00:04:29kemudian menyuruh AI untuk melakukannya. Tapi tentu saja, saya paham poinnya. Anda juga bisa melakukan hal yang sama untuk Tailwind
00:04:34dan tinggal menyuruh AI menggunakan fitur Tailwind tertentu. Mungkin hanya lebih mudah untuk menyebutkan beberapa fitur kunci
00:04:40CSS daripada kelas-kelas Tailwind, tapi sekali lagi, itu bukan poin utama saya. Poin utama saya adalah
00:04:48bahwa saya selalu berusaha mengurangi jumlah library yang saya gunakan dalam proyek-proyek saya,
00:04:53dan alasannya ada dua. Pertama, karena saya membuat konten edukasi, jadi saya terbiasa
00:05:01menganggap library eksternal atau tambahan sebagai hal yang buruk, karena jika saya membuat kursus tentang React,
00:05:07dan dalam kursus itu saya juga menggunakan Tailwind, jika ada perubahan yang merusak di Tailwind,
00:05:12banyak bagian dari kode saya atau kursus saya tiba-tiba rusak dan saya mendapat banyak pertanyaan dari
00:05:17para siswa, meskipun topik utamanya, yaitu React, mungkin tidak berubah. Saya tahu ini adalah masalah yang sangat spesifik
00:05:23yang berdampak pada saya, namun tidak pada kebanyakan situs web. Tetapi bahkan jika Anda membangun situs web normal,
00:05:29memiliki sesedikit mungkin library pihak ketiga di dalamnya sejauh masih masuk akal adalah ide yang bagus, menurut saya.
00:05:38Sekarang, saya juga akan mengatakan bahwa bukan ide yang baik untuk benar-benar menyingkirkan setiap library di luar sana.
00:05:44Ada alasan bagus untuk menggunakan library tertentu. Maksud saya, jika Anda membangun situs web
00:05:50yang memiliki editor teks kaya, menggunakan sesuatu seperti TipTap sangatlah masuk akal, menurut saya,
00:05:54karena Anda tidak perlu membangun editor sendiri. Sekarang, dengan AI, memang lebih mudah sampai tingkat tertentu,
00:05:59tapi Anda juga akan menghadapi banyak kasus khusus atau masalah yang kemudian harus Anda selesaikan sendiri. Dengan AI,
00:06:06memang bisa, tapi AI pun tidak selalu benar. Anda tahu itu jika pernah bekerja dengannya. Jadi
00:06:11ada alasan untuk menggunakan library pihak ketiga. Saya hanya ingin mengatakan bahwa penataan gaya, seperti yang saya jelaskan,
00:06:16adalah sesuatu yang sebenarnya bisa digantikan. Sekali lagi, saya tidak menyarankan semua orang untuk melakukannya,
00:06:21tapi bagi saya, itu berjalan cukup baik. Dan oleh karena itu, itu adalah satu library yang bisa saya hilangkan karena
00:06:28saya tidak keberatan meninjau kode CSS yang diberikan AI dan memperbaiki masalah CSS serta penataan gaya dengan
00:06:37CSS murni ketika ada yang salah, karena tentu saja, akan ada yang salah suatu saat ketika menggunakan AI.
00:06:44Tapi saya tidak keberatan. Jika Anda benar-benar benci melihat kode CSS, maka ini jelas bukan pilihan
00:06:50untuk Anda. Tapi bagi saya, saya bisa menyingkirkan library Tailwind. Saya bisa menyingkirkan
00:06:56ShadCN, misalnya, karena saya membangun komponen saya sendiri. Dan ShadCN, tentu saja, bukanlah
00:07:00library tradisional, tapi ia menggunakan Radix UI di baliknya, sebuah library yang status pemeliharaannya
00:07:08setahu saya sedang dipertanyakan sekarang. Jadi di situlah letak masalah sebenarnya mengapa saya ingin
00:07:16menghindari library bahkan saat tidak membicarakan konten edukasi, jika itu masuk akal. Setiap
00:07:21library yang Anda tambahkan ke proyek Anda juga bisa menjadi beban jika library tersebut berhenti dipelihara. Pada titik itu,
00:07:29masalah keamanan mungkin tidak diperbaiki lagi. Bug mungkin tidak diperbaiki lagi. Bug penataan gaya,
00:07:35misalnya, dengan Tailwind. Fitur-fitur baru mungkin tidak akan ditambahkan lagi. Jika ada fitur CSS baru
00:07:41dan Tailwind tidak dipelihara lagi—tentu saja sekarang masih dipelihara—tapi jika tidak lagi dipelihara,
00:07:46maka Anda mungkin tidak akan pernah bisa menggunakan fitur tersebut. Dan maksud saya, kita hampir mengalaminya dengan Tailwind.
00:07:52Video yang saya buat di mana saya membahas masalah mereka, ada postingan dari pencipta utama Tailwind
00:07:58di mana ia mengatakan jika mereka tidak bisa menyelesaikan masalah pembiayaan ini, Tailwind mungkin akan menjadi
00:08:03perangkat lunak yang terbengkalai. Mungkin itu agak drastis, mungkin juga dilakukan untuk menarik perhatian. Namun tetap saja,
00:08:11satu masalah yang selalu Anda hadapi dengan kebanyakan library pihak ketiga adalah mereka mungkin tidak dipelihara
00:08:17lagi di masa depan, tergantung pada siapa yang mengerjakannya sejak awal. Itulah sebabnya saya
00:08:22secara pribadi suka menggunakan vanilla CSS lagi. Dan itu penting di sini karena saya selalu melakukannya.
00:08:28Dan sekali lagi, saya tidak bisa tidak menekankannya. Saya mendoakan yang terbaik untuk Tailwind dan saya masih menggunakannya
00:08:35di banyak proyek. Tidak seperti itu. Saya tidak membencinya. Ini hanya satu hal di mana saya bereksperimen
00:08:41dengan tidak menggunakannya di beberapa proyek. Dan tidak peduli apakah itu Tailwind bagi Anda atau sesuatu yang sama sekali
00:08:46berbeda, saya akan—dan ini sudah benar bahkan sebelum era AI juga—saya akan selalu mempertimbangkan dua kali
00:08:53sebelum menggunakan library pihak ketiga. Ada banyak alasan bagus untuk menggunakannya. Misalnya, Better Auth
00:08:57untuk autentikasi itu luar biasa. Saya pasti akan menggunakannya. Tetapi jika ada library yang bisa Anda ganti,
00:09:04mungkin layak untuk dilihat atau dipikirkan kembali, saya rasa.

Key Takeaway

Keputusan untuk beralih ke Vanilla CSS didorong oleh kemudahan bantuan AI dan keinginan untuk meminimalkan ketergantungan pada library pihak ketiga guna menjaga stabilitas serta kemandirian proyek dalam jangka panjang.

Highlights

Pembicara memutuskan untuk beralih dari Tailwind CSS dan ShadCN ke Vanilla CSS dalam proyek-proyek barunya.

Perkembangan AI memudahkan penulisan kode CSS modern bagi pengembang yang sebelumnya merasa kesulitan.

Fitur CSS modern seperti Flexbox, Relative Colors, dan Container Queries memberikan fleksibilitas tinggi tanpa ketergantungan library.

Keinginan untuk mengurangi ketergantungan pada library pihak ketiga demi stabilitas jangka panjang dan pemeliharaan proyek.

Masalah keberlanjutan finansial library seperti Tailwind sempat menjadi kekhawatiran terkait potensi perangkat lunak terbengkalai.

Kebutuhan spesifik dalam pembuatan konten edukasi mendorong penggunaan teknologi standar untuk menghindari kerusakan materi kursus akibat pembaruan library.

Timeline

Perkenalan dan Alasan Transisi

Pembicara menjelaskan bahwa ia mulai meninggalkan Tailwind CSS dan ShadCN pada sebagian besar proyek barunya saat ini. Meskipun beralih, ia tetap menegaskan bahwa Tailwind adalah library yang luar biasa dan tidak bermaksud merendahkan kualitasnya. Ia juga menyinggung tentang situasi finansial Tailwind yang kini sudah lebih stabil berkat dukungan banyak sponsor baru. Video ini dibuat semata-mata untuk berbagi wawasan pribadi tentang efisiensi alur kerja dan perubahan preferensi teknisnya. Transisi ini bukan karena kebencian, melainkan hasil refleksi atas cara kerja yang lebih mandiri.

Sejarah Penggunaan Tailwind dan Peran AI

Sebelum era kebangkitan AI, Tailwind menjadi andalan utama karena memungkinkan proses iterasi desain yang sangat cepat langsung dari dalam kode. Pembicara yang sering bekerja sendirian merasa Tailwind sangat membantu karena ia tidak perlu menggunakan alat desain eksternal seperti Figma. Keuntungan utama Tailwind terletak pada penempatan kelas langsung di dalam DOM atau JSX yang mempermudah penyesuaian gaya secara instan. Alur kerja ini terbukti sangat efisien bagi pengembang tunggal yang ingin membangun produk dengan cepat. Namun, situasi ini mulai berubah seiring dengan kemajuan teknologi kecerdasan buatan dalam menulis kode.

Kebangkitan CSS Modern dan Tantangannya

Banyak pengembang menggunakan Tailwind karena mereka tidak menyukai kerumitan CSS yang memiliki ribuan properti dan nilai. Padahal, CSS modern telah berkembang pesat dengan fitur-fitur canggih seperti Flexbox, Relative Colors, dan Container Queries. Fitur Container Queries khususnya sangat berguna untuk membangun komponen responsif yang menyesuaikan diri dengan ruang yang tersedia, bukan sekadar ukuran layar. Pembicara menekankan bahwa CSS saat ini jauh lebih mudah dipelajari dan diimplementasikan dibandingkan beberapa tahun lalu. Perkembangan ini membuat batasan antara kemudahan library dan kekuatan CSS murni menjadi semakin tipis.

Integrasi AI dalam Penulisan Vanilla CSS

Dengan bantuan AI, menulis Vanilla CSS menjadi jauh lebih mudah karena AI dapat diarahkan untuk menggunakan fitur browser terbaru melalui dokumentasi MDN. Salah satu kelemahan Tailwind dalam konteks AI adalah AI sering kali menggunakan sintaks kelas lama atau tidak memanfaatkan fitur terbaru library tersebut. Pembicara berargumen bahwa lebih mudah menyebutkan fitur kunci CSS kepada AI daripada harus menghafal kelas-kelas spesifik Tailwind. Strategi ini memungkinkan pengembang tetap produktif tanpa harus bergantung pada abstraksi tambahan yang disediakan oleh library. Penggunaan AI bertindak sebagai jembatan bagi mereka yang sebelumnya merasa terintimidasi oleh sintaks CSS murni.

Strategi Meminimalkan Library Pihak Ketiga

Fokus utama pembicara adalah mengurangi jumlah library eksternal dalam setiap proyek untuk meningkatkan kontrol dan stabilitas. Dalam konteks konten edukasi, penggunaan terlalu banyak library berisiko merusak materi kursus jika terjadi pembaruan yang tidak kompatibel. Meskipun begitu, ia tetap menyarankan penggunaan library pihak ketiga seperti TipTap jika fungsinya memang sangat kompleks untuk dibuat sendiri. Prinsipnya adalah menggunakan library hanya jika benar-benar memberikan nilai tambah yang tidak bisa dicapai dengan cara sederhana. Keseimbangan antara membangun sendiri dan menggunakan library adalah kunci dari manajemen proyek yang sehat.

Masalah Pemeliharaan dan Keamanan Library

Setiap library tambahan membawa beban risiko jika pengembang aslinya berhenti melakukan pemeliharaan di masa mendatang. Pembicara mencontohkan Radix UI yang status pemeliharaannya sedang dipertanyakan sebagai alasan untuk lebih berhati-hati. Jika sebuah library tidak lagi diperbarui, masalah keamanan dan bug tidak akan diperbaiki, serta fitur CSS baru tidak akan didukung. Risiko ini nyata bahkan untuk proyek besar seperti Tailwind yang sempat menghadapi masalah pendanaan yang serius. Hal ini menjadi pengingat bahwa ketergantungan pada ekosistem pihak ketiga memiliki konsekuensi jangka panjang bagi kesehatan kode.

Kesimpulan dan Rekomendasi Akhir

Sebagai penutup, pembicara menegaskan kembali dukungannya terhadap Tailwind dan tetap menggunakannya di banyak proyek yang sudah berjalan. Ia mendorong pengembang untuk selalu mempertimbangkan dua kali sebelum menambahkan library baru ke dalam tumpukan teknologi mereka. Jika ada library yang bisa digantikan dengan solusi standar tanpa mengorbankan kualitas, maka opsi tersebut layak untuk dieksplorasi. Ia memberikan contoh Better Auth sebagai library yang sangat layak digunakan karena kompleksitasnya yang tinggi. Inti dari pesannya adalah menjadi lebih selektif dan kritis terhadap alat yang kita gunakan setiap hari.

Community Posts

View all posts