بنية المجلدات واصطلاحات التسمية

مرحباً

البنية الافتراضية

src/
  main.jsx
  App.jsx
  index.css

الهيكل القائم على الميزات

src/
  features/
    auth/
      LoginForm.jsx
      LoginForm.test.jsx
      useLogin.js
    dashboard/
      Dashboard.jsx
      useDashboardData.js
  components/     <- shared UI only
  hooks/          <- shared hooks
  lib/            <- utilities

تسمية ملفات المكوّنات

تسمية الملفات غير الخاصة بالمكوّنات

ملفات index لاستيرادات نظيفة

// src/features/auth/index.js
export { LoginForm } from './LoginForm';
export { useLogin } from './useLogin';

// Consumer
import { LoginForm } from '@/features/auth';

الاستيرادات المطلقة باستخدام أسماء المسارات المستعارة

// vite.config.js
resolve: {
  alias: { '@': path.resolve(__dirname, 'src') }
}

المكوّنات المشتركة مقابل مكوّنات الميزات

ملفات الثوابت والإعدادات

// src/config.js
export const API_BASE = import.meta.env.VITE_API_URL;

الأنواع والواجهات (TypeScript)

تحقق سريع

مراجعة

اكتمل المقرر