هذا الدرس مفصل الاول من دورة
برمجة موقع اجتماعي مثل الفيسبوك
اليوم سنشرح طريقة اعداد البرنامج لبدء العمل , ونحضر ملف الاستايل style لنعمل عليه ومن ثم سنقوم ببناء صفحة تسجيل الاعضاء
http://www.dzbatna.com/images/smilies/bleh.gif
نفتح برنامج الدريم ويفر ومن ثم نختار new site مثل الصورة
http://www.3nwank.com/sulieman/01.jpg
الان نعمل التالي :
http://www.3nwank.com/sulieman/02.jpg
1- ندخل اسم الموقع
2- نضغط عند رقم اثنين
3- نختار المجلد الذي سنعمل عليه ويكون موجود في ملف www بالسيرفر SERVER المحلي
بعد ذالك نضغط على كلمة servers كما موضح بالصورة
http://www.3nwank.com/sulieman/06.jpg
ثم نضغط على اشارة الزائد +
http://www.3nwank.com/sulieman/07.jpg
ونختار connct using : local/Network
http://www.3nwank.com/sulieman/08.jpg
1) connect using: local/network
2) server name: ضع الاسم الذي تريده
3) server folder : نختار نفس المجلد الذي اخترناه سابقا
4) عنوان الموقع على السيرفر SERVER المحلي
5) ومن ثم نضغط على advanced عند الرقم 5
http://www.3nwank.com/sulieman/09.jpg
نضع اشارة صح بجانب automaticlly upload file to server on save
وبعد ذالك نضغط save
http://www.3nwank.com/sulieman/010.jpg
بعد ذالك نضع صح على Testing
ومن ثم save
هكذا انتهينا من اعداد البرنامج تقريبا
الان جاء دور تحميل ملف الاستايل style , وهو من مدرس مفصلة كليبرز , اراه مناسب لانه خفيف وجميل
تحميل الاستايل style
الان نفك الضغط عن الملف وننقل محتوياته الى المجلد الذي اخترناه كي نعمل عليه ( انا انشئت ملف اسمه usf )
http://www.3nwank.com/sulieman/03.jpg
ملف image يوجد به الصور الخاصة بالتصميم
ملف styles ويحتوي على ملفات الـ css الخاصة بالتنسيق واضافة الجمالية
ملف index.html وهو الموقع
http://www.3nwank.com/sulieman/04.jpg
الان نرجع للبرنامج و نضغط على refresh كما توضح الصورة لكي تظهر الملفات التي اضفناها للموقع
الصورة مصغرة أنقر هنا لرؤيتها بحجمها الطبيعي 1600*1200
http://www.3nwank.com/sulieman/05.jpg
الان نضغط على index.html ضغطتين سريعتين كي نفتحها
لقد انتهينا من اعداد البرنامج , الان سوف نقوم يعمل صفحة تسجيل اعضاء جدد
نقوم الان بالدخول الى phpmyadmin الخاصة بالسيرفر SERVER المحلي
http://www.3nwank.com/sulieman/011.jpg
ونقوم بانشاء قاعجة بيانات جديدة , انا اسميتها usf وبعد ذالك نضغط على create
http://www.3nwank.com/sulieman/012.jpg
نبني جدول جديد اسمه users وهو جدول الاعضاء
http://www.3nwank.com/sulieman/013.jpg
هذا هو الجدول الذي بنيته , واضع ولا يتحتاج لشرح طريقة
الان نعود الى واجهة interface البرنامج
http://www.3nwank.com/sulieman/014.jpg
ومن ثم نختار file ومن ثم save us ونسميه signup.php
هكذا اصبح عندنا ملفان الاول index.html والثاني signup.php وهما مثل بعض
http://www.3nwank.com/sulieman/015.jpg
بعد ان قمنا بحفظها نضغط عليها مرتان كيف نفتحها ونعدل عليها
بعدما فتحنا صفحة signup.php نقوم بحذف منها الاشياء التي لا نحتاجها , فنحن نريد ان نبني صفحة للمستخدمين الجدد ولدخولهم , انظروا ماذا سافعل انا
http://www.3nwank.com/sulieman/016.jpg
انا قمت بحذف كل شيء موجود بالوسط , ومن ثم ادخلت جدول ووضعت في الجزء اليمين صورة , بامكانك وضع ما تريد لتزين الصفحة , في الجزء الأخر من الجدول سنضع فورم تسجيل عضو جديد
http://www.3nwank.com/sulieman/017.jpg
في خانة ال databases "موجودة على اليمين"
نقوم بالضغط على اشارة الـ+
ونضغط على MySQL conniction مثل الصورة
http://www.3nwank.com/sulieman/018.jpg
1) نضع اسم التصال "يمكن كتابة اي شيء باللغة الانجليزية"
2) نضع هنا localhost
3) اسم المستخدم لقاعدة البانات للسيرفر SERVER المحلي "انا عندي root"
4) كلمة السر لقاعدة البانات "انا ما عندي كلمة سر"
5) نضغط على select ونختار القاعدة اتي انشئناها اليوم
6) ومن ثم اوكي
جاء دور انشاء نموذج تسجيل اعضاء , الان يجب ان نضغط بالفائرة على المكان الذي سندخل اليه النموذج
http://www.3nwank.com/sulieman/019.jpg
1) لذالك يجب ان تضغط داخل الجدول في الجزء الفارغ
2) نضغط على data
3) نختار record insertion form wizard
http://www.3nwank.com/sulieman/020.jpg
connection : وهو الاسم الذي كتبناه في الشابق
tables : تظهر لنا جول الـ users وهو الجدول الذي سنضيف اليه حقول عن طريق هذا النموذج
after insertion , go to : اي بعد ادخال الحقل اذهب الى " تحديد الصفحة التي سنفتحها بع نجاح عملية الادخال
انا كتبت signupsucces.php , سنبنيها لاحقا
الان نختار user_id ونضغط على علامة ناقص - لازالته من النموذج , لا نحتاج له في عملية الادخال لانه AUTO_INCREMENT
اي انه كل مرة يسجل عضو جديد يحصل على id اوتوماتيكي تسلسلي
ثم نضغط على user_firstname ونغير الـ Lable: الى الاسم الاول
ثم نضغط على user_lastname ونغير الـ Lable: الى الاسم الثاني
نعيد الكرة مع كل الحقول
عندما نصل الى user_password
نضغط على display as: ونختار password field
http://www.3nwank.com/sulieman/021.jpg
واخيرا نضغط اوكي
الان ننسق النوذج قليلا
نضغط على رأس النموذج ونختار class ثم tbl
http://www.3nwank.com/sulieman/022.jpg
نعيد العملية مرة اخرة بالجهة الثانية من النموذج ولكن هذه المرة نختار class ثم msg10tion
http://www.3nwank.com/sulieman/023.jpg
الان نضغط على الجدول الخارجي ونضع قيمة border صفر كي لا يظهر البرواز
http://www.3nwank.com/sulieman/024.jpg
الان نضغط ctrl+s للحفظ , ونضغط preview in firefox
http://www.3nwank.com/sulieman/025.jpg
وتظهر لنا نتيجة عملنا , رائع اليس كذالك ؟
http://www.3nwank.com/sulieman/026.jpg
هذا هو درس مفصل اليوم , الموعد القادم غدا انشاء الله
http://www.dzbatna.com/images/smilies/shiny01.gif 