Architecture Decision Recordرکورد تصمیم معماری: Tailwind CSS
تصمیم: از Tailwind CSS به‌عنوان چارچوب CSS برای سبک‌دهی رابط کاربری استفاده کنید.
Tailwind CSS چیست؟
Tailwind یک چارچوب CSS با رویکرد ابزار-اول (utility-first) است که توسعهٔ سریع و سفارشی‌سازی رابط‌های کاربری را ممکن می‌کند. برای بسیار قابل‌سفارشی بودن طراحی شده است و به توسعه‌دهندگان اجازه می‌دهد CSS موجزتر و کارآمدتری بنویسند. این چارچوب مجموعه‌ای از کلاس‌های از پیش تعریف‌شده برای سبک‌دهی بسیار سریع UI ارائه می‌دهد.
زمینه
در حال ساخت یک برنامهٔ وب برای یک مشتری هستیم که به رابط کاربری واکنش‌گرا و سفارشی‌پذیر نیاز دارد. مشتری سبک‌دهی یکدست و مدرن خواسته است. تیم توسعه با استفاده از CSS سفارشی تجربه دارد اما می‌خواهد چارچوب‌های CSSای را که می‌توانند در زمان و تلاش صرفه‌جویی کنند بررسی کند. به دنبال چارچوبی هستیم که آسان برای استفاده، قابل‌سفارشی‌سازی باشد و جامعهٔ بزرگی برای پشتیبانی داشته باشد.
عوامل تصمیم
آسان برای استفاده: چارچوبی می‌خواهیم که یادگیری آن ساده باشد و بتواند در گردش کار توسعهٔ ما ادغام شود.
قابل‌سفارشی‌سازی: چارچوبی می‌خواهیم که بتوان آن را با دستورالعمل‌های برند و تم مشتری تطبیق داد.
پشتیبانی جامعهٔ بزرگ: چارچوبی می‌خواهیم که جامعهٔ فعالی از توسعه‌دهندگان و طراحان داشته باشد که در صورت نیاز بتوانند کمک و منابع ارائه دهند.
صرفه‌جویی در زمان: چارچوبی می‌خواهیم که بتواند در سبک‌دهی UI زمان و تلاش را صرفه‌جویی کند.
گزینه‌های بررسی‌شده
Bootstrap: چارچوب CSS محبوب با مؤلفه‌های از پیش ساخته‌شدهٔ فراوان و جامعهٔ بزرگی از توسعه‌دهندگان.
Foundation: چارچوب CSS محبوب دیگری که برای توسعهٔ موبایل-اول طراحی شده است.
Materialize: چارچوب CSS مبتنی بر زبان Material Design گوگل با مؤلفه‌های از پیش ساخته‌شده برای توسعهٔ UI.
Tailwind CSS: چارچوب CSS ابزار-اول با تمرکز بر سفارشی‌سازی و کارایی.
نتیجهٔ تصمیم
پس از بررسی گزینه‌ها، به دلایل زیر تصمیم گرفتیم از Tailwind CSS استفاده کنیم:
آسان برای استفاده: رویکرد Tailwind ساده و قابل‌فهم است. کلاس‌های ابزاری آن ساخت UI را سریع‌تر می‌کند.
قابل‌سفارشی‌سازی: Tailwind با ارائهٔ مجموعه‌ای از فایل‌های پیکربندی امکان سفارشی‌سازی می‌دهد که به توسعه‌دهندگان اجازه می‌دهد سبک‌های پیش‌فرض چارچوب را به‌آسانی تغییر دهند.
پشتیبانی جامعهٔ بزرگ: Tailwind جامعهٔ بسیار فعالی از توسعه‌دهندگان و طراحان دارد که پیوسته منابع، افزونه‌ها و ابزارهای جدید می‌سازند.
صرفه‌جویی در زمان: Tailwind می‌تواند در زمان صرفه‌جویی کند و به توسعه‌دهندگان امکان دهد روی سایر بخش‌های پروژه تمرکز کنند.
از کلاس‌های ابزاری Tailwind CSS برای ساخت UI پروژهٔ خود استفاده خواهیم کرد. تیم توسعه از سامانهٔ طراحی اتمی و ماژولار آن برای نوشتن کد CSS کارآمد و مقیاس‌پذیر استفاده خواهد کرد. از قالب‌ها و مؤلفه‌های بصری از پیش ساخته‌شدهٔ Tailwind برای سرعت بخشیدن به فرایند توسعه بهره خواهیم برد و در عین حال از سبک‌های سفارشی برای همخوانی با برند و تم مشتری استفاده می‌کنیم.