تقييم الموضوع :
  • 0 أصوات - بمعدل 0
  • 1
  • 2
  • 3
  • 4
  • 5
الدرس الثالث والسبعون - مقدمة إلى تطوير المواقع
#1
كاتب الموضوع : أحمد جمال

بسم الله الرحمن الرحيم .
السلام عليكم ورحمة الله وبركاته .


الآن نبدا في مجموعة من الدروس عن موضوعنا الاخير لهذه السلسلة ، وهو الموضوع الخاص بتطوير مواقع الإنترنت باستخدام ASP.net .
فيما مضى من الدروس ، كنا نتحدث في عالم ال Console وال Desktop Applications ، وخلال هذه المراحل كنا نعتمد على وجود جهاز واحد للتنفيذ ، وحتى في حالة وجود شبكة فقد كان الوضع يعتمد على عمليات ارسال واستقبال بيانات بين الجهازين او المشاركة في المصادر او الاتصال ب web service كما رأينا ، اما مع عالم ال ASP.net او عالم ال server side languages عموماً فالوضع مختلف نسبياً ، ولذا قبل البداية نحب ان نتعرف على انواع مواقع الإنترنت :

- مواقع ثابتة : هذه المواقع عبارة عن مجموعة من التوصيفات باستخدام HTML ، يمكن استخدام صور وفلاشات وخلافه ولكن لا يوجد اي نوع من انواع المعالجة في هذا الموقع .
- موقع ديناميكية عند العميل : هذا النوع من المواقع يتمتع ببعض انواع المعالجة ولكنها تظل في جانب العميل فقط ، يتم في هذه المواقع استخدام Scripts مثل Java و VBScript ، لكن الصفحة التي تراها امامك تعمل عندك انت فقط .
- مواقع دينامكية : هذا النوع يتم عمل معالجة لبياناته في السيرفر وتحصل انت فقط على الناتج الذي يمكن ان يكون من النوع الأول والثاني ، في هذه الحالة يسمى تطبيق انترنت وليس موقع انترنت .


مثال :
صفحة بريدك الالكتروني التي تراها امامك هي صفحة من النوع الثاني حيث تحتوي على بعض اوامر الجافا سكريبت اضافة لبعض الجداول والحقول وخلافه من HTML ، لكن في الواقع فإن تشكيل هذه الصفحة بهذه الصيغة جاء عن طريق بعض عمليات السيرفر التي قامت بقراءة بعض قواعد البيانات وشكلت لك الجداول التي تحتوي على البريد الوارد لك وخلافه .
لذا في هذه الصفحة انت غير قادر على رؤية اكواد اللغة التي تمت برمجة السيرفر بها ، ولكنك تستطيع مشاهدة النتائج فقط حيث ان عمليات المعالجة تتم على السيرفر فقط .
}}}
تم الشكر بواسطة:
#2
دورة حياة تطبيق الإنترنت :

بمجرد ادخالك لعنوان موقع ما يبتدأ ب http:// - وهو ما يعني انك ستستخدم بروتوكول http - يقوم البروتوكول بارسال هذا العنوان إلى ما يعرف ب Domain Name Server واختصاراً باسم DNS ، يقوم هذا ال DNS بتحويل الكتابة التي قمت بكتابتها لعنوان Physical على الإنترنت خاص بال IP صاحب الموقع ، شكل ال DNS يكون بالشكل التالي كمثال :



الآن اصبح بالامكان معرفة IP المميز لهذا الموقع ، الآن يتم فتح port - غالباً ما يكون 80 - ويتم ارسال طلب المعالجة إلى هذا الموقع وهو ما نطلق عليه http Request .
في حالة كون الموقع static ، يتم الرد بالصفحة المطلوبة فقط ، اما في حالة كون الصفحة dynamic يتم معالجة البيانات المطلوبة وارسال صفحة النتائج إلى المستخدم وهو ما نطلق عليه http Response .

