الموقع الرسمى لمدينة اوسيم
هل تريد التفاعل مع هذه المساهمة؟ كل ما عليك هو إنشاء حساب جديد ببضع خطوات أو تسجيل الدخول للمتابعة.


الموقع الرسمى لمدينة اوسيم
 
الرئيسيةأحدث الصورالتسجيلدخول

 

 للمبتدئين فى برمجة الويب ( موضوع مفيد جداا )

اذهب الى الأسفل 
كاتب الموضوعرسالة
Admin
Admin
Admin
Admin


عدد المساهمات : 408
تاريخ التسجيل : 25/10/2011
العمر : 31
تعاليق : لا اله الا الله عدد ماكان وعدد مايكون وعدد الحركات والسكون

لاتكن جبانا أثبت وجودك في المنتدى
قل كلمتك

للمبتدئين فى برمجة الويب ( موضوع مفيد جداا )  Empty
مُساهمةموضوع: للمبتدئين فى برمجة الويب ( موضوع مفيد جداا )    للمبتدئين فى برمجة الويب ( موضوع مفيد جداا )  Emptyالأربعاء نوفمبر 02, 2011 12:30 am

للمبتدئين فى برمجة الويب ( موضوع مفيد جداا )  180px-Bismillah.svg

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

الموضوع هيكون عبارة عن دردشة فى الويب , لغات برمجة الويب , تقنيات الويب , ....
للمبتدئين فى برمجة الويب ( موضوع مفيد جداا )  Gray_bar_500x20
لغات برمجة الويب - بتعمل ايه - ازاى اشتغل بيها - منين اتعلم - والفرق بينهم
معرفة عامة ب الأستضافة والحماية و الجوايز و الوظائف فى الويب
مصطلحات مهمة لمبرمجى الويب
للمبتدئين فى برمجة الويب ( موضوع مفيد جداا )  Gray_bar_500x20
اولا لازم نعرف يعنى ايه انترنت او ويب INTERNET
الأنترنت عبارة عن مجموعة كبيرة جدا من الكمبيوترات
متوصلة مع بعضها علشان تتبادل المعلومات مع بعضها , واى شخص فى العالم ممكن
يدخل على الانترنت ويتبادل المعلومات


اوك , ايه بقى ال client , server
ال client الزبون اللى هو انت او جهازك اللى بتدخل منه ع النت علشان تتبادل المعلومات
و ال server ده عبارة عن جهاز موجود عليه الموقع اللى انت عاوزه , وده الجهاز البعيد , وهو عادة جهاز بيقدم خدمة .

للمبتدئين فى برمجة الويب ( موضوع مفيد جداا )  Gray_bar_500x20
اوك , طب ايه هو ال web browser
بالعربى هو المتصفح , ده برنامج انت بتنزله عندك على الجهاز بيسمحلك انك تتصفح المواقع اللى ع النت . والأمثلة معرفة
انترنت اكسبلورر ie
فايرفوكس ff
جوجل كروم Gc
سفارى Safari

للمبتدئين فى برمجة الويب ( موضوع مفيد جداا )  Gray_bar_500x20
كده لازم نعرف web server
ده برنامج بيكون موجود على السيرفر او الجهاز البعيد وده
اللى بيستقبل الطلبات من الزباين (الناس اللى عاوزه تشوف موقع على
السيرفر) ويرد عليهم بصفحات html
ومن اشهر web servers الموجودة
Apache

للمبتدئين فى برمجة الويب ( موضوع مفيد جداا )  Gray_bar_500x20
جميل جدا , كده انا فهمت .
يعنى انا لو عاوز الموقع بتاعى اى حد يشوفه بحطه على ويب سيرفر والناس تستخدم ال browser
علشان يشوفوا موقعى . تمام كده

للمبتدئين فى برمجة الويب ( موضوع مفيد جداا )  Gray_bar_500x20
طيب , انا عاوز اعمل موقع ازى !

قدامك طريقين , واحد سهل وواحد سهل
الأول
انك تجيب برنامج يسهل عليك الليلة لو انت مش عاوز تكتب كود وكلام من ده
كل الحكاية انك هتجيب برنامج تصميم مواقع زى
frontpage
او
dreamweaver

اوك , وتصطبه عندك على الجهاز , وعيش معاه العملية سهلة كلها انك بتكتب كلام و تشد صور
وكليك يمين , حاجة كده لعب عيال ! وفى الأخر البرنامج هيسيفلك الصفحات html وجنبها الصور.

