tailwind CSS v4.0: आधुनिक वेब डेवलपमेंट के लिए एक परफेक्ट गेम चेंजर [अनुवाद लेख]

• v4.0 की सबसे प्रमुख विशेषता है performance improvement : full build अधिकतम 5 गुना और incremental build 100 गुना से अधिक तेज हो गया है
• CSS-first configuration के साथ paradigm shift : tailwind.config.js की जगह अब सीधे CSS में configuration
• @layer का उपयोग करके style priority को नियंत्रित किया जा सकता है
• @property rule से custom properties परिभाषित की जा सकती हैं
• color-mix() function से CSS variables और currentColor सहित सभी color values की transparency को नियंत्रित किया जा सकता है
• margin-left और margin-right की जगह margin-inline जैसे logical properties से एक साथ काम हो जाता है, जिससे RTL support काफी आसान हो गया है
• installation process सरल हो गया है : npm i tailwindcss @tailwindcss/postcss export default { plugins: ["@tailwindcss/postcss"],}; @import "tailwindcss"; बस इतना ही काफी है
• automatic content detection : अब .gitignore और image/video जैसी binaries को अपने-आप ignore करके, संबंधित files को automatically scan करता है. exceptions के लिए @source support भी है
• Vite Plugin को प्राथमिक support
• dynamic utility generation के कारण अब existing configuration में मौजूद न होने वाले values भी तुरंत इस्तेमाल किए जा सकते हैं
• उन्नत color system : पूरा default color palette RGB से OKLCH में upgrade किया गया है
• Container Queries अब framework में built-in हैं
• 3D Transforms support और बेहतर gradients भी जोड़े गए हैं
• नए Variants और Utilities शामिल हैं : not-*, starting, inert, nth-*, descendant Variant तथा field-sizing, color-scheme, inset-shadow-* Utilities
• migration उम्मीद से आसान है : अधिकांश बदलावों को automatically upgrade किया जा सकता है
• tailwind की बड़ी दिशा : यह सिर्फ framework update नहीं, बल्कि CSS के भविष्य के लिए एक साहसिक चुनौती है
• क्या upgrade करना चाहिए? : नए project के लिए v4.0 चुनें. existing projects भी अगर latest browsers को target करते हैं, तो आसानी से upgrade किए जा सकते हैं
• निष्कर्ष : tailwind CSS v4.0 सिर्फ evolution नहीं, बल्कि एक revolution है

[labeldock]

मैंने Tailwind को लागू करके 1 साल तक इस्तेमाल किया है
क्या मैं इसे अगले प्रोजेक्ट में इस्तेमाल करूंगा? YES
क्या यह web development का game changer है? NO

"game changer" कहना थोड़ा over लगा, इसलिए मैंने यह कमेंट लिखा।
मुझे नहीं लगता कि इसे भविष्य में अपनाई जाने वाली प्रगतिशील style मानकर तय तौर पर कहा जा सकता है।

Tailwind के फायदे हैं, जैसे template copy-paste करना, AI के जरिए आसानी से बनाना, और simple style adjustments करना, लेकिन

यह आसानी से पढ़े जाने वाले tags को भी जटिल बना देता है, और designer द्वारा बनाए गए design को बारीकी से follow करना भी मुश्किल हो जाता है। मुझे यह भी लगता है कि अगर CSS variables ठीक से सेट कर दिए जाएं, तो कठिनाई के लिहाज़ से यह inline styles से बहुत अलग नहीं है।

[bluekai17]

कृपया rn support करें..

[iolothebard]

बहुत दूर मत जाओ… हो सकता है वह सब कुछ निगल ले…

[ng0301]

फ़िलहाल 3.x ही इस्तेमाल करूंगा, फिर जब ये सच में मेनस्ट्रीम हो जाएगा तब शायद migration करूंगा।

[savvykang]

https://tailwindcss.com/docs/upgrade-guide

• shadow-sm -> shadow-xs
• shadow -> shadow-sm

अगले version में वे और कौन-सी compatibility तोड़ेंगे, इसका अंदाज़ा लगाना मुश्किल है।

[cocofather]

लगातार.उमड़.रहीं.वेब.तकनीकें.
जो.तकनीकें.पहले.से.मौजूद.हैं.वे.भी.काफी.हैं.
सिर्फ.C.assembly.HTML.JavaScript.ही.हों.तो.भी.सब.कुछ.संभव.है।

[bokjjang]

क्या आप अब भी Excel के 'function' इस्तेमाल नहीं करते?
कैलकुलेटर से भी सब कुछ किया जा सकता है।

लेकिन फिर spacing की जगह point का इस्तेमाल क्यों करते हैं?

[mse9000]

यह human old-person style का एक हिस्सा है
शायद यह इस बात की पैरोडी है कि बुज़ुर्ग लोग spacing की जगह अक्सर full stop डालते हैं..

[codemasterkimc]

किम डेरी, मैं एक बात साहस करके कहना चाहता हूँ। और कुछ नहीं, बस Excel functions का बहुत ज़्यादा इस्तेमाल मत कीजिए.. अगर सुविधा है, तो जोखिम भी बढ़ता है। गाय को काटने के लिए उसके मुताबिक धार होती है; क्या मुर्गी काटने के लिए भी बड़ी छुरी चाहिए? आसान तरीका ही सही जवाब हो सकता है।

[swooooooo]

हाहाहाहा, बहुत मज़ेदार है

[illiil1lii]

अगर मौजूदा प्रोजेक्ट latest browser को target करने वाली service है, तो इसे आसानी से upgrade किया जा सकता है

😅

[ahwjdekf]

कहते हैं कि यह simplification और upgrade है, लेकिन आखिरकार फिर से कुछ नया सीखो। बस यही है।