- لكل بروتوكل دورة عمل ، وما يهمنا هنا هو http فقط .
}}}
تم الشكر بواسطة:
#3
مواقع العميل Client Side Web Sites :

يستلزم هذا النوع بداية معرفة ب HTML ، وهي لغة سهلة جداً يمكنك التعرف عليها خلال اقل من نصف ساعة عن طريق هذا الرابط مثلاً :
www.html4arab.com

ومع ظهور برامج ابتداء ب Front Page وانتهاء ب Dream Waver ، اصبح بامكانك عمل الموقع دون اي معرفة بال HTML عن طريق الادوات فقط .
ايضاً تحتاج ل Java او vbscript لبرمجة بعض الخصائص ، ايضاً ضمن ال HTML تجد عالم ال Forms الذي سيمكنك من التواصل مع العالم الخارجي ، وتحتاج لبعض المعرفة في هذا الموضوع ، يمكنك مراجعة الدرس التالي كبداية لل vbscript :
http://vb4arb.com/vb/showthread.php?1625
والدرس التالي كبداية لل javascript :
http://www.epal.ps/vb/showthread.php?t=276

والآن اتوقع انك ملم بالاساسيات فقط ، لا اطلب منك الكثير في هذا المجال حالياً ...
}}}
تم الشكر بواسطة:
#4
الفرق بين تطبيق الويب Web Application وخدمة الويب Web Service :

- تطبيق الويب هو عبارة عن مجموعة من الصفحات وملفات الاكواد وقواعد البيانات التي لها دورة حياة خاصة مثلها مثل اي برنامج ، يتم فتحها واغلاقها وتنفيذ احداث وخلافه
- اما خدمة الويب فهي عبارة عن خدمة تستقبل بعض البيانات وتعيدها بعد بعض عمليات المعالجة ، يتم التعامل معها من اي لغة برمجة قادرة على الوصول إلى اسمها ورقم البورت فقط .



ال IIS :
هو السيرفر الخاص ببرمجيات ASP و ASP.net ، ووجوده شرط اساسي ليعمل كودك ال ASP.net سواء على جهازك الشخصي أو على السيرفر الذي ستسضيف عليه موقعك لاحقاً .
كونك قمت بعمل setup لل visual studio يعني انك قمت بتحميل ال IIS او للدقة فأنت قمت بتحميل WebDev.WebServer.exe والذي يشمل ال IIS ، اما إذا كنت تود البرمجة على المفكرة Notepad مثلاً فلا بد من عمل setup له ، وذلك عن طريق اختيار لوحة التحكم Control Panel - اضافة وازالة برامج Add And Remove Programmes واختر اضافة مكونات ويندوز Add Windows Compomnent ، ستجد من ضمنها Internet Inforamtion Services وهو ال IIS .

** الطريقة السابقة كل حسب نظام التشغيل الذي يعمل عليه .
}}}
تم الشكر بواسطة:
#5
تجارب بسيطة :

قم بفتح Notepad جديد ، قم بتسميتها لتكون index.html مثلاً ثم قم بكتابة المحتويات التالية فيها :

