Tailwind CSS: מסגרת CSS וממשק API ראשון לתועלת לעיצוב מהיר ומגיב

Tailwind CSS Framework

למרות שאני מעמיק בטכנולוגיה על בסיס יומי, אני לא מקבל כל כך הרבה זמן שאני רוצה לחלוק את האינטגרציות והאוטומציה המורכבות שהחברה שלי מיישמת ללקוחות. כמו כן, אין לי הרבה זמן גילוי. רוב הטכנולוגיה שאני כותב עליה היא חברות שמחפשות Martech Zone מכסה אותם, אבל מדי פעם - במיוחד באמצעות טוויטר - אני רואה קצת זמזום סביב טכנולוגיה חדשה שאני צריך לשתף.

אם אתה עובד בעיצוב אתרים, פיתוח אפליקציות לנייד, או אפילו רק הקמת מערכת לניהול תוכן, כנראה שהתמודדת עם התסכולים של סגנונות מתחרים על פני גיליונות סגנונות מרובים. אפילו עם כלי הפיתוח המדהימים שנבנו בתוך כל דפדפן, מעקב וניקוי CSS יכול לדרוש הרבה זמן ואנרגיה מדי.

מסגרות CSS

בשנים האחרונות, מעצבים עשו עבודה די מדהימה בהוצאת אוספי סגנונות מוכנים ומוכנים לשימוש. גיליונות סגנונות CSS אלה ידועים יותר בשם CSS Frameworks, ומנסים להכיל את כל הסגנונות השונים ויכולות התגובה כך שמפתחים יכולים פשוט להתייחס למסגרת ולא לבנות קובץ CSS מאפס. כמה מסגרות פופולריות הן:

  • אוזן נעל - מסגרת שהתפתחה במשך עשור, שהוצגה לראשונה על ידי טוויטר. הוא מציע אינספור תכונות. יש לו חסרונות, הדורשים SASS, קשה לשכתב מחדש, תלוי ב- JQquery, וזה די חסון לטעון.
  • למצוא -מסגרת נקייה וידידותית למפתחים ואין לה תלות ב- JavaScript.
  • קרן - מסגרת CSS כללית ושימושית יותר הכוללת טונות של רכיבים הניתנים להתאמה אישית בקלות. בנוסף, יש קרן לדוא"ל ו Motion ממשק משתמש לאנימציות.
  • ערכת ממשק משתמש -שילוב של HTML, JavaScript ו- CSS לפיתוח החזית שלך במהירות ובקלות.

Tailwind CSS Framework

בעוד מסגרות אחרות עושות עבודה מצוינת בהתאמה לאלמנטים פופולריים של ממשק משתמש, Tailwind משתמשת במתודולוגיה המכונה CSS אטומי. בקיצור, Tailwind ארגן באופן גאוני את שמות הכיתות תוך שימוש בשפה טבעית כדי לעשות את מה שהם אומרים שהם עושים. כך שלמרות של- Tailwind אין ספריית רכיבים, היכולת לבנות ממשק רב עוצמה ומגיב רק על ידי התייחסות לשמות מחלקות CSS היא אלגנטית, מהירה ובלתי ניתנת להשוואה.

להלן כמה דוגמאות מצוינות:

רשתות CSS

עמודות רשתות התחלה של עמודות css

מדריכי CSS

שיפועי css

CSS לתמיכה במצב אפל

css מצב כהה

לזנב הרוח יש גם פנטסטי הרחבה זמינה עבור VS Code כך שתוכל לזהות ולהכניס בקלות שיעורים מעורך הקוד של מיקרוסופט.

אפילו יותר גאוני, Tailwind מסיר אוטומטית את כל ה- CSS שאינו בשימוש בעת בנייה לייצור, מה שאומר שצרור ה- CSS הסופי שלך הוא הקטן ביותר שיכול להיות. למעשה, רוב הפרויקטים של Tailwind שולחים ללקוח פחות מ- 10kB CSS.

מה אתה חושב?

אתר זה משתמש Akismet כדי להפחית דואר זבל. למד כיצד הנתונים שלך מעובדים.