CSS בוטסטראפ לעומת tailwindcss

אלעזר 1

צוות הנהלה
מנהל
מנוי פרימיום
בוגר/תלמיד פרוג
עיצוב גרפי
כתיבה ספרותית
עיצוב פונטים
מוזיקה ונגינה
UX UI
D I G I T A L
יוצרי ai
האם יש כאן מישהו שהתנסה ב-tailwindcss ויכול לומר מנסיון במה זה עדיף / שונה מבוטסטראפ?
 

this my name

משתמש מקצוען
הנדסת תוכנה
D I G I T A L
אני השתמשתי בשניהם, ההבדלים העיקרים שראיתי:
בבוסטראפ הקוד יותר נקי, קריא. לא צריך על כל תכונה של CSS להוסיף קלאס.
לצורך ההשוואה, כך יראה button בבוסטראפ:
HTML:
<button type="button" class="btn btn-primary">Primary</button>
וכך בtailwindcss :
HTML:
<button class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded">
  Button
</button>

בנוסף בבוסטראפ יש אוטומטית את כל הeventים של ה button:
hover, focusOn , focusOut, click וכו'.

ניתן לראות את ההשוואה פה:
1622573020705.png1622573020705.png
 

ש.ב.ח.

משתמש מקצוען
מנוי פרימיום
בוגר/תלמיד פרוג
עיצוב גרפי
D I G I T A L
@אלעזר 1
בוטסטראפ היא ספריית קומפננטות ויש לה גם עזרים כללים בCSS
tailwind היא ספריה ללא קומפוננטות.
הבלעדיות של האחרונה שלא רואים על העיצוב מיד שזה tailwind כמו שראוים בבוטסטראפ עוד לפני שחוקרים...

אני אישית אוהב יותר את tailwind
אבל אני משתמש איתו עם NPM וכך הוא יותר גמיש
(אפשר ליצור קלאסים על הקלאסים שלו וכמובן להוסיף עוד וריאציות וכו')
 

אלעזר 1

צוות הנהלה
מנהל
מנוי פרימיום
בוגר/תלמיד פרוג
עיצוב גרפי
כתיבה ספרותית
עיצוב פונטים
מוזיקה ונגינה
UX UI
D I G I T A L
יוצרי ai
@אלעזר 1
בוטסטראפ היא ספריית קומפננטות ויש לה גם עזרים כללים בCSS
tailwind היא ספריה ללא קומפוננטות.
הבלעדיות של האחרונה שלא רואים על העיצוב מיד שזה tailwind כמו שראוים בבוטסטראפ עוד לפני שחוקרים...

אני אישית אוהב יותר את tailwind
אבל אני משתמש איתו עם NPM וכך הוא יותר גמיש
(אפשר ליצור קלאסים על הקלאסים שלו וכמובן להוסיף עוד וריאציות וכו')
איך אתה מסתדר מאידך עם מה שכתב @this my name , או שכבר התרגלת (או שאתה עובד עם אפיון מוכן)?

@יידישע קאפ מוזמן גם.
 

ש.ב.ח.

משתמש מקצוען
מנוי פרימיום
בוגר/תלמיד פרוג
עיצוב גרפי
D I G I T A L
איך אתה מסתדר מאידך עם מה שכתב @this my name , או שכבר התרגלת (או שאתה עובד עם אפיון מוכן)?
ראשית מתרגלים
שנית אני עובד גם עם קלאסים רגילים בהם אני משתמש עם הקלאסים של taiwind (כמובן עם webpack)
CSS:
.btn {
    @apply
        rounded-full
        font-bold
        curser-pointer
        hover:opacity-85
        hover:shadow
}
 

אולי מעניין אותך גם...

הפרק היומי

הפרק היומי! כל ערב פרק תהילים חדש. הצטרפו אלינו לקריאת תהילים משותפת!


תהילים פרק קיט ב'

ט בַּמֶּה יְזַכֶּה נַּעַר אֶת אָרְחוֹ לִשְׁמֹר כִּדְבָרֶךָ:י בְּכָל לִבִּי דְרַשְׁתִּיךָ אַל תַּשְׁגֵּנִי מִמִּצְוֹתֶיךָ:יא בְּלִבִּי צָפַנְתִּי אִמְרָתֶךָ לְמַעַן לֹא אֶחֱטָא לָךְ:יב בָּרוּךְ אַתָּה יְהוָה לַמְּדֵנִי חֻקֶּיךָ:יג בִּשְׂפָתַי סִפַּרְתִּי כֹּל מִשְׁפְּטֵי פִיךָ:יד בְּדֶרֶךְ עֵדְוֹתֶיךָ שַׂשְׂתִּי כְּעַל כָּל הוֹן:טו בְּפִקֻּדֶיךָ אָשִׂיחָה וְאַבִּיטָה אֹרְחֹתֶיךָ:טז בְּחֻקֹּתֶיךָ אֶשְׁתַּעֲשָׁע לֹא אֶשְׁכַּח דְּבָרֶךָ:
נקרא  5  פעמים

לוח מודעות

למעלה