كود :
[color=#000080]<html>[/color]
[color=#000080]<head>[/color]
[color=#000080]<title>[/color]My First Pgae[color=#000080]</title>[/color]
[color=#000080]</head>[/color]
[color=#000080]<body>[/color]
[color=#000080]<center>[/color][color=#800080]<img src=[COLOR=#0000ff]"http://l.yimg.com/a/i/ww/beta/y3.gif"[/color]>[/COLOR][color=#000080]</centeR>[/color]
[color=#000080]<br>[/color]
[color=#000080]<font color=red size=3>[/color]Yahoo![color=#000080]</font>[/color]
[color=#000080]<br>[/color]
[color=#008000]<a href=[COLOR=#0000ff]"http://www.yahoo.com"[/color]>[/COLOR]Link Here[color=#008000]</a>[/color]
[color=#000080]</body>[/color]
[color=#000080]</html>[/color]


جرب تشغيلها مباشرة بالضغط المزدوج عليها ، مبروك ، هذه اول صفحة انترنت لك .

الآن سنقوم برسم الفورم التالي لادخال البيانات :


الكود الخاص بهذا الفورم كالتالي :

كود :
[color=#000080]<html>[/color]
[color=#000080]<head>[/color]
[color=#000080]<title>[/color]My First Pgae[color=#000080]</title>[/color]
[color=#000080]</head>[/color]
[color=#000080]<body>[/color]
[color=#000080]<h2>[/color]Welcome !![color=#000080]</h2>[/color]
[color=#000080]<br>[/color]
[color=#ff8000]<form name=[COLOR=#0000ff]"form1"[/color]>[/COLOR]
[color=#008080]<table border=0>[/color]
[color=#008080]<tr>[/color]
[color=#008080]<td>[/color]
Name
[color=#008080]</td>[/color]
[color=#008080]<td>[/color]
[color=#ff8000]<input type=text name=textname size=10>[/color]
[color=#008080]</td>[/color]
[color=#008080]</tr>[/color]
[color=#008080]<tr>[/color]
[color=#008080]<td>[/color]
Password
[color=#008080]</td>[/color]
[color=#008080]<td>[/color]
[color=#ff8000]<input type=password name=textpass size=10>[/color]
[color=#008080]</td>[/color]
[color=#008080]</tr>[/color]
[color=#008080]</table>[/color]
[color=#000080]<br>[/color]
[color=#ff8000]<input name=[COLOR=#0000ff]"button1"[/color] type=button value=[color=#0000ff]"do anything"[/color]();">
[b][i]&nbsp;[/i][/b][b][i]&nbsp;[/i][/b][b][i]&nbsp;[/i][/b]
<input type=reset value=[color=#0000ff]"Clear"[/color]>[/COLOR]
[color=#ff8000]</form>[/color]
[color=#000080]</body>[/color]
[color=#000080]</html>[/color]


والآن نريد ان نقوم بالتأكد من أن المستخدم قام بادخال بيانات في الفورم ، لو قام بادخال بيانات فسوف نظهرها له في رسالة نصية وعلى الشاشة ايضاً ، لذا سنذهب للزر Button1 ونغيره ليصبح بالشكل التالي :


كود :
[color=#ff8000]<input name=[COLOR=#0000ff]"button1"[/color] type=button value=[color=#0000ff]"do anything"[/color] onClick=[color=#0000ff]"doCheck();"[/color]>[/COLOR]


ومن ثم في آخر الصفحة سوف نقوم بكتابة ال Script التالي :

كود :
[color=#800000]<script language=[COLOR=#0000ff]"javascript"[/color]>[/COLOR]
function doCheck()
{
if(form1.textname.value!="" || form1.textpass.value!="")
{
alert(form1.textname.value);
document.write(form1.textpass.value);
}
else
alert("enter data first !");
}
[color=#800000]</script>[/color]



استخدام Visual Studio :
سننقل نفس هذه التجربة البسيطة ولكن باستخدام ASP.net من خلال Visual Studio ، قم بفتح الفيجوال ستوديو وقم باختيار ويب جديد Website ثم اختر ASP.net Web Site :


الآن قم برسم نفس الفورم ولكن من الادوات الجانبية :


لا تنس اننا حتى اللحظة نتعامل مع ادوات HTML وليست ادوات ASP.net .

وعندما تقوم بوضع الكود ، قم بالضغط المزدوج على Button وقم بكتابة الأوامر مباشرة :


يمكنك استعراض التصميم والكود سوية او كل واحدة منهما عن طريق التبويب اسفل الصفحة :


فقط ... كانت هذه هي تجربتنا البسيطة ، في الدرس القادم سنبدأ بالتعامل مع ASP.net .

والله الموفق ...
والسلام عليكم ورحمة الله وبركاته .
}}}
تم الشكر بواسطة:



التنقل السريع :


يقوم بقرائة الموضوع: بالاضافة الى ( 1 ) ضيف كريم