1. مقدمة
1.1. عرض
رمز PDF لهذا المستند هو |HERE|.
أمثلة هذا المستند متاحة |HERE|.
نقترح هنا تقديم، بمساعدة أمثلة
- إطار عمل Java Server Faces 2 (JSF2)،
- ومكتبة المكونات PrimeFaces لـ JSF2، للتطبيقات المكتبية والمتنقلة.
هذا المستند موجه بشكل أساسي للطلاب والمطورين المهتمين بمكتبة المكونات PrimeFaces [http://www.primefaces.org]. يقدم هذا الإطار عشرات المكونات التي تدعم تقنية ajax [http://www.primefaces.org/showcase/ui/home.jsf]، مما يسمح بإنشاء تطبيقات ويب ذات مظهر وسلوك مشابهين لتطبيقات سطح المكتب. يعتمد Primefaces على JSF2، ومن هنا تأتي الحاجة إلى تقديم هذا الإطار أولاً. كما يقدم Primefaces مكونات مخصصة للأجهزة المحمولة. وسنقدمها أيضًا.
لتوضيح ما نعنيه، سنقوم بإنشاء تطبيق لحجز المواعيد في بيئات مختلفة:
- تطبيق ويب كلاسيكي باستخدام تقنيات JSF2 / EJB3 / JPA على خادم Glassfish 3.1،
- نفس التطبيق مع تقنية ajax، باستخدام تقنية PrimeFaces،
- وأخيرًا، إصدار للجوال باستخدام تقنية PrimeFaces Mobile.
في كل مرة يتم فيها إنشاء إصدار، سننقله إلى بيئة JSF2 / Spring / JPA على خادم Tomcat 7. وبالتالي، سننشئ ستة تطبيقات Java EE.
لا يعرض هذا المستند سوى ما هو ضروري لإنشاء هذه التطبيقات. لذا لا ينبغي البحث فيه عن الشمولية. فلن تجدها. كما أنه ليس مجموعة من الممارسات الجيدة. وقد يجد المطورون المتمرسون أنهم كانوا سيفعلون الأمور بشكل مختلف. آمل فقط ألا يكون هذا المستند مجموعة من الممارسات السيئة.
لمزيد من التعمق في JSF2 و PrimeFaces، يمكن استخدام المراجع التالية:
- [ref1]: دليل Java EE5، مرجع Sun لاكتشاف Java EE5. يمكن قراءة الجزء II [Web Tier] لاكتشاف تقنية الويب، ولا سيما JSF. يمكن تنزيل أمثلة البرنامج التعليمي. وهي تأتي في شكل مشاريع Netbeans يمكن تحميلها وتشغيلها،
- [ref2]: Core JavaServer Faces لـ David Geary و Cay S. Horstmann، الطبعة الثالثة، من دار النشر Mc Graw-Hill،
- [ref3]: وثائق PrimeFaces [http://primefaces.googlecode.com/files/primefaces_users_guide_3_2.pdf]،
- [ref4]: وثائق PrimeFaces Mobile: [http://primefaces.googlecode.com/files/primefaces_mobile_users_guide_0_9_2.pdf].
سنشير أحيانًا إلى [ref2] لإعلام القارئ بأنه يمكنه التعمق في مجال معين من خلال هذا الكتاب.
تمت كتابة هذا المستند بطريقة تجعله مفهومًا لأكبر عدد ممكن من القراء. المتطلبات الأساسية لفهمه هي كما يلي:
- معرفة بلغة Java،
- معرفة أساسية بتطوير Java EE.
يمكن العثور على جميع الموارد اللازمة لهذه المتطلبات الأساسية على الموقع [http://developpez.com]. ويمكن العثور على بعضها على الموقع [http://tahe.developpez.com]:
- [ref5]: مقدمة في برمجة الويب بلغة Java (سبتمبر 2002): يقدم أساسيات برمجة الويب بلغة Java: servlets والصفحات JSP،
- [ref6]: أساسيات تطوير الويب MVC بلغة Java (مايو 2006) []: يوصي بتطوير تطبيقات الويب باستخدام بنى ثلاثية الطبقات، حيث تنفذ طبقة الويب نمط التصميم (Design Pattern) MVC (النموذج، العرض، وحدة التحكم).
- [ref7]: مقدمة إلى Java EE 5 (يونيو 2010). يتيح هذا المستند اكتشاف JSF 1 و EJB3.
- [ref8]: استمرارية Java من خلال الممارسة (يونيو 2007). يتيح هذا المستند اكتشاف استمرارية البيانات باستخدام JPA (استمرارية Java API).
- [ref9]: إنشاء خدمة ويب Java EE باستخدام NetBeans وخادم GlassFish (يناير 2009). يتناول هذا المستند عملية إنشاء خدمة ويب. التطبيق النموذجي الذي يتم دراسته في هذا المستند مأخوذ من [ref9].
1.2. أمثلة الـ
تتوفر أمثلة هذا المستند في URL [https://stahe.github.io/jsf2-pf-pfm-juin-2012/jsf2-pf-pfm-juin-2012.zip] في شكل مشاريع Maven لكل من Netbeans و Eclipse:
![]() |
لاستيراد مشروع في Netbeans:
![]() |
- في [1]، نفتح مشروعًا،
- في [2]، حدد المشروع المراد فتحه في نظام الملفات،
- في [3]، يتم فتحه.
باستخدام Eclipse،
![]() |
- في [1]، يتم استيراد مشروع،
- في [2]، يكون المشروع مشروع Maven موجودًا،
![]() |
![]() |
- في [3]: يتم تحديده في نظام الملفات،
- في [4]: يتعرف Eclipse عليه كمشروع Maven،
- في [5]، المشروع المستورد.
1.3. الأدوات المستخدمة
فيما يلي، نستخدم (مايو 2012):
- IDE (بيئة التطوير المتكاملة) Netbeans 7.1.2 المتاحة في URL [http://www.netbeans.org]،
- IDE Eclipse Indigo [http://www.eclipse.org/] في شكله المخصص SpringSource Tool Suite (STS) [http://www.springsource.com/developer/sts]،
- PrimeFaces في إصداره 3.2 المتوفر في URL [http://primefaces.org/]،
- PrimeFaces Mobile في إصداره 0.9.2 المتاح في URL [http://primefaces.org/]،
- WampServer لـ SGBD MySQL [http://www.wampserver.com/].
1.3.1. تثبيت IDE Netbeans
نصف هنا تثبيت Netbeans 7.1.2 المتاح في URL [http://netbeans.org/downloads/].
![]() |
يمكننا أن نأخذ أعلاه إصدار Java EE مع الخادمين Glassfish 3.1.2 و Apache Tomcat 7.0.22. يسمح الأول بتطوير تطبيقات Java EE باستخدام EJB3 (Enterprise Java Bean)، بينما يسمح الآخر بتطوير تطبيقات Java EE بدون EJB. سنقوم بعد ذلك باستبدال EJB بإطار عمل Spring.
بمجرد تنزيل أداة تثبيت Netbeans، سنقوم بتشغيلها. ولهذا الغرض، يجب أن يكون لديك JDK (Java Development Kit) [http://www.oracle.com/technetwork/java/javase/overview/index.HTML]. بالإضافة إلى Netbeans 7.1.2، سنقوم بتثبيت:
- إطار العمل JUnit للاختبارات الفردية،
- خادم Glassfish 3.1.2،
- خادم Tomcat 7.0.22.
بمجرد انتهاء التثبيت، يتم تشغيل Netbeans:
![]() |
- في [1]، Netbeans 7.1.2 مع ثلاث علامات تبويب:
- تعرض علامة التبويب [Projects] مشاريع Netbeans المفتوحة؛
- علامة التبويب [Files] تعرض الملفات المختلفة التي تتكون منها مشاريع Netbeans المفتوحة؛
- علامة التبويب [Services] تجمع عددًا من الأدوات المستخدمة في مشاريع Netbeans،
- في [2]، يتم تنشيط علامة التبويب [Services] وفي [3] يتم تنشيط الفرع [Servers]،
- في [4]، يتم تشغيل خادم Tomcat للتحقق من صحة تثبيته،
![]() |
- في [6]، في علامة التبويب [Apache Tomcat] [5]، يمكن التحقق من التشغيل الصحيح للخادم،
- في [7]، يتم إيقاف خادم Tomcat،
ونفعل الشيء نفسه للتحقق من التثبيت الصحيح لخادم Glassfish 3.1.2:
![]() |
- في [8]، يتم تشغيل خادم Glassfish،
- في [9] نتحقق من أنه تم تشغيله بشكل صحيح،
![]() |
- في [10]، نقوم بإيقاف تشغيله.
لدينا الآن IDE جاهز للعمل. يمكننا البدء في إنشاء المشاريع. وبناءً على هذه المشاريع، سنقوم بتفصيل الخصائص المختلفة لـ IDE.
سنقوم الآن بتثبيت Eclipse IDE وسنقوم داخل هذا البرنامج بتسجيل الخادمين Tomcat 7 و Glassfish 3.1.2 اللذين قمنا بتنزيلهما للتو. وللقيام بذلك، نحتاج إلى معرفة مجلدات تثبيت هذين الخادمين. يمكن العثور على هذه المعلومات في خصائص هذين الخادمين:
![]() |
- في [1]، مجلد تثبيت Tomcat 7،
![]() |
- في [2]، مجلد نطاقات خادم Glassfish. في تسجيل Glassfish في Eclipse، يجب إدخال المعلومات التالية فقط [D:\Programs\devjava\Glassfish\glassfish-3.1.2\glassfish].
1.3.2. تثبيت Eclipse
على الرغم من أن Eclipse ليس هو IDE المستخدم في هذا المستند، فإننا نقدم مع ذلك إرشادات التثبيت. في الواقع، يتم توفير أمثلة المستند أيضًا في شكل مشاريع Maven لـ Eclipse. لا يأتي Eclipse مزودًا بـ Maven مدمج مسبقًا. يجب تثبيت مكون إضافي للقيام بذلك. بدلاً من تثبيت Eclipse عادي، سنقوم بتثبيت SpringSource Tool Suite [http://www.springsource.com/developer/sts]، وهو Eclipse مجهز مسبقًا بالعديد من المكونات الإضافية المرتبطة بإطار عمل Spring وكذلك بتكوين Maven مثبت مسبقًا.
![]() |
- انتقل إلى موقع SpringSource Tool Suite (STS) [1]، لتنزيل الإصدار الحالي من STS [2A] [2B]،
![]() |
![]() |
- الملف الذي تم تنزيله هو أداة تثبيت تقوم بإنشاء شجرة الملفات [3A] [3B]. في [4]، يتم تشغيل الملف القابل للتنفيذ،
- في [5]، تظهر نافذة عمل IDE بعد إغلاق نافذة الترحيب. في [6]، يتم عرض نافذة خوادم التطبيقات،
![]() |
- في [7]، نافذة الخوادم. تم تسجيل خادم. إنه خادم VMware لن نستخدمه. في [8]، نستدعي مساعد إضافة خادم جديد،
![]() |
- في [9A]، يتم عرض خوادم متنوعة علينا. نختار تثبيت خادم Tomcat 7 من Apache [9B]،
![]() |
- في [10]، نحدد مجلد تثبيت خادم Tomcat 7 المثبت مع Netbeans. إذا لم يكن لدينا خادم Tomcat، نستخدم الزر [11]،
- في [12]، يظهر خادم Tomcat في النافذة [Servers]،
![]() |
- في [13]، نقوم بتشغيل الخادم،
- في [14]، يتم تشغيله،
- في [15]، نقوم بإيقافه.
في النافذة [Console]، نحصل على السجلات التالية من Tomcat إذا سارت الأمور على ما يرام:
![]() |
- دائمًا في النافذة [Servers]، نضيف خادمًا جديدًا [16]،
- في [17]، لا يتم عرض خادم Glassfish،
- في هذه الحالة، نستخدم الرابط [18]،
![]() |
- في [19]، نختار إضافة محول لخادم Glassfish،
- يتم تنزيله، ثم بالعودة إلى النافذة [Servers]، نضيف خادمًا جديدًا،
- هذه المرة في [21]، يتم عرض خوادم Glassfish،
![]() |
- في [22]، نختار خادم Glassfish 3.1.2 الذي تم تنزيله مع Netbeans،
- في [23]، نحدد مجلد تثبيت Glassfish 3.1.2 (انتبه للمسار المشار إليه في [24])،
- إذا لم يكن لديك خادم Glassfish، فاستخدم الزر [25]،
![]() |
- في [26]، يطلب منا المساعد كلمة مرور مسؤول خادم Glassfish. بالنسبة للتثبيت الأول، تكون عادةً adminadmin،
- وعند انتهاء المساعد، في النافذة [Servers]، يظهر خادم Glassfish [27]،
![]() |
- في [28]، يتم تشغيله،
- في [29] قد تحدث مشكلة. هذا يعتمد على المعلومات المقدمة عند التثبيت. يحتاج Glassfish إلى JDK (Java Development Kit) وليس JRE (Java Runtime Environment)،
- للوصول إلى خصائص خادم Glassfish، نقوم بالنقر المزدوج عليه في نافذة [Servers]،
- لتظهر نافذة [20]، حيث نتبع الرابط [Runtime Environment]،
![]() |
- في [31]، سنقوم باستبدال JRE المستخدم افتراضيًا بـ JDK. للقيام بذلك، نستخدم الرابط [32]،
- في [33]، JRE المثبت على الجهاز،
- في [34]، نضيف واحدًا آخر،
![]() |
- إلى [35]، نختار [Standard VM] (Virtual Machine)،
- في [36]، نختار من JDK (>=1.6)،
- في [37]، يُسمى الجديد JRE،
![]() |
- بعد العودة إلى اختيار JRE لـ Glassfish، نختار JRE الجديد المعلن عنه باسم [38]،
- بمجرد انتهاء مساعد التكوين، نعيد تشغيل [Glassfish] [39]،
- في [40]، يتم تشغيله،
![]() |
- في [41]، شجرة الخادم،
- إلى [42]، يتم الوصول إلى سجلات Glassfish:
![]() |
- في [43]، نقوم بإيقاف تشغيل خادم Glassfish.
1.3.3. تثبيت [WampServer]
[WampServer] عبارة عن مجموعة برامج للتطوير في PHP / MySQL / Apache على جهاز يعمل بنظام Windows. سنستخدمه فقط لـ SGBD MySQL.
![]() |
- على موقع [WampServer] [1]، اختر الإصدار المناسب [2]،
- الملف القابل للتنفيذ الذي تم تنزيله هو برنامج تثبيت. يُطلب منك إدخال معلومات متنوعة أثناء عملية التثبيت. هذه المعلومات لا تتعلق ببرنامج MySQL. لذا يمكنك تجاهلها. تظهر نافذة [3] في نهاية التثبيت. يتم تشغيل [WampServer]،
![]() |
- في [4]، يتم تثبيت أيقونة [WampServer] في شريط المهام أسفل يمين الشاشة [4]،
- وعند النقر عليها، تظهر القائمة [5]. وهي تتيح إدارة خادم Apache و SGBD MySQL. لإدارة هذا الخادم، نستخدم الخيار [PhpPmyAdmin]،
- ثم تظهر النافذة أدناه،

لن نقدم الكثير من التفاصيل حول استخدام [PhpMyAdmin]. سنكتفي فقط بشرح كيفية استخدامه لإنشاء قاعدة بيانات التطبيق النموذجي في هذا البرنامج التعليمي.






























