تخطَّ إلى المحتوى

Frontend والـ Styling

الدرس 32 من 55

الهدف

بعد هالدرس تقدر تختار الـ frontend framework الصح لأي مشروع، وتثبّت shadcn/ui وعندك component library كاملة في دقائق.

ليش هذا الحين؟

قررت تستخدم الـ default stack. الحين نبدأ من الـ frontend — الجزء اللي المستخدم يشوفه أولا.

الفكرة

مقارنة الـ Frameworks:

Framework   Bundle   Learning   Ecosystem  متى تستخدمه
──────────────────────────────────────────────────────────
Next.js     متوسط    متوسط      ضخم       الـ default لأغلب المشاريع
SvelteKit   صغير     سهل        صغير      PWA، performance-critical
Remix       متوسط    متوسط      متوسط     full-stack مع nested routes
Vite+React  صغير     سهل        كبير      SPA بسيطة، no SSR
Nuxt        متوسط    متوسط      متوسط     Vue teams

Styling:

Tailwind CSS     أسرع للـ prototyping، utility classes
CSS Modules      scoped، أقل magic
styled-components CSS-in-JS، أكبر bundle

محتاج مساعدة؟ راسلنا على mj@shakesbeard.net