كل اللى هتعلمه هترفع الصفحات دى على سيرفر , وبس
# هنتكلم عن ده بعدين , الهوستنج و الرفع و الكلام ده
للمبتدئين فى برمجة الويب ( موضوع مفيد جداا )  Gray_bar_500x20
طيب , تمام والطريقة التانية لعمل موقع ايه ؟
انك تكتب انت الكود بأيدك , وده طبعا مسلية ووسهلة

طيب , كود ايه واكتب فين وايه النظام .
بدون شرح كتير انت لازم تتعلم HTML
HTML : اختصار ل hypertext markkup language
لغة ترميز النصوص ! , خلى بالك ,, لغة ترميز
html مش لغة برمجة ! , يعنى لعب عيال برده

نعم ؟ , HTML مش لغة برمجة ؟
ايوة , دى لغة ترميز , كل الحكاية انك بتحط كلمة
مثلا يبن تاجين او وسمين (</><>) , وهما هيضبطوا النص هيتعرض
ازاى , بمعنى انها لغة عرض نصوص
يعنى تعرض نص سميك , نص مائل , بلون احمر , تعرض صورة , جدول , ....

مثال بسيط اوى :

كود:

<b>hello absba</b>

فى المثال اللى فوق كلة "hello absba" موجودة بين وسمين b و سم فتح ووسم قفل
الوسم ده كل مهمته فى الحياة انه يخلى الكلام بين الوسمين سميك يعنى تخين
والنتيجة هتكون كده :

hello absba
بس !

# خير دليل انك لو عاوز تكتب كلمة absba مائة مرة , هتعمل ايه ؟
هتكتبها مائة مرة , انما لو لغة برمجة بقى قى 3 اسطر بس !
للمبتدئين فى برمجة الويب ( موضوع مفيد جداا )  Gray_bar_500x20
اوك , طب انا عاوز اتعلم html , ايه النظام ياهندسة ؟
كل اللى انت محتاجه حاجتين , وهما متصطيبن وموجدين عندك ع الجهاز (سواء كنت ويندوز او لينكس )
1) browser متصفح مثل ie , ff , google chrome
2) editor محرر نصوص مثل notepad وانا بفضل notepad++ (برنامج مجانى مفتوح المصدر . ابحث جوجل )
الرجوع الى أعلى الصفحة اذهب الى الأسفل
https://awseemvb.all-up.com
Admin
Admin
Admin
Admin


عدد المساهمات : 408
تاريخ التسجيل : 25/10/2011
العمر : 31
تعاليق : لا اله الا الله عدد ماكان وعدد مايكون وعدد الحركات والسكون

لاتكن جبانا أثبت وجودك في المنتدى
قل كلمتك

للمبتدئين فى برمجة الويب ( موضوع مفيد جداا )  Empty
مُساهمةموضوع: رد: للمبتدئين فى برمجة الويب ( موضوع مفيد جداا )    للمبتدئين فى برمجة الويب ( موضوع مفيد جداا )  Emptyالأربعاء نوفمبر 02, 2011 12:31 am

طيب , هتعلم منين ؟

ده اقوى موقع اجنبى هتقابله فى تعليم الويب :
http://www.w3schools.com/html/default.asp
وده كمان كويس
http://www.khayma.com/HPINARABIC/HTMINTRO.HTML (عربى وانجليزى )
وده اشهر موقع عربى :
http://www.khayma.com/HPINARABIC/HTMINTRO.HTML

بس , كل الحكاية انك هتكتب اكود بسيطة فى ال editor وبعدين تحفظ الملف بامتداد html
وبعدين تفتحه بال browser
للمبتدئين فى برمجة الويب ( موضوع مفيد جداا )  Gray_bar_500x20
طيب , نشوف مثال ع السريع
اوك , افتح notepad واكتب الكود ده

كود:

<html>
<head>
<title>my first page</title>
</head>
<body>
hello world !
</body>
</html>

احفظ الملف بامتداد html يعنى زى كده
mypage.html
اوك , افتح الملف هيفتح تلقائى فى ال browser وهتلاقى كلمه! helloworld
بس , ياسيدى انت كده عملت صفحة نت , مبروك عليك
للمبتدئين فى برمجة الويب ( موضوع مفيد جداا )  Gray_bar_500x20
طيب , دلوقتى انا عارف html وبعرف اعمل صفحة
واغير الخلفية و اعمل صور واحطها يمين شمال زى ما انا عاوز , وبعمل جداول ,
وبضبط النصوص , وبعمل روابط , ..... الخ ... ايه بعد كده ؟؟؟؟؟

