تعلم برمجة الانترنت

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

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

اوك , ايه بقى ال client , server
ال client الزبون اللى هو انت او جهازك اللى بتدخل منه ع النت علشان تتبادل المعلومات
و ال server ده عبارة عن جهاز موجود عليه الموقع اللى انت عاوزه , وده الجهاز البعيد , وهو عادة جهاز بيقدم خدمة .
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]
اوك , طب ايه هو ال web browser
بالعربى هو المتصفح , ده برنامج انت بتنزله عندك على الجهاز بيسمحلك انك تتصفح المواقع اللى ع النت . والأمثلة معرفة
انترنت اكسبلورر ie
فايرفوكس ff
جوجل كروم Gc
سفارى Safari
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]
كده لازم نعرف web server
ده برنامج بيكون موجود على السيرفر او الجهاز البعيد وده اللى بيستقبل الطلبات من الزباين (الناس اللى عاوزه تشوف موقع على السيرفر) ويرد عليهم بصفحات html
ومن اشهر web servers الموجودة
Apache
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]
جميل جدا , كده انا فهمت .
يعنى انا لو عاوز الموقع بتاعى اى حد يشوفه بحطه على ويب سيرفر والناس تستخدم ال browser
علشان يشوفوا موقعى . تمام كده
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]
طيب , انا عاوز اعمل موقع ازى !

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

كل اللى هتعلمه هترفع الصفحات دى على سيرفر , وبس
# هنتكلم عن ده بعدين , الهوستنج و الرفع و الكلام ده
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]
طيب , تمام والطريقة التانية لعمل موقع ايه ؟
انك تكتب انت الكود بأيدك , وده طبعا مسلية ووسهلة

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

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

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

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

ده اقوى موقع اجنبى هتقابله فى تعليم الويب :
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]
وده كمان كويس
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط] (عربى وانجليزى )
وده اشهر موقع عربى :
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]

بس , كل الحكاية انك هتكتب اكود بسيطة فى ال editor وبعدين تحفظ الملف بامتداد html
وبعدين تفتحه بال browser
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]
طيب , نشوف مثال ع السريع
اوك , افتح notepad واكتب الكود ده

كود:
<html>
<head>
<title>my first page</title>
</head>
<body>
hello world !
</body>
</html>
احفظ الملف بامتداد html يعنى زى كده
mypage.html
اوك , افتح الملف هيفتح تلقائى فى ال browser وهتلاقى كلمه! helloworld
بس , ياسيدى انت كده عملت صفحة نت , مبروك عليك
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]
طيب , دلوقتى انا عارف html وبعرف اعمل صفحة واغير الخلفية و اعمل صور واحطها يمين شمال زى ما انا عاوز , وبعمل جداول , وبضبط النصوص , وبعمل روابط , ..... الخ ... ايه بعد كده ؟؟؟؟؟

[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]
فى حاجة اسمها css دى بتضبطلك شكل الصفحة , وتقدر بيها تعمل استايل فى ملف وتستخدمه فى اكتر من صفحة
يعنى مش لازم فى كل صفحة انك تغير الخط وتكبر العناوين . اعمل بس انت ملف css واستدعيه فى كل الصفحات بتاعة الموقع
وهو يضبط كل حاجة , طبعا ده غير المؤثرات التانية اللى متقدرش تعملها ب html يعنى مثلا الحدود بتاعة الجدول شوف مثلا الصفحة دى
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]
وحاجات تانية كتير , ده غير انك هتسيب بقى التصميم بالجداول وتشتغل tables وده الأفضل بكتير .
وفيه كمان مؤثؤات ع الصور , حجاة زى دى كده
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]
وتقدر تعمل اكتر من استايل فى استايل واحد , كل واحد منهم لأداة مختلفة (متصفح الجهاز , متصفح الموبايل , الطابعة , برايل للويب و ..) كل ده عن طريق Media Types
من الأخر css بتخلى شكل الصفحة جامد جداااا
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]
طيب عاوز اتعلم css ؟
الموقع ده هيتكرر معانا كتير - احفظه فى المفضلة
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]
وده انجليزى كمان
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]
, وده عربى
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]
ايه بقى اللى بعد كده ؟

انت كده عامل صفحة 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 ع السريع ونشوف حوارات تانية , اوك ؟
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]
ملحوظات :
# المواقع الأنجليزى افضل بكتير من المواقع العربى .
# استخدم جوجل للوصول لما تريد مثلا عاوز تعريف server
افتح جوجل واكتب :

اقتباس:

define:server

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

الموضوع الأصلي : تعلم برمجة الانترنت المصدر : منتدى لمسة احساس الكاتب: القناص الناري

|| توقيع العضو ~ القناص الناري