كتاب الأنشطة للحاسب الآلى للصف الثانى الثانوى للترم...

مشروع

)تصميم مواقع الويب( شنطة ااتتريباا كتاب األ

الثانوي الثاني الصف

األول الدراسي الفصل

2015/2016

مارة تتشنمب اتعام اإلراية

ميكز تةابي اتمشناهج ااتماار اتتعلبمب اتمعلاما اتكشناتاجبا اتكماباتي

)تصميم مواقع الويب(

1

اتاف اتثاشنى اتثاشناى –تااتا ااإل اتمعلاما اتكماباتي اتكشناتاجبا

تكنولوجيا المعلومات واالتصاالت مشروع

)تصميم مواقع الويب( كتاب األنشطة والتدريبات

الصف الثاني الثانوي لفصل الدراسي األولا

إعـداد د/ طاهر عبد الحميد العدلي

خبير مناهج الكمبيوتر وتكنولوجيا المعلومات مركز تطوير المناهج والمواد التعليمية

أ/ أحمد عبد هللا منصور وتكنولوجيا المعلوماتخبير كمبيوتر

إدارة مادة الكمبيوتر وتكنواوجيا المعلومات يوسفأ/ محمد يوسف الصادق

وتكنولوجيا المعلوماتخبير كمبيوتر إدارة مادة الكمبيوتر وتكنواوجيا المعلومات

أ/ أحمد األنصاري السالموني وتكنولوجيا المعلوماتخبير كمبيوتر

إدارة مادة الكمبيوتر وتكنواوجيا المعلومات

مراجعة تربوية

ر/ ياجبشنا محمر حجازي اهج والمواد التعليميةمركز تطوير المنخبير المناهج

مراجعة علمية

أ/ ماطاء هللا محمر محمر إدارة مادة الكمبيوتر وتكنواوجيا المعلوماتمدير عام

محمر فهمي ةلا أ.ر/ أستاذ الحاسبات والمعلومات بجامعة عين شمس

تصميم

محمد عبير محمد أنورأ/ وتكنولوجيا المعلوماتخبير كمبيوتر إدارة مادة الكمبيوتر وتكنواوجيا المعلومات

2


مقرم اتكتاب

تبنرري التعليميررة العمليررةعلررم واالتصرراالتمررات المعلو اتكنولوجيررفررم مجررا لتطررور المسررتمر فرررا اي .المتالحقةالتطورات هذه مواكبة ل توجهات ورؤى جديدة

تكنولوجيررا المعلومررات واالتصرراالتمررنهج لمعالجررةوهررو مررا دفعنررا إلررم تبنررم مررداخي تعليميررة جديرردة ة المررنهج ونيقرر التررم تنررمنتها والفلسررفة والرررؤى هررداإاأل تحقيرر يهرردإ إلررم للصررف النررانم النررانوى

النرانم النرانوى الترم ترم اعردادها فرم اطرار مصرفوفة مرن المردى صرفالمرادة للمعايير ومؤشرات ويعكس والتتابع علم المراحي والصفوإ الدراسية المختلفة.

واإللكترونررم والتعرراونم ومهررارات التفكيررر ب نواعرر تنميررة مهررارات الررتعلم الررذاتمإلررم المررنهج ويهرردإ نشررا مو ررع ويررف تفرراعلم تنفيررذ ون الطررالف فررمتعررا مررن خررال المختلفررة رراموس مشررروعات لتصررميم واء

،( مصطلحات مصور تطبير باسرتخدام صرفحاتتعتمد فكرة عمي المشروع علم انشا نموذج يحتذى بر لبرنرامج تصرمم

(Expression Web لغرة الترميرزHTML ،تم إنشراهها باسرتخدام برنرامج ، وينرم واعرد بيانرات يرMySQL . ( (PHPبلغررة برمجررة اكتابتهرر تتمررجرراهزة داكررو أ واعررد البيانررات مررع مررن خررال التعامرري مررع ويررتم

فهرم و إنشرا صرفحات المو رع ويمكنك نسخها واألسرتعانة بهرا فرم Open Sourceالمفتوحة المصدر ،أي كود وتطويرجميرع خطرروات كمرا يتنرمن الكتراف صرورنا مرن واجهرات التطبير الفعليرة المنفرذة للمشرروع لتونري

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

ا تتي مشاريع لتوظيف ما يتم دراست فم حياتهم العملية بصورة ابداعية.لهم فرصن لموف ( وهللا ا

فري العمي

3


أساسيات تصميم موا ع الويف: الوحدة األولي

الوحدة النانية: متطلبات ومراحي إنتاج المشروع

صفحات مو ع " اموس مصطلحات الكمبيوتر المصور" النالنة: إنشاالوحدة

4

اتاحرة األاتى أساسبا تامبم ماقع اتابب


أساسبا تامبم مااقع اتابب

:بتاقع أن بكان اتةاتب قارًيا على أنفي شنهاب اتاحرة

يوضح بعض المفاهيم والمصطلحات العلمية المتقدمة ذات الصلة بالكمبيوتر -1

ف برامج الكمبيوتر في تنفيذ مهام التعلم.يوظ -2

يوظف خدمات شبكة اإلنترنت في عمليتي التعليم والتعلم. -3

يمارس عمليات البحث عن المعلومات اإللكترونية بكافة صورها المتاحة

على أجهزة الكمبيوتر وشبكات المعلومات الموثوقة في حل مشكلة.

5



العنوان :

رضنا لبعض المفاهيم والمصطلحات الهامة الالزمة للتعامل مع قاعدة البيانات من خالل تع صفحة ويب ومعالجة بعض محتوياتها.

اختراإلجابة المناسبة إلكمال العبارات التالية: المطلوب:

برامج يَسمح مالكها للجميع باستخدامها يطلق عليها: (1) Free Ware -أ

Open Source -ب

Copy Write -ج

برامج تُنشر ويُسمح للمستخدمين باالطالع على الكود الخاص بها وتعديله، يُطلق عليها: (2) Free Ware -أ

Open Source -ب

Copy Write -ج

ات ومؤثرصفحة ويب تعرض بعض المعلومات ويظهر بها عنوان يتحرك من اليمين إلى اليسار (3) على صفحة مستعرض اإلنترنت تعتبر:صوتية

Dynamic Web Page -أ

Static Web Page -ب

www -ج

صفففحة ويب يمكن من خاللها عرض بيانات، ويسففمح للمسففتخدي بتعديلها وحفظ البيانات المعُدلة، (4) يطلق عليها صفحة:....

Static -أ

Dynamic -ب

Home Page -ج

في معالجة بعض البيانات على صفحة الويب، و ينفذ في: المستخدي Scriptكود الـ (5) الموقع فقط جهاز الخادي الُمخزن عليه -أ

مستعرض اإلنترنت فقط -ب كٍل منهما -ج

( 1) تدريب

6



من أشهرها: ،بلغات كثيرة Scriptيكتب كود (6) #C -أ

HTML -ب

PHP -ج

:اتتطلب منك إدخال اسي المستخدي وكلمة المرور، تعني أنهالتى صفحة الويب (7) ال يتي إجراء معالجة لبياناتها -أ

Static Web Pageصفحة -ب Databaseتتعامل مع -ج

يشير إلى جهاز الكمبيوتر: Serverمصطلح (8) ذو المواصفات الفنية األعلى عن باقي أجهزة الشبكة. -أ

األكبر حجًما في الشبكة. -ب المتصل بشبكة اإلنترنت. -ج

يمكن أن يشير إلى: Serverالمصطلح (9)

جهاز الكمبيوتر األقل في المواصفات الفنية. -أ ر في شبكة الكمبيوتر.الدور الذي يقوي به جهاز الكمبيوت -ب جهاز الكمبيوتر الموجود لدى المدير العاي. -ج

كمبيوتر يُخزن عليه موقع ويب يطلق عليه:جهاز (11)

Database Server -أ

Mail Server -ب

Web Server -ج

طلق عليه:يُ ،كمبيوتر يُخزن عليه البريد اإللكتروني لشركة ماجهاز (11)

Database Server -أ

Mail Server -ب

Web Server -ج

تسخدي في إنشاء: HTMLلغة الترميز (12)

Dynamic Web Page -أ

Static Web Page -ب

PHP Page -ج

على: PHPتشير إلى تنفيذ كود PHP.صفحات ويب امتدادها (13)

مستعرض اإلنترنت -أ

Clientجهاز العميل -ب

Serverجهاز الخادي -ج

7



يعني: Publishing web Siteمصطلح (14) نشر موقع على اإلنترنت. -أ

.LANنشر صفحات موقع على جهاز كمبيوتر في شبكة كمبيوتر -ب

نشر صفحات موقع على اإلنترنت أو على جهاز كمبيوتر في شبكة. -ج

قامت إحدى الشفففركات بانشفففاء موقع خاص بها إلدارة أعمالها ونشفففرته لجميع (15) موظفيها فقط، فان هذا الموقع يعتبر:

Local Host -أ

Hosting Web Site -ب

Host -ج

، http://homepage.htmالعنوان التالي ألحد المواقع الخاص بشففركة ما: (16)

من قراءتك للعنوان السابق نجد أن هذا الموقع تي نشره: Local Hostمحليًا -أ

Publishing web Site الويبعلى -ب

محليًا وعلى اإلنترنت. -ج

، :homepage.htm\\httpقع الخاص بشففركة ما: العنوان التالي ألحد الموا (17)

نالحظ أن هذا الموقع تي نشره:من قراءتك للعنوان السابق Local Hostمحليًا -أ

Publishing web Siteعلى اإلنترنت -ب

محليًا وعلى اإلنترنت. -ج

ذات العالقاتواعد البيانات العديد من البرامج المجانية الخاصففففففة بنظي إدارة ق (18) منها: My SQL -أ

SQL -ب

Access -ج

في التعامل مع البيانات المخزنة في قواعد البيانات المسفففففففتخدمةلغفة البرمجفة (19) هي: SQL -أ

Oracle -ب

Access -ج

يتيح فيها مطور الموقع و ,طرائق نقل البيانات من صفففحة ويب إلى أخرىأحد (21) أو كلها، يطلق عليها: بعض صفحات الموقع ةللمستخدي زيار

Password -أ

User Name -ب

Session -ج

http://homepage.htm/

http://homepage.htm/

8



العنوان :

وتثبيته Xamppمن خالل البحث في اإلنترنت يمكنك الحصول على نسخة من برنامج

:البرنامج لتثبيت اآلتية الخطوات اتبع معلمك اشراف تحت

ا ف تت ة تتخ ا تت بتتتتتتتتتتتتتتتخ ب ثبعتت ا باتتت ح ا ةتت با ةا تت ا ةتت استتتتتتتتتتتتتت تت ا تت إلت ات .

.ت قش ع ك وز الئك ا وبل ا ه اضغطD-Click ا ف xampp-win32-5.6.3-0-VC11-installer.exe

بعد ظهور الشاشة التالية:

ة:خالل شاشات المعالج التاليالبرنامج من تثبيتتابع خطوات

،"عرض "شاشة ترحيب ."Next"ثي اضغط على زر

( 1) نشاط

9



الشفففففففاشفففففففة التى امفامك لتحديد "مكوناتالبرنامج" التى ترغب فى اختيارها،)ناقش مع معلمففففك وزمالئففففك تلففففك المكونففففات واسفففففففتخففدامففاتهففا، ثي حففدد المكونففات التى

تختارها.

... نصيحة Apacheتيارها جميعًا وخاصة خقي با

، MYSQLو

غط زر "اضNext."

اختر المجلد شففففففاشففففففة تحديد المجلد منغط البرنامج فيه، ثي اضفف تثبيتسففيتي الذى

".Nextزر "

التى ظهرت امامك.. شففففففاشففففففةادرس النفاقش محتواهفا مع زمالئك ومعلمك وإلى

ماذا تشير؟ تؤكد أن البرنامج مجاني ويدعي الشاشة

بعض البرامج مفتوحففففة المصففففففففففدر مع

Xamppلي المزيد عن برنامج إمكانية تع

" اضغط زرNext."

11



بففففرنففففامففففج تففففثففففبففففيففففتعففففنففففد ظففففهففففور شففففففففففاشففففففففففة بففففدء عففففمففففلففففيففففةXampp،

".Next، ثي اضغط زر "تثبيتانتظر حتى نهاية ال

البرنامج، في تثبيتآخر شفففففففاشفففففففة عند ظهور اختر الدخول على لوحة التحكي الخاصففة ببرنامج

Xampp،

" اضغط زرFinish."

شاشة لوحة التحكي لبرنامج مع ظهورXampp

واضفففففففغط على زر Apacheتففدكففد من اختيففار

"Start" اسفل "Actions".

كرر الخطوة السابقة مع MYSQL.

11



:Xamppللتأكد من صحة تثبيت برنامج ناقش معلمك زمالئك

حمل برنامج مستعرض اإلنترنت المتاح على جهازك اكتب في شريط العنوان Localhost " واضغط مفتاح اإلدخالEnter" :فتظهر الشاشة التالية

"Local Hostأصبح جهازك الشخصي بمثابة جهاز خادم " Xamppبعد تثبيت

كيف تتأكد من صحة تثبيت برنامج

Xampp ؟

12



العنوان :

ا اي عجعل جه زك قو ب وا ا Xampp ستتتتتتت ك شاا ا تتتتتتتتت ا تتتتتتتتغعل بات ح Server و تغعل بات ح ،Appache و بات ح تظ إ ااة قوا ا ب تMYSQL.

:المطلوب

، و تتد ت ش تتتتتتتتتتتتتتتغعتتل باتتت ج Xampp وةتخ ا ة ا تت بتتتتتتتتتتتتتتخ باتت ح runتتتتتتتتتتتتتتتغتل Appache وMYSQL. تنفيذ النشاط:

شغل لوحة التحكي الخاصة ببرنامجXampp :بأحد الطرق التالية

:كي التاليبالش Start ق ئ خ .1 ا اxampp control panel أى وةتتتتخ ا ة

xamppبات ح

من نافذة لوحة التحكي الخاصة ببرنامجXampp نفذ ما هو مشار اليه:

لتشغيل Startانقر

Apache وكذا زر

Start بجوارMYSQL

Stopفيظهر على الزر

( 2) نشاط

13



، :Xampp\Cفي مجلد control.exe-Xamppمن ملف Xamppكما يمكن تشفففغيل .2

ك.من مسار تثبيت البرنامج على جهاز من اتتأكرمع مراعاة

لتشرررررررررغيل Apacheامام Startفي بعا األحيان تحدث مشررررررررركلة عند النقر علم وتظهر نافذة كالتالي:

مشررغو بواسررطة تطبي وخر ويحدث 08السررطر المشررار الي يونرر مشرركلة أن منفذ هذا في حالة تنبيت اكنر من خادم علم نظام التشغيي.

باتباع التالي : apacheن حي هذه المشكلة باختيار منفذ وخر لبرنامج ويمك

افتح ملفhttpd.conf الموجود بففالمسففففففففارC:\xampp\apache\conf في

كما بالشكل التالى: notepadمحرر النصوص

14



يمكنففك أيضففففففففا فتح ملفhttpd.conf بففالنقر على config من نففافففذة Xampp

Control Panel ا بالشكل التالى:كم

بعد فتح الملف تظهر نافذةnotpad -httpd.conf :كما بالشكل التالي

portالحظ السفطران المشفار اليهما على الشكل التالى والذى ويحددان رقي المنفذ

.08وهو

15



واحفظ الملف. 08قي بغيير الرقي إلى , بعد اعادة تشغيلapache.

لمك .ناقش زمالئك ومع تدكد من انه تي تشغيلapache بالمنفذ الجديدport 81 :كما بالشكل التالي

اتيقم

اتجربر

Apache في

حات تطغبل

؟ تالحظ اذام

16



من خالل مستعرض االنترنت Xampp برنامجفتح عند port 80الجديد المنفذ يديجب تحد

http://localhost:81/xampp/

كما بالشكل التالي:

http://localhost:81/xampp/

17

اتثاشنب اتاحرة متةلاا امياحل إشنتاج اتمطياع


متةلاا امياحل إشنتاج اتمطياع


تطبيقات وخدمات تكنولوجيا المعلومات واالتصاالت بسيطة لتوظيفيقترح مشروعات -1

في المجاالت الحياتية والدراسية

االت في تبادل مهام المشروعاتيوظف تطبيقات تكنولوجيا المعلومات واألتص -2

مهام قواعد البيانات( في إنتاج-والتطبيقات المكتبية)جداول حسابية يوظف بعض البرامج -3

محددة ضمن مشروعات تعليمية.

يوظف عدة برامج لحل المشكالت التعليمية والحياتية. -4

يصمم قاعدة بيانات مناسبة لمشروعه -5

.PHPيمارس مهارات البرمجة بلغة -6

مشروعه. تنفيذ بعض تطبيقات االنترنت فىيستخدم -7

يصمم صفحات ويب تفاعلية خاصة بمشروعه. -8

يربط صفحات الويب التفاعلية بقواعد البيانات. -9

ينتج مشروع باستخدام تطبيقات االنترنت المتقدمة. -10

( فى تصميم مواقع لحل مشكلة حياتية.MySQLيوظف قواعد البيانات المتقدمة ) -11

فى انتاج برمجيات وموقع ويب للتعبير عن افكاره. PHPيستخدم لغة البرمجة -12

م مواقع ومصادر المعلومات من حيث الدقة والمصداقية في ضوء معايير محددة.يقي -13

18



العنوان :

معالجة برامج من تعلمه لك سررررررب ما بتوظيف قم مجموعتك مع وبالتعاون معلمك اشررررررراف تحت موقع لصفحات مخطط رسم فى الصورو الرسومات

:مثل مقترح

السياحة فى مصرعن موقع تاريخ مصر عن موقع االستخدام اآلمن لإلنترنت.عن موقع ..... الخ

اعرض المخطط على زمالئك باستخدام برامج العروض التقديمية والوسائط المتعددة:

حدد صفحات الموقع والغرض من كل صفحة. تظهر مع كل صفحات الموقع. حدد الصفحات التى

ناقش المخطط المقترح مع معلمك

ومع باقى المجموعات

( 1) تدريب

19



العنوان :

معالجة برامج من تعلمه لك سررررررب ما بتوظيف قم مجموعتك مع وبالتعاون معلمك اشررررررراف تحت المشروع لصفحات مخطط رسم فى والصور الرسومات

اعرض المخطط على زمالئك باستخدام برامج العروض التقديمية والوسائط المتعددة:

حدد صفحات الموقع والغرض من كل صفحة. حدد الصفحات التى تظهر مع كل صفحات الموقع.

ناقش

المخطط المقترح مع معلمك

ومع باقى المجموعات

( 2) تدريب

21



العنوان :

بيانات الطالب:ل التالى جدولال ادرس

اتتلبفان تايبخ اتمبالر اتمحافظ شناع اتةاتب اسم اتةاتب

2460 1/1/2888 اتقاهية ذكر محمد 07007 5/2/1999 اتجبزة أننم سما

32323 3/4/2882 اتقاهية أننم فاطمة 54545 11/5/2881 بزةاتج ذكر يوسف 65656 6/7/1990 اتطيقب أننم هب

ناقش زمالئك ومعلمك فيما يلى:

:Fieldsحقو ال، و Recordsسجالت ال - Fieldsحقو ال Recordsسجالت ال

، من حيث: كي حقيخصاهة - Field Sizeالحقي حجم Field Typeالحقي نوع Field Nameالحقي اسم

؟ اسم طالف أو اسم المحافظة أو تاريخ الميالد ...إلخالحظ هي يمكن أن يتكرر - التليفون تاريخ الميالد المحافظة نوع الطالف اسم الطالف

غير متكرر متكرر غير متكرر متكرر غير متكرر متكرر غير متكرر متكرر غير متكرر متكرر

..............primary key حقي مفتاح أساسيكون تتصل أن بالجدو الحقو أى -

( 3) تدريب

21



فسر اختياراتك -

؟ للجدو مفتاح أساسييقوم بدور إنافة حقي جديدكيف يمكن -

سجل مقترحاتك

وناقشها مع زمالئك ومعلمك

22



العنوان :

جدو "بيانات الطالف" جدو "حالة الطالف"

ر ررررررررررررررم الطالف

ر رررررررررررررررررررم التليفون العنوان الجنسية تاريخ الميالد االسم الطالف

الصررررررررررف الدراسي

الررررررررعررررررررام الدراسي

الرررحرررررالرررررة الدراسية

منقو 2816 2/1 3 11212 القاهرة مصري 1/1/2888 هاني 1 منقو 2816 2/3 4 54663 الجيزة مصرية 2/2/2881 أمي 2 منقو 2816 2/5 1 99077 نا مصري 3/3/2882 وليد 3 با ي 2816 2/6 2 55009 أسوان مصرية 4/4/2883 سمر 4

:ادرس المخطط ، ثم اتبع اإلجراءات التالية

:والعال ة التم تربط بينهماصف الجدولين. - حقررري في الجررردو األو مع حقررري في الجررردو النررراني "،الربط بين الجررردولين بعال رررة تتم بين يتم -

............... حددهما؟ ........................ -..................... -....................:من حيث نليناتمم ينلقحلا - استنتج العال ة التم تربط الجدو األو بالجدو النانم................... -نحة فم المخطط النوع األو من عال ات الربط بين جدولين، وتسمم عال ة تون العال ة المو -

:فسر سبف تلك التسمية رأس برأس

ناقش

زمالئك ومعلمك فى تفسيرك

حقل مفتاح

PKأساسي

حقل مفتاح

PKأساسي

( 4) تدريب

23



العنوان :

:ادرس المخطط ، ثم اتبع اإلجراءات التالية

.صف الجدولين

فيما يلى: ناقش زمالئك ومعلمك

عا ط ةقل ش ا ج ول األول ةق عش ش ا ج ول ا ث ت . ة ا ةقول ا ثالثخ: ....................- .....................- ........................

............ بف ت ل األا ا بعش ج و عش ........................ ق ب س خ ك ا عالقخ................. وة تو ه

راهد الفصي كود الفصي كود الفصي ر م التليفون العنوان اسم المدرس كود المدرس

حقل مفتاح

PKأساسي

حقل مفتاح

PKأساسي

FKحقل أجشناي

غبي قاال تلتكياي

( 5) تدريب

24



العنوان :

جدو الطالف جدو الصف

ادرس المخطط ، ثم اتبع اإلجراءات التالية



ة ا ج ولone ............... وا ج ول ,many . .................. عا ط ةقل ش ا ج ول األول ةق عش ش ا ج ول ا ث ت . ة ا ةقول ا ثالثخ

....................- .....................- ........................ 101ة ا طالب ا وجو عش ا بف اق

............ بف ت ل األا ا بعش ج و عش ........................ ق ب س خ ك ا عالقخ................. وة تو ه

ر م الصف الشعبة العام الدراسي ر م الطالف مكان الصف اسم الصف ر م الصف 181 علمي 2816 3 الدور األو األو 181 381 علمي 2816 4 الدور الناني الناني 281 181 أدبي 2816 1 الدور النالث النالث 381

281 علمي 2816 2 281 أدبي 2816 5 381 علمي 2816 7 381 أدبي 2816 9 181 أدبي 2816 18 181 أدبي 2816 12

حقل مفتاح

PK أساسي

حقل مفتاح

أساسي

PK

أجشناي حقل

FK

( 6) تدريب

25



العنوان :

جدو المعلمين دو الصف ج

جدو الربط

ادرس المخطط ، ثم اتبع اإلجراءات التالية



............ صف شكي األرتباط بين جدولين ط بين الجدوليناكمي بيانات جدو الرب ........................م بتسمية تلك العال ة................. وحدد نوعها

ر م الصفمكان اسم الصف ر م الصف المعلم

اسم التخصة المعلم

كمبيوتر أحمد 3 الدور األو األو 181 لغة إنجليزية منم 4 الدور الناني الناني 281 لغة عربية أمي 1 الدور النالث النالث 381

ريانيات عمر 2 تربية فنية هنا 5 تربية ريانية شرين 6

ر م المعلم ر م الصف

حقل مفتاح

PK أساسي

حقل مفتاح

PK أساسي

حقلي يقم اتاف

ايقم اتمعلم معًا

مفتاح أساسي في

جرال اتياة

( 7) تدريب

26



العنوان :

يساعدك هذا النشاط علم انشا اعدة بيانات بالمواصفات التالية، مواصفات اعدة البيانات : dbdictionary :االسم

( خمسة حقو هي:5ينم عدد ، Termsج ول ب ت س تحتوي: (ID – Term – Terms – Defe – Picture)

نفذ تحت اشراف معلمك الخطوات التالية : dbdictionaryإلنشاء قاعدة بيانات

س ات ًا ت تخ ا خ: MySQLو apacheث تغل بات ج Xamppتغل بات ح (1)

تتتتتتتتتتتتتتتاضط تواش ستتتتتتتتتتتتتت عا /http://localhost/phpmyadminتواش ا تت : ا تتب ا ع (1)

اإلت ات ا ح جه زك.

(1) نشاط

27



" أ ا تتتتتتتتت تتتتتتتتتتخ، ث ا ا غخ واجهخ ا طبعج ا فضتتتتتتتتت ه جز Databasesا ا بوضب " (3 "Appearance Setting" ث اضتتتتتتتغط ،"NEW لتظهر لك " ا تتتتتتتت ا إ عه أ ستتتتتتت ا ا تتتتتتتت تتتتتتتتخ

التالية:الشاشة

وفيها يظهر أسماء قواعد البيانات السابق إنشاؤها، وبعد كتابة اسي قاعدة البيانات المراد إنشاؤها وهي "dbdictionary" وبالضغط على زر "Create.يتي إنشاء قاعدة البيانات الجديدة "

الحظ

ها ضمن قواعد ءظهور اسي قاعدة البيانات التي تي إنشا

.بالشكلكما البيانات السابقة

عففلففى قففففاعففففدة الففبففيففففانففففات Clickوبففففالضففففففففغففط (4)

"dbdictionary:لمك(عمومع مناقشة زمالئك هاتانوكمصف ) " تظهر الشاشة التالية

اكتب اسم قاعرة -2

Createأشنقي زي -3 اتجربرة اتاباشنا

شنطاء قاعرة اتاباشنا إل

قااعراسماء -1

تم اتتي اتاباشنا

اشنطائها

اسم قاعرة

اتاباشنا

اسم اكتب -1

اتجرال

بتم اتشنقي تاشنطاء -3

عرر اتحقال -2

28



" اكتب اسفففففي جدول البيانات المراد Create table" وتحت "Structureتدكد من اختيار تبويب "

(، 5وليكن ) "Number of Columnsفي ""، ثي ادخففل عففدد حقول الجففدول Termsإنشفففففففاؤه وليكن "

" لتظهر النافذة التالية: Goعلى زر " Clickأخيًرا اضغط و

من الشاشة السابقة:

اسماء

اتحقالةال

اتحقل

تحفظ

اتجرال

تستةبع اتكتاا ااتلغ اتعياب حتى

شنظام اتتطفبي راخل اتحقل حرر

شناع اباشنا

اتحقل

:الحظ

وأش ل ةقل الب أش وش ه اس وشو عجب ا ه أسفل Fieldsأش ج ول ا ب ت ع وش ش ةقول "Name وتوع ب ت تت ،"datatype " وشو عجب ة ع ه أستتتتتتتتتتتتتتفلType وةج أو طول ا ةقل ،"size

خ ا ل ا ةقل "، وة ش ا خ غخ ا عابLengthvaluesوشو ا ق خ ا ط وب إ ه أستتتتتتتتتتتتتتفل "" ةفظ ج ول ا ب ت ة Save"، وأ عًاا اضتتتتتتغط زا "Collation عجب ا ا توع ا تتتتتتتفعا أستتتتتتفل "

."Termsاس "لجعله indexمن القائمة المنسفففدلة اسففففل primaryيتي اختيار idبالنسفففبة لحقل مالحظة :

primary keyمفتاح اساسي

.

29



" تظهر الشاشة التالية:Saveبعد الضغط على زر " (5)

، وعدد الجداول في قاعدة البيانات termsوالتي يتضررح فيها اسررم الجدول الذ تم حفظه باسررم

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

قاعدة البيانات حسب احتياجاتك. أخر في أ جداول

"، وذلك كما يلى:dbdictionaryجدول قاعدة البيانات " structureاستعرض بنية (6)

شو "،Structure زا " Click"، ث اضتتغط Terms ا استت ج ول ا ب ت " وضح ت تخ ا خ:

اسم -1

اتجرال

عرر -2

الااتجر اسم اتجرال اتجربراكتب

جرالإشنطاء بتم

في اسماء اتحقال

Termsجرال

ضاف حقل إل

جربر

اسم

قاعرة

اتابان

اسم

جرال

اتاباشنا

31



وزمالئك معلمك ناقش ؟ تالحظ ماذا. السابقة الشاشة ادرس

بدراسة الشاشة السابقة يتضح ما يلي

" اسي قاعدة البياناتdbdictionary."

" اسي جدول البياناتTerms."

o " يحتوي جففففدول البيففففانففففاتTerms( 5" على )

نواعها وأحجامها.خمسة حقول، يظهر اسمائها وأ o " تي تعيين حقفففلID حقفففل مفتفففاح أسفففففففففاسفففففففي "

Primary Key.

تسففففتطيع اختيار حقل والتحكي في خصففففائصففففه من خالل مجموعة األزرار أسفففففل الحقل األخير.

.تستطيع أن تضيف حقل جديد أيًضا وتحديد مكان إضافته في الجدول النشط

31



العنوان :

terms بالجدو كمبيوتر لمصطلحات سجالت خمسة ادخي

:وات التاليةطباتباع الخ

" اختر جرردول البيررانررات المراد إدخررال بيررانررات فيررهTerms ثم اضرررررررغط ،"Click على تبويررب

"Insert" وادخل البيانات في كل حقل أسفل ،"Value."

يع إدخال بيانات في أ جدول من جداول قاعدة البيانات باسررررتخدام تطبي وبنفس الطريقة تسررررتط

MySQL.

2

3

1

(2) نشاط

Insertاختي تاابب .1

تكل حقل Valueإرخال اتاباشنا أسفل .2

Goاعر إرخال اتاباشنا اضغة .3

32


اتثاتث اتاحرة "اتمااي اتكماباتي ماةلحا قاماس" ماقع بنتأم

ماقع افحا إشنطاء

"اتمااي اتكماباتي ماةلحا قاماس"


.مشروعه انتاج في االلكترونى التعلم أدوات بعض يوظف .1

.تعلمه محتوى بناء في واالتصاالت المعلومات تكنولوجيا يقاتتطب يوظف .2

.ويب موقع صفحات بين الربط في الويب مواقع إنشاء تطبيقات أحد يوظف .3

...(. صورة-فيديو– صوت) المتعددة الوسائط عناصر معالجة في المناسبة التطبيقات يوظف .4

.الويب مواقع تصميم فى وتطبيقاتها Php و Html لغة يتعرف .5

(.تنظيم – انتقاء – تقييم – تحديد) اإللكترونية المعلومات مع التعامل مهارات يمارس .6

.المشروع تنفيذ فى محدد بمشروع المرتبطة اإللكترونية المعلومات مصادر يوظف .7

Php بلغة والمتعلقة الخاصة المعامالت بعض يتعرف .8

Swich وجملة if بجملة الخاصة والصيغ المفاهيم بعض يتعرف .9

33



العنوان :

terms بالجدو كمبيوتر لمصطلحات سجالت خمسة ادخي المطلوب :

" مواصفاتها:Test1باسم " إنشا صفحة ويففم HTMLاستخدام كود من خال هذا النشاط يمكنك

" عنوان صفحة مستعرض اإلنترنتMy First Web Page."

عبارة "الكمبيوتر التعليمي" في أول سطر من شاشة مستعرض اإلنترنت.رتظه .في السطر الثاني: صورة علي مصر في منتصف الشاشة "في منتصف الشاشة أيًضا. بحجي كبيرفي السطر الثالث عبارة: "تحيا مصر .في السطر الرابع عبارة: "الصفحة الثانية" في يمين شاشة المستعرض

اتبع الخطوات التالية تحت اشراف معلمكولتحقي ذلك

.Notpadة ل بات ح ةاا ا تبوص (1) ا ب ا و ا : (1)

(1) نشاط

H1 heading 1تعشنى

اها حجم خة كابي

34



ا تتتت تتتتا ," تتتت تتتت ستتتتتتتتتتتتتتتتتتطتتتتح ا تتتت تتتت تتتت تتتتتتتب، Test1.htmاةتتتتفتتتتظ ا تتتت تتتت تتتتف تتتتتتت ستتتتتتتتتتتتتتتتتت وا تتتت تتتتتتت ا " (3)"UTF-8 ش " Encoding ا ك عا ا تبتتتوص ا عاب خ تتتت ل بتتتة ح تتتت تتتتخ ا ستتت عا و

تالي:كما بالشكي ال

" ش ستتتتتتتتتطح ا ب عان ت عجخ تفعا ا و تتتتتتتتتت تتتتتتتتتتخ ستتتتتتتتت عا Test1.htmا ح ا ف " (4)

اإلت ات ظها ع :

بتفةخ س عا R-Clickإلجاا أي ع عل، وا ك ضتغط HTMLو ش است عاا و (5)

:" ش ا ق ئ خ ا باة، ع View Sourceاإلت ات وا ا أ ا "

حدد تشفير

الملف

35



أ تتتت ط بتتفةخ ستت عا اإلت ات ، ث اضتتغط ف ح HTML ع ةفظ ا ع ال و (6)F5 . ت ش ت عجخ ا ع ال بفةخ ا س عا

36



Test2.htmالعنوان

" تعرض اآلتي:Test2انشئ صفحة ويب باسم "المطلوب:

س عا اإلت ات تواش بفةخ "My Second Web Page". . اة "إ وا با إش ت هللا آ تعش" أول سطا ش ت تخ س عا اإلت ات ا ستتتتطا ا ث ت : ضتتتتل بتتتتواة بتتتتا وبجوااش اة "ا بتتتتفةخ األو " عش تتتتت تتتتتخ

".188× 58ا س عا أل ع ا خ "

لطالب بالمهارات التي اكتسررربتها في النشررراط السررراب إلنشررراء صرررفحة اسرررترشرررد عزيز ا

الويب الثانية باتباع الخطوات التالية:

شو ....... . HTMLا ح بات ح ةاا ا تبوص ا اي سون س ه خ و (1) ت قش وت ا و ا ل ز الئك : (1)

ا ب ا و . (3) سطح ا ب." Test2.htmاةفظ ا ف س وا ا " (4) أسفل ت تخ ةفظ ا ف. Encoding" ش UTF-8ا ا " (5)

(2) نشاط

37



ا ح ا ف سطح ا ب وق ت عجخ تفعا ا و ت تخ س عا اإلت ات : (6)

قي بكتابة الغرض من الكود الذى تي كتابته:

الكود الغرض من الكود...........................................................................

...........................................................................

...........................................................................

<Title>

My Second Web Page

</Title>

<Body> النة؟ ........................................................ أين يظهر هذا

ادخلوا مصر إن شا هللا ومنين

شرح الكود : فقرة جديدة، : <P> بداية التاج - علم شاشة توسيطتعني محاذاة النة التالي لها : "align = "Centerخاصرية -

راالمستع . <P/>كما يلي Tagُيغل الر :<P/> نهاية التاج-

<p align = "Center">

( اشرح الكود: .................................................................1

....................................................................................

تنسي محاذاة الصورة؟ ........................................( اكمي: ما هو 2

<img src = "Egypt.jpg"

height = 50 width = 100>

38



العنوان

HTML" بالتعديي في كود Test2.htm" و "Test1.htmَعّد ما يلزم في صرررررفحتي الويف "المطلوب: بحيث:

" ع االت ق ل إ ا بتتتفةخTest2.htm ت ا ضتتتغط ا تص "ا بتتتفةخ ا ث ت خ" تتتت تتتتخ " ".Test1.htm س عا ا بفةخ "

" ا ت خ ا عو ة إ ا بتفةخ األوTest1.htm إاا ا ضتغط بواة " با" أسفل " ".Test2.htmت تخ ا س عا بفةخ "

" ع :Test1.htm ل ا و " (1)

تم ونع النة المراد جعل ارتباط تشعبي بين بداية ونهاية الكود التالي: - >a href = "test2.htm" < الصفحة النانية </a>

(3) نشاط

39



" ع :Test2.htm ل ا و " (1)

رة المراد جعلها ارتباط تشعبي بين بداية ونهاية الوسم التالي:تم ونع كود إدراج الصو -<a href = "Test1.htm"> <img src = "Egypt.jpg" Height=50 Width=100> </a>

41



". Test2.htm" و"Test1.htmاةفظ ا ع ال ا فعش " (3) و تتتتتتتتتت تتتتتتتتتتخ ستتتتتتتتت عا ت عجخ تفعا ا والةظ" ش ستتتتتتتتتطح ا ب Test1.htmا ح ا ف " (4)

اإلت ات .سجل الةظ ك "، اا ة ؟ا بفةخ ا ث ت خاضغط االا ا ا تعب " (5)

.............................................................................................

" و ظها ت تخ Test2.htm جا ا ضغط االا ا ا تعب ت قل إ بفةخ " (6) س عا ا

" ضغط Test1.htm" ة ول ا عو ة إ ا بفةخ األو "Test2.htm ش بفةخ ا وضب ا ث ت خ " (7) االا ا ا تعب "بواة با".

41



:العنوان

" ش الل طبعجTest2.htm" و "Test1.htmق ب عت عتل ع ز بتتتتتتتتتتتتتتفة ا وضب "المطلوب: Expression Web أو ا ع عل وHTML : ةع " ع االت ق ل إ ا بتتفةخTest2.htm ت ا ضتتغط ا تص "ا بتتفةخ ا ث ت خ" تتت تتتخ "

".Test1.htm س عا ا بفةخ " " و ش ا عو ة إ ا بفةخ األوTest1.htmط بواة " با" أسفل " إاا ا ضغ

".Test2.htmت تخ ا س عا بفةخ "

.Expression Webة ل بات ح (1)، ث File" ش الل ق ئ خ ف Test2.htm" " وTest1.htm"ا ح بتتتتتتتتتتتتتتفة ا وضب (1)

ستتتتتتتتتتتتبج ف "، و اا Test1.htm، وا ا استتتتتتتتتتتت ا ف "Openا ا ته أ ا ح ".Test2.htmا ث ت "

1

2

3

(4) نشاط

42



الةظ ظهوا اس بفة ا وضب ت تخ ا بات ح ع : (3)

".Test2.htm" و "Test1.htm ظها اس بفة ا وضب " (أ)

تتتتتتتت تتتتتتتتخ ظها و ت HTMLا بتتتتتتتفةخ ا ق ت ب تتتتتتتتت ئه ش الل و غخ ا ا عز (ب)(، و ش إجاا أي تسعج أو دثعا WYSIWYGا س عا وشو سبج وأتات إ ه ب خ )

أو إضتتتت خ أي توع ش أتواع ا ع و ا بتتتتفةخ ش الل ا خ واإل اا ستتتتهو خ و ت ع ل ل أي بات ح ع جخ تبوص وشو ظها أتاطخ األ وا .

Design - Code- Splitألزااا ا ثالثخ ا خ:ة ول ا ضغط ا ( )

:........................................................................ ة الةظ

أ

ب

43



ناقش زمالئك ومعلمك

Design ،يعرا صرررررررررفحررة الويررف كمررا تظهر في شرررررررررراشررررررررررة مسرررررررررتعرا اإلنترنررت Selectتم تحديده برررررررررررررررررررر ي Designو كي جز في صفحة الويف في شاشة

الخاة ب في شاشة الكود HTMLيظهر كود Code عا و غخ ا ا عز HTML . ج ل وت بفةخ ا وضب ا اضه

Split قس ا ت تخ إ جزأعش األول ظها ه بفةخ ا وضب وا جز األ عا ظها ه ا ص به . HTML و

HTML ظها بفةخ ا وضب و و Split"، ث اضغط زا st1.htmTeتتط بفةخ ا وضب األو " (4) ا ص به .

:يلزم ع ل اا ا تعب ع اة "ا بفةخ ا ث ت خ"، (5) ة ع ش Select" ث ا ا ش ق ئ خ إ اا ،Insert" أ ا "Hyperlink:ظها ا ت اة ا خ "

" ا ا اس ا بفةخTest2.htm" ث اضغط زا "OK." بتتتتت ح ا ع اة "ا بتتتتتفةخ ا ث ت خ" اا ا تتتتتتعب ةع ظها ب وش عز، و ة ه ط، و ت با ك (6)

ع : Code ت اة HTMLع ظ عل و Design ة ع اإلا ا ا تعب ت اة

44



بتفس ا طاضقخ تستتتتتتتتت ط ل جعل بتتتتتتتتتا اا ا تتتتتتتتتتعب ش الل تتتتتتتتتتتط بتتتتتتتتتفةخ ا وضب ا ث ت خ (7)

"Test2.htmد ش ا ضغط زا "، ل ا Split. " أ ا Insert بتتتتتتتتتتتتتتواة بتتتتتتتتتتتتتتا ةتتت عتتت شتتت ، ث ا ا ش قتتت ئ تتتخ إ اا " Clickاضتتتتتتتتتتتتتتغط (8)

"Hyperlink:ظها ا ت اة ا خ "

" ا ا اس ا بفةخTest1.htm" ث اضغط زا "OK."

1

2

45



ه ، و ت ة ع عبا ك بت ح بتواة بتا اا ا تتعب ةع ع غعا اتتا ا فداة ت ا دتعا (9) ع : Code ت اة HTMLع ظ عل و Designاإلا ا ا تعب أي بواة ا ع ت اة

االا ا ا تعب Click" وضغط Test2.htm جابخ االا ا ا تعب واالت ق ل إ ا بفةخ " (10) ف ح، ت قل إ ا بتتتتتتفةخ ا ث ت خ ب وةخ ا Ctrl"ا بتتتتتتفةخ ا ث ت خ" ل استتتتتت ااا ا ضتتتتتتغط ف ح

"Test2.htm.و ب ح تتطخ " االا ا ا تتتتتعب بتتتتواة Click"، اضتتتتغط Test1.htmوأ ضتتتتً ش ا عو ة إ ا بتتتتفةخ " (11)

ب وةتتخ ا فتت ح، ت قتتل إ ا بتتتتتتتتتتتتتتفةتتخ األو Ctrl بتتتتتتتتتتتتتتا ل استتتتتتتتتتتتتت ااا ا ضتتتتتتتتتتتتتتغط ف تت ح "Test1.htm.و ب ح تتطخ "

1

2

46



:وانالعن

Expression Webإلنشا مو ع جديد من خال تطبي المطلوب:

معلمك: فشنفذ اتخةاا اتتاتب تح اطيا

ا ح بات حexpression web

: اضغط ق ئ خ وقل ت ل ا

وقل ج ع ا ا New Site

ت اة ا خ ت تخ جه زك د ش ظهوا ا

اريس اتطاط اشناقش معلمك ازمالئك.

ش ت اة وقل ج ع New Site ا ا وقلEmpty Site

ابل location اس ا وقل ا بdictionary ا س ا C:\xampp\htdocs

(5) نشاط

47



ةفظ ا وقل ل ة ع اس ه و ش ةفظه.ا

د ش ةفظ ا وقل ا ل ا ج س ا و جاب ل ا htdocs.

ت ل ا ت اة سعا ا وضت وز ظها ج ا وقل windows explorer

مجلر

dictionary

مساي اشنطاء

اتمجلر

يتم عمل dictionaryبكتابة اسم الموقع

مجلد له في المسار

C:\xampp\htdocs

48



:العنوان

Expression Web برنامج باستخدام Header صفحة انشئ ، معلمك اشراإ تحتالمطلوب: :علم تحتوي الصفحة مواصفات

.بواة ت س خ ظها ب ا خ بفة ا وقل ا تبتتتتوص األستتتت ستتتت خ ا ستتتتع ابطه بتتتتفة ا وقل ستتتت ا ع ل ل ا وقل ش ا جول ه.

.Expression Webة ل بات ح (1) .Splitا ا أس وب ا عا (1)ا با ك ا س قخ ا ع ل ل أة طب ق ةاضا , و تك است Bannerا ا بتواة (3)

ا بوا ع عل ا بواة ةسب ا ط وب . ا ب ا تبوص ا خ أسفل ا بواة: (4)

مساعدة. –تعديي/حذإ مصطل –بحث عن مصطل –إدخا مصطل –الرهيسة

(6) نشاط

49



:العنوان

إنشرررررا صرررررفحة ويف في Expression Webتحت اشرررررراإ معلمك اسرررررتخدم برنامج المطلوب: PHPمن نوع

بالكود التالي: PHP" بلغة Header.phpأنشئ صفحة " -أوالن

(7) نشاط

51



عبم كما يلي:وعمي ارتباط تش designالكود الساب يتم عمل في نمط التصميم نانيان:

ب تتتتع اا ا تفعا ش الل ا طبعج ا ستتت ة ا تص ا ط وب header.phpا ح بتتتفةخ -1 " ت لhyperlink ه وشو "ا ائ سخ" ، ش ا ق ئ خ ا باة ا ا "اا ط تعب

ت ل index.phpة بفةخ ا اا ط وش -1

طط وقلق ع ل خ ا اوا ط و ق شو -3 ق ع ل خ اإلا ط و ق شو طط وقل -4

51



:العنوان

الكود علم تحتوي dictionary بمو ع جديدة ويف صرررفحة انشرررئ معلمك اشرررراإ تحتالمطلوب: :التالي

وزمالئك معلمك ناقش

المكتوب ودالك فى

.الطالب كتاب فى شرحه والساب

احفظ الصفحة باسي

(8) نشاط

52



:العنوان

المشررار األماكن في PHP كود إدخا في التالية بالشرراشررة اسررتعن ، معلمك اشررراإ تحتالمطلوب: .البيانات اعدة جدو إلم مصطل إدخا في خدمتست ويف صفحة إلنشا وذلك إليها،

(9) نشاط

إرخال كار افح -1

Header

اتخاص PHPإضاق كار -2

ااتياة اقاعرة اتاباشنا اإضاف

ماةلح

53



.Headerإلض خ بفةخ PHPا ب و (1)

ض خ ب ت بط ح ج ع . PHP( إض خ و 1) ا ص ب ةقعج اال ب ل ق ة ا ب ت وا

( ا ا بفةخ إ ل بط ح3) ل بط ح ج ع ( ق ب4)

كتاب الأنشطة للحاسب الآلى للصف الثانى الثانوى للترم...

Education