للمبتدئين فى برمجة الويب ( موضوع مفيد جداا )  Gray_bar_500x20
فى حاجة اسمها css دى بتضبطلك شكل الصفحة , وتقدر بيها تعمل استايل فى ملف وتستخدمه فى اكتر من صفحة
يعنى مش لازم فى كل صفحة انك تغير الخط وتكبر العناوين . اعمل بس انت ملف css واستدعيه فى كل الصفحات بتاعة الموقع
وهو يضبط كل حاجة , طبعا ده غير المؤثرات التانية اللى متقدرش تعملها ب html يعنى مثلا الحدود بتاعة الجدول شوف مثلا الصفحة دى

http://www.w3schools.com/css/tryit.a...s_border-style
وحاجات تانية كتير , ده غير انك هتسيب بقى التصميم بالجداول وتشتغل tables وده الأفضل بكتير .
وفيه كمان مؤثؤات ع الصور , حجاة زى دى كده

http://www.w3schools.com/css/tryit.a...e_transparency
وتقدر تعمل اكتر من استايل فى استايل واحد , كل واحد
منهم لأداة مختلفة (متصفح الجهاز , متصفح الموبايل , الطابعة , برايل للويب
و ..) كل ده عن طريق Media Types
من الأخر css بتخلى شكل الصفحة جامد جداااا

للمبتدئين فى برمجة الويب ( موضوع مفيد جداا )  Gray_bar_500x20
طيب عاوز اتعلم css ؟
الموقع ده هيتكرر معانا كتير - احفظه فى المفضلة
http://www.w3schools.com/css/default.asp
وده انجليزى كمان
http://www.cssbasics.com/
, وده عربى
http://ar.html.net/tutorials/css/
للمبتدئين فى برمجة الويب ( موضوع مفيد جداا )  Gray_bar_500x20
ايه بقى اللى بعد كده ؟

انت كده عامل صفحة static او ثابتة بمعنى ان مفيش تفاعل مع المستخدم , يعنى المستخدم اخره
مع صفحتك انه يضغط على الروابط , ...

فى بقى حاجة اسمها جافا سكريبت هى اللى بضبط القصة دى
قبل مانعرف هى ايه وليه ونعمل hello world , تعالى نشوف القصة دى

لغات برمجة الويب نوعين : -
server side و client side
1) server side او لغات جانب السيرفر
دى لغات بتطبق عند السيرفر و بترجع لنا صفحة html صافية , زى php و asp و jsp
مثال بسيط : الصفحة اللى قدامك دى امتدادها php انت لما بتطلبها من السيرفر - بيبدأ السيرفر يشوف هى ايه php اوك , تروح ل php engine او محرك ال php يتعامل معاها ويترجمه , ويرجع html
ويبعته للسيرفر و يرجعه السيرفر html صافى , يعنى انت مبتشوفش الكود بتاع php !
مش مصدق اعمل click يمين , وبعدين view source
هتلاقى كله html اللى انت عرفته من شوية !


2) client side او لغات جانب المتصفح
من اسمها باين اوى انها بتطبق عند المستخدم او الرجل اللى بيشوف الموقع زى ايه الجافا سكريبت و vb script وغيره .. ودى بقى تقدر تشوف الكود بتاعها لأنها بتطبق عندك !
مش مصدق اعمل click يمين , وبعدين view source
ودور على كلمة script وهتلاقى كود جافا سكريبت !


جميل جدا , انا كده فهمت الليلة ماشية ازاى , نكمل بقى فى الجافا سكريبت ...
# المرة الجاية , نكمل جافا سكريبت و نعمل hello world ع السريع ونشوف حوارات تانية , اوك ؟

للمبتدئين فى برمجة الويب ( موضوع مفيد جداا )  Gray_bar_500x20
ملحوظات :
# المواقع الأنجليزى افضل بكتير من المواقع العربى .
# استخدم جوجل للوصول لما تريد مثلا عاوز تعريف server
افتح جوجل واكتب :





define:server






وهتلاقى نتايج مختلفة تماما , على غير العادة !
استخدم كلمة define مع اى كلمة انت عاوز تعرف معناها
- استنى النتايج بتاعة البحث انجليزى , عاوز اترجمها عربى
جوجل برده , من الصفحة الرئيسية هتلاقى Language Tools او ادوات اللغة - اضغط عليها وعيش !
للمبتدئين فى برمجة الويب ( موضوع مفيد جداا )  Gray_bar_500x20
# لو فى اى اسئلة او اى حاجة مش واضحة , لاتترد أسأل و هتلاقى كل شئ
وضح معاك .

