تنظيم مشروع Flutter بشكل احترافي وسهل

x32x01
  • بواسطة x32x01 ||
لو شغال على Flutter وعايز كودك يبقى مرتب وسهل التطوير، لازم تتعلم تنظيم المشروع بطريقة احترافية. التنظيم الصح مش بس بيسهّل عليك التطوير، ده كمان بيخلي التطبيق مرن وسهل التوسع. 😎

مبدأ Separation of Concerns 🧩

أول حاجة لازم تعرفها هي فصل المهام لكل جزء في التطبيق. يعني كل جزء له دور محدد وواضح:

1. Models 📦

تمثل البيانات بتاعة التطبيق.
Code:
class User {
  final String id;
  final String name;
  User({required this.id, required this.name});
}

2. Providers 🔄

بتتحكم في حالة التطبيق (State) وبتحدث الـ UI.
Code:
class UserProvider with ChangeNotifier {
  User? _user;
  User? get user => _user;

  void setUser(User newUser) {
    _user = newUser;
    notifyListeners();
  }
}

3. Repositories 🌐

بتتعامل مع الـ API أو قاعدة البيانات.
Code:
class UserRepository {
  Future<User> fetchUser(String id) async {
    // كود لجلب البيانات من API
  }
}

4. Services 🛠️

لخدمات زي التخزين المحلي، المصادقة، والطلبات HTTP.
Code:
class AuthService {
  Future<bool> login(String email, String password) async {
    // كود تسجيل الدخول
  }
}

5. Views 🖥️

الشاشات والـ Widgets، منظمة حسب كل ميزة.
مثال هيكل مجلدات:
Code:
lib/
 ├── models/
 ├── providers/
 ├── repositories/
 ├── services/
 └── views/
     ├── login/
     └── home/



استخدام Provider و ChangeNotifier 🔄

بدل ما تستخدم setState()، استخدم ChangeNotifier و Provider لتحديث الـ UI بكفاءة:
Code:
MultiProvider(
  providers: [
    ChangeNotifierProvider(create: (_) => UserProvider()),
  ],
  child: MyApp(),
);
ده بيخلي إدارة الحالة منظمة ومرنة لكل التطبيق بدل ما كل Widget تتحكم في نفسها لوحدها.



إدارة الـ Dependencies باستخدام MultiProvider 📦

في main.dart، بنحدد كل الـ Providers عشان تبقى متاحة لكل التطبيق بسهولة:
Code:
void main() {
  runApp(
    MultiProvider(
      providers: [
        ChangeNotifierProvider(create: (_) => UserProvider()),
        ChangeNotifierProvider(create: (_) => ThemeProvider()),
      ],
      child: MyApp(),
    ),
  );
}
الميزة هنا إن كل الشاشة ممكن توصل لأي Provider من غير ما تعمل Pass لكل المتغيرات.



النتيجة؟ ✨

  • كود أنظف ✅
  • تطبيق أكثر مرونة وسهل التوسع 🔧
  • إدارة State منظمة بدون تعقيد 🧠



إنشاء المجلدات والملفات تلقائيًا 📝

بدل ما تقعد تنشئ كل مجلد وملف يدوي، ممكن تستخدم Snippets أو Scripts في IDE لتوليد المجلدات Models, Providers, Services, Views بسهولة، وده هيوفر وقتك جدًا ويخلي المشروع منظم من البداية.
2323.jpg
 
التعديل الأخير:
  • أعجبنى
التفاعلات: nouzen
المواضيع ذات الصلة
x32x01
الردود
0
المشاهدات
545
x32x01
x32x01
x32x01
الردود
0
المشاهدات
513
x32x01
x32x01
x32x01
الردود
0
المشاهدات
487
x32x01
x32x01
x32x01
الردود
0
المشاهدات
735
x32x01
x32x01
x32x01
الردود
0
المشاهدات
750
x32x01
x32x01
الدخول أو التسجيل السريع
نسيت كلمة مرورك؟
إحصائيات المنتدى
المواضيع
2,104
المشاركات
2,310
أعضاء أكتب كود
516
أخر عضو
Mohammed
عودة
أعلى