للمبتدئين فى برمجة الويب ( موضوع مفيد جداا )  Gray_bar_500x20
اشوفكم - المرة الجاية . علشان نكمل الباقى ...
الرجوع الى أعلى الصفحة اذهب الى الأسفل
https://awseemvb.all-up.com
Admin
Admin
Admin
Admin


عدد المساهمات : 408
تاريخ التسجيل : 25/10/2011
العمر : 31
تعاليق : لا اله الا الله عدد ماكان وعدد مايكون وعدد الحركات والسكون

لاتكن جبانا أثبت وجودك في المنتدى
قل كلمتك

للمبتدئين فى برمجة الويب ( موضوع مفيد جداا )  Empty
مُساهمةموضوع: رد: للمبتدئين فى برمجة الويب ( موضوع مفيد جداا )    للمبتدئين فى برمجة الويب ( موضوع مفيد جداا )  Emptyالأربعاء نوفمبر 02, 2011 12:32 am

عرفنا فى المرة السابقة اشياء كثير مهمة وهى :

- html مش لغة برمجة وانما لغة ترميز .
- Css تستخدم لتظبيط شكل الصفحة .
- المهم ان لغات برمجة الويب نوعين :
# لغات جانب السيرفر # لغات جانب المتصفح
وكل منها يطبق فى مكانه , اى لغات جانب السيرفر تعمل على السيرفر وهكذا...
################################################## ####
هنتكم بقى عن الجافا سكريبت
الجافا سكريبت لغة client side او لغة من لغات جانب المتصفح
اى انها تطبق على المتصفح
لذا يمكن لك ان ترى الكود الأصلى لها , اعمل كليك يمين و بعدين view source
- الأسم الأصلى لها ECMAScript واللى عاملها راجل اسمه Brendan Eich
- تستخدم لعمل ديناميكية بالصفحة .
- ممكن تعمل صفحة محتواها متغير .
- تقدر بيها تغير فى html الموجود بالصفحة , يعنى مثلا تعمل زر يغير الخلفية بتاعة الصفحة
او يغير مصدر الصورة او يخفى حاجة مثلا ...

- بيها تقدر تعرف نوع المتصفح بتاع الراجل اللى
بيزور موقعك , وبناء عليه ممكن تعرض له صفحة معينة , يعنى ممكن تعمل صفحة
تتعرض لما يكون المتصفح if و صفحة تانية ل ff وهكذا , ودى حلت
مشاكل كتير فى التصميم احيانا .

- تقدر تعمل بيها check على الداتا و ده مهم جداا , بتوفر شغل كتير وجهد كبير ع السيرفر .
- تقدر تعمل حركة فى الصفحة - مثلا تنقل صورة بالماوس من مكان لمكان .
- فى فرق كبير جدااا , بين الجافا و الجافا سكريبت !
- تقدر تعمل بيها مؤثؤات كتيرة , ساعات , امطار , مؤثرات صوت , العاب , مؤثرات ع الماوس , ... الخ
الجافا سكريبت : لغة من لغات برمجة الويب بتعمل الحاجات اللى فوق .
اما الجافا فهى لغة برمجة قوية جدا مشهورة فى برامج desktop application ودى قصة تانية خالص
حاجة كده زى الفيجوال بيسيك و c و c# وهكذا ..
################
طيب , ناخد مثال hello world
ده الرابط , لأن المنتدى عامل block لكلمة جافاسكريبت بالأنجليزى
http://www.w3schools.com/js/tryit.as...ame=tryjs_text
##################
جميل جدا , انا عاوز اتعلم جافا سكريبت ؟
- شوف الكام موقع دول وابدا :
http://www.w3schools.com/js/js_intro.asp
http://www.echoecho.com/**********.htm
http://www.wdvl.com/Authoring/**********/Tutorial/
http://www.cs.brown.edu/courses/brid...-tutorial.html
http://www.howtocreate.co.uk/tutorials/**********/
# استبدل النجوم بكلمة جافا سكريبت بالأنجليزى
وده صفحة فيها اكواد كتير :
http://www.star28.com/java/
#################
طيب , سؤال لازم تفكر فيه , ليه المنتدى عامل بلوك لكلمة جافا سكريبت ؟
- فى حاجة اسمها كوكيز
وده ملف الموقع بيحطه عندك علشان يعرفك لما تزور الموقع مرة تانية , مش لازم تدخل اليوزر والباص كل مرة تزور فيها الموقع .
- ممكن عن طريق الجافا سكريبت تتحكم فى الملف ده و تشوفه وتعدل فيه كمان
وفى ثغرة مشهورة اسمها xss بتستخدم الجافا سكريبت علشان تسرق الملف ده
- فالمنتدى بيمنع الكلمة دى خالص علشان مفيش اى حد يكتب كود جافا سكرييت

http://tech.spmmf.com/2009/06/cookies/
#################################################
ندخل فى PHP
- لغة من لغات جانب السيرفر , اى تطبق على السيرفر يعنى مش هتشوف الكود .
- الصفحة بترجعلك من السيرفر html .
- مشهورة جداا لأنها مجانية و مفتوحة المصدر و سهلة التعلم و فيها دوال
كتير جدااااا وبتتعامل مع اكتر من قاعدة بيانات و معظم شركات الأستضافة
بتدعمها .
- البى اش بى اختصار ل
PHP Hypertext Preprocessor
طب وال php اللى فى الأول اختصار ل أيه ؟
PHP Hypertext Preprocessor
وهكذا للمبتدئين فى برمجة الويب ( موضوع مفيد جداا )  Smile , زى ال GNU اختصار ل
GNU is not unix
وهكذا ......
- بتتعامل مع قواعد بيانات كتير اوى اشهرها mysql و oracle .
###############################
طيب عاوز اتعلم php ؟
لازم يكون عندك 3 حاجات
PHP
Web Server like appache
MYSQL
- ممكن تنزل كل واحد من موقعه , او تنزل تستخدم ال wamp
وده اختصار ل
windows appache mysql php
وده رابط التحميل http://www.wampserver.com/download.php
شغل البرنامج وكل حاجة هتشتغل تمام :
- ملفاتك اللى هتكتبها هتحطها فى المكان ده
c:/wamp/www/
- دلوقتى افتح ال editor واكتب :
كود PHP:
<?php
echo "hello world" ;
?>


- بعدين , احفظ الملف بامتداد php فى المسار السابق
- افتح المتصفح وافتح واكتب
http://localhost/filename.php
- filename.php ده اسم الملف بتاعك
- بكده هتشوف كلمة hello world
الرجوع الى أعلى الصفحة اذهب الى الأسفل
https://awseemvb.all-up.com
Admin
Admin
Admin
Admin


عدد المساهمات : 408
تاريخ التسجيل : 25/10/2011
العمر : 31
تعاليق : لا اله الا الله عدد ماكان وعدد مايكون وعدد الحركات والسكون

لاتكن جبانا أثبت وجودك في المنتدى
قل كلمتك

للمبتدئين فى برمجة الويب ( موضوع مفيد جداا )  Empty
مُساهمةموضوع: رد: للمبتدئين فى برمجة الويب ( موضوع مفيد جداا )    للمبتدئين فى برمجة الويب ( موضوع مفيد جداا )  Emptyالأربعاء نوفمبر 02, 2011 12:32 am

####################################
طيب , اتعلم منين ?
http://www.php.net/tut.php
http://www.w3schools.com/php/default.asp
http://www.easyphp.org/index.php
http://www.php-mysql-tutorial.com/
http://www.goodphptutorials.com/
http://www.developertutorials.com/tutorials/php/
####################################
انتهى الجزأ التانى : -
################################
سؤال : -
# هل تعرف الفرق بين
programming language
scripting language
و php تصنف تحت اى نوع ؟
###############################
عاوز اسئلة و ردود ع السؤال
###########################
الرجوع الى أعلى الصفحة اذهب الى الأسفل
https://awseemvb.all-up.com
 
للمبتدئين فى برمجة الويب ( موضوع مفيد جداا )
الرجوع الى أعلى الصفحة 
صفحة 1 من اصل 1
 مواضيع مماثلة
-
» الفصل التاسع نشر مواقع الويب
» شرح مصور للمبتدئين كيفية عمل منتدى vb على استضافة مجانية
»  الفصل السابع إضافة بعض التأثيرات الى صفحات الويب
» دورة سوفت للمبتدئين والمحترفين
» 23 سؤال قبل فك الشفره من الالف الى الياء (للمبتدئين)

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