المشاركات

عرض الرسائل ذات التصنيف البرمجة

مجالات البرمجة الاكثر طلبا programming areas

صورة
  تعد البرمجة من افضل المجالات والاكثر طلبا في سوق العمل. وتصنف رواتب المبرمجين. ضمن اعلى الرواتب بالنسبة للوظائف الاخرى. حيث ان رواتب المبرمجين قد تتجاوز المئة والاربعين الف دولار سنويا وتقسم هذه المجالات الى تطوير برمجيات الحاسوب وبرمجة تطبيقات الهواتف الذكية وغيرها. وفي هذه التدوينة اقدم لك افضل المجالات البرمجية التي قد ترغب في تعلمها فاهلا ومرحبا بك في موقعنا elhorrdz .  -  1 برمجة تطبيقات الهواتف الذكية :  اصبحت برمجة تطبيقات الهواتف الذكية من الاكثر طلبا في الوقت الحالي وذلك بسبب تزايد استخدام الهواتف الذكية واعتماد الناس عليها في امورهم اليومية ويقوم مبرمج تطبيقات الهواتف الذكية بانشاء تطبيقات وتحليلها والتأكد من جاهزيتها ومتابعة عملها حتى بعد اصدارها وتنقسم برمجة الهواتف الذكية الى برمجة وتطوير تطبيقات الاندرويد وبرمجة وتطوير تطبيقات ios . - 2 برمجة مواقع الويب :  يعرف مبرمج مواقع الويب او مبرمج الصفحات الالكترونية بانه الشخص المسؤول عن انشاء موقع الانترنت ويتضمن عمله برمجة صفحات موقع الانترنت وطريقة عملها اما تصميم شكل صفحات الانترنت فهي وظيفة مصمم مواقع الانترنت تكون معظم مو
المزيد

برمجة القواءم ب css

صورة
  تعتبر القواءم من العناصر المهمة في تكوين المواقع الالكترونية فهي بمثابة خارطة تمكن المتصفح من الوصول الى المحتوى داخل الموقع . سنقوم ببرمجة قاءمة بسيطة في هذا المثال : قمنا بعمل قاءمة للموقع هذا و سيكون التطبيف كما يلي : لاحظ تم اضافة القاءمة للجهة اليسرى و هي مرتبة الى الاسفل ، سنعدل عليها و نقوم باضافة بعض الميزات بعمل id مشابه للكلاس بالشكل التالي : لقد اسميناه ب menu و اضفنا رمز القاءمة ul. الان سنقوم بعمل خصاءص القاءمة في id بالشكل التالي : بعد تطبيق هذا الكود سيظهر بالشكل التالي : سنقوم الان بتحديد اطراف عناصر القاءمة li ونظيف كود border لتنسيق القاءمة و اعطاءها شكل منظم اكثر كما يلي : ستكون النتيجة بعد تطبيق هذا الكود كما يلي :
المزيد

تعليم برمجة xhtml

صورة
Xhtml : هي اختصار ل  extensible html وهي تعني html القابلة للتوسع و لها نفس الوسوم و الواصفات مع html فقط هي اكثر صرامة وتعطي توافق اكبر للصفحات المبرمجة بهذه اللغة مع متصفحات الويب ، فهناك اختلاف في متصفح خاص بالحاسوب و اخر خاص بالهاتف فبهذه البرمجة نحل مشكلة التوافق مع المتصفحات المختلفة . تحتوي xhtml على مجموعة من القواعد البسيطة : -  كتابة وسم الاغلاق - كتابة وسوم واصفات الصفحة باحرف صغيرة lower case - ان يكون ترتيب وسوم الاغلاق متناظر مع وسوم الفتح . - وضع القيم المسندة للواصفات بين  علامات اقتباس . - عدم الاستغناء عن اي وسم مثل <html> و <body>و <head> . - وضع تعريف لنوع المستند doctype في بداية الصفحة . يجب ان تحتوي كل صفحة في xhtml على سطر التعريف <DOCTYPE!> والذي يعني تعريف نوع المستند document type definition او اختصارا ب dtd ، و يستخدم هذا السطر من طرف المتصفح كمرجعية قواعدية  لصيغة الكتابة و انواع الوسوم في الصفحة . في هذه الشيفرة تعرض نوع المستند الذي تصادفه في اغلب صفحات xhtml و الذي يجب ان يكتب في اول سطر من الصفحة المراد برمجتها .
المزيد

جميع وسوم html tags مع الشرح

صورة
 اليك جميع الوسوم المستعملة في برمجة html و شرح مفصل لكل tag 
المزيد

العنصر meta و اهميته لمحركات البحث seo

صورة
 العنصر meta في صفحة html : هو عنصر مهم في تحسين الموقع و ارشفته في محركات البحث ، حيث يستخدم هذا الكود في راس الصفحة بين وسمي <head> و <head/> يساعد محركات البحث في تصنيف الموقع و عرضه ضمن نتاءج البحث من خلال الكلمات المفتاحية content التي توضع في هذا الوسم . و اهم عنصرين في كود meta  هما kaywords و description لاحظ الشكل التالي : يعرض العنصر meta مجموعة من الكلمات المفتاحية kaywords التي تساعد في البحث و العنصر description يحتوي على وصف للمحتوى الذي موجود في الموقع . العنصر meta و الكلمات المفتاحية و الوصف لا يظهر في مستعرض البحث فقط هو مخصص لتقديم بيانات الموقع لمحركات البحث حيث يساعد في ارشفة الموقع و تصدره في نتاءج البحث  .
المزيد

طريقة ربط ملف html مع css

صورة
نستخدم في عملنا هذا برنامح dreamweaver cs6 , نقوم بتجهيز مجلد خاص و نسميه css في الحاسوب ، ثم نذهب الى برنامج dreamweaver و نظغط file ثم new ، بعدها نختار html . نقوم بحفظ الملف باسم index.html  . نقوم بانشاء ملف css مرة اخرى بنفس الطريقة الاولى فقط نغير الصيغة الى css , و نسمي الملف ب style . الان الخطوة المهمة هي ربط الملفين html مع css , سنكتب الكود التالي :  في السطر 8 كود  (link)  يرمز للرابط سيساعدك البرنامج في كتابته بسهولة  . Rel ترمز للغة الملف ، type ترمز لنوع الملف ، اما href ترمز لمكان الملف بمجرد كتابة هذا الوسم سيساعدك البرنامج في تحديد مكان الملف  و يكتب كود . تستخدم الcss خاصية الوراثة في استدعاء خواص معينة و تطبيقها على div او داخل النص لتسهيل العمل عليها فبدل ان يقوم المبرمح بعمل جدول او نص او div داخل صفحات الموقع بعدد كبير ، يكفي ان يضع class في ملف css لنص مثلا او جدول و  باخذ خصاءصه من كود الكلاس فقط لاختصار العملية  . هناك بعض العناصر اساسية لا يتم عمل (class) لها مثل h1 h2 h3 , body .... الخ
المزيد

استخدام الوسوم div و span

صورة
 وسم division tag : استخدمنا في الدروس السابقة في html الجداول لبناء الموقع ، سنستعمل وسم <div>  و هو عبارة عن وحدة احتواء لعناصر صفحة الويب و تقسيمها الى اقسام   و يكتب عادتا في صفحة html و php . مثال :  وسم span tag : هو كود يستخدم في التحكم  بالنصوص  ، و لاختصار الوقت يستخدم div احسن منه .  في المثال الموالي سنضع كود span بداخله استخدمنا ستايل نوع inline و خاصية اللون الازرق ثم اغلقنا ال span
المزيد

تعليم البرمجة programation css

صورة
 لغة التصميم و التنسيق css : هي لغة تمكن من تصميم و تنسيق صفحات الويب html من حيث الشكل و الوان الخلفيات  و المساحات .. . وغير ذلك بدقة اكثر و تقنيات احدث من لغة html ، وهناك ثلاث طرق للعمل على لغة css : -طريقة السطر الواحد inline style sheet : تمكننا هذه الطريقة من عمل كود في نفس السطر لتنسيق نص معين بال css . مثال :  مثل الواضح في الصورة عملنا تنسيق للنص حددنا لون النص بكود css . الربط الداخلي internal style sheet : يمكننا عمل كود خاص بالتنسيق  css داخل وسم <head>  في الجزء الذي نريد تنسيقه  . في المثال السابق نلاحظ ان برمجة css تبدا من السطر 6 الى 8 ، يمكننا عمل اكواد منفصلة لان كل جزء في الموقع يحتاج الى كود معين ولا نستطيع كود واحد لكل الموقع . - طريقة الملف الخارجي external style sheet :  تستخدم هذه الطريقة في المواقع الكبيرة عن طريق عمل ملف خارجي خاص بالموقع يحتوي على الاكواد البرمجية و يكون بصيغة css  حيث تصبح الاكواد موجودة في صفحة الموقع و يمكن استدعاءها .
المزيد

برمجةhtml لموقع site

صورة
 لقد انتهينا من عمل صورة لراس الموقع سنقوم الان بانشاء صفحة للموقع و نسميها index.html - اعمل الكود  في notepad++  الاكواد هذه تكتب كلها في صفحة واحدة ل notepad و احفظ الملف باسم  index.html عند فتح الملف سيظهر الموقع بهذا الشكل : -شرح الكود المستخدم :  الترميز <Doctype> يوضع داءما في اعلى الصفحة و هو يخبر المتصفح عن نوعية الاكواد المستخدمة ، بعد ذلك قمنا بفتح منطقة head . في السطر الرابع ترميز لاعلام المتصفح في عرض الموقع لاي شخص و تمكين اللغة العربية و تكتب في منطقة head العنوان الخاص بالموقع ثم نغلق head . - السطر الثامن قمنا بفتح محتوى الموقع <body> و اضفنا داخله كود لتحديد لون الخلفية  bgcolor="#ffffb7" . - السطر التاسع عملنا جدول <table> بالخصاءص التالية : عرض الموقع "width="800 اتجاه الموقع align="center"  سمك حواف الجدول border="1" لون الحواف bordercolor="ff6600" خاصية بدا المحتوى dir="rtl" من اليمين الى اليسار ، بعد ذلك عملنا صف اول في الجدول و الذي سيكون خاص بترويسة الموقع <tr> ثم الخلفية في ا
المزيد

برمجة موقعsite بسيط بالhtml

صورة
 بعد الدروس  التي تعلمناها في السابق سنقوم بانشاء موقع مصغر بلغة html ونضيف بعض الاوامر البرمجية من الصفر ، و سيكون الموقع كما في الصورة :  سنقوم بعمل جدول يضم كامل الموقع و محتوياته  ، في الصف الاول لديه خلية واحدة فقط و الصف الثاني و الاخير  نفس الشيء . الصفوف الباقية لها خليتين الاول على يمين الصور و الثاني على يسار النص . - الصف الاول سنضع صورة بنفس مقاسات راس الجدول . ملاحظة : تصميم المواقع يعتمد على  الحس الابداعي و ليس على الاكواد البرمجية فقط . - الصف الثاني في الجدول نعمل قاءمة روابط عند الضغط عليها تحولنا الى صفحات اخرى من الموقع وهي (الرءيسية ، اعمالنا ، حول الموقع ..الخ )  .  -الصف الثالت من الخلية اليمنى نضيف صورة حسب المقاس او نضبطها في الكود الخاص بالصورة حسب المطلوب . و في الخلية اليسرى نضع نص و نقوم باعداده بالوسوم الخاصة ( عنوان ، فقرة ....) - الصف الاخير نضع فيه نص عادي خاص بحقوق الملكية و رابط لصاحب الموقع او الشركة المالكة لهذا الموقع  ...الخ . التطبيق العملي : في البداية نحتاج لبرنامج فوتوشوب لتجهيز الصور بالمقاسات المطلوبة  نقوم بانشاء مجلد و نسميه html ثم نعمل م
المزيد

برمجة الجداول table بلغة html

صورة
 برمجة الجداول في html : تستخدم الجداول بكثرة في المواقع و يرمز لها ب <table> , ويلعب دورها في ترتيب محتوى الموقع  و هي تتكون من ( اعمدة -صفوف-خلايا) مثال :  لقد قمنا باضافة كود <table> و خاصية اظهار الجدول border بمقدار 1 بكسل ، ثم اضفنا صف <tr> و خلية داخل الصف <td> بامكاننا وضع المحتوى الذي نريده قبل اغلاق الخلية بعد ذلك نقوم بغلق الصف بالكود <tr/> و نطبق الطريقة كذلك في الصف الثاني و نغلق الجدول ب <table/>  .  فسوف نتحصل على هذه النتيجة  عندما تكون لدينا قاءمة او لاءحة لعدة عناصر مثل ( تفاح ، عنب، برتقال ) يمكن التعبير عليها بقواءم في لغة html و لدينا نوعين من القواءم : - القاءمة الغير مرءية unordered list  و يرمز لها بكود <ul>  و كل عنصر  يفتح و يغلق بالكود الخاص به مثل <li/>برتقال<li> . - القاءمة المرتبة (ordered list) تكتب بنفس  طريقة القاءمة السابقة .  مثال : 
المزيد

برمجة html راس الصفحة head

صورة
  يعتبر  head من اهم اجزاء الصفحة في الموقع فيه يتم وضع العنوان و اسم الموقع او تفاصيل الصفحة التي تتم زيارتها ، و يمكن وضع اشياء اخرى مثل خصاءص الستايل للموقع css style و java script . مثال : <html> <head> <title/> هنا عنوان الصفحة<title> <هنا الوصف=meta name="discription" contant> <head/> <body> للشرح الكود هذا لقد بدانا راس الصفحة بالوسم <head> و وضعنا في محتواه عنوان للموقع <title> و اضفنا كذلك كود  مهم جدا لكل موقع و هو <meta> عمله وصف محتوى الموقع للمتصفح و محركات البحث فهذا الكود البرمجي يساعد على ارشفة الموقع و مهم جذا للتحسين مرتبة الموقع seo . التعامل مع النصوص في html : نحتاج للتعامل مع النص و الكتابة في هذه اللغة الى وسوم خاصة لاضهار النص مفخم او ماءل و غير ذلك ، و نذكر منها بعض الوسوم : وسم <b> اختصار لكلمة bold و تعني تفخيم النص . وسم <i> اختصار لكلمة italic و تعني نص ماءل .  <small>   نص صغير في هذه الصورة  قاءمة لبعض اكواد النص
المزيد

علامات الترميز tag في برمجة html

صورة
  تحتوي لغة html على نوعين من الترميزات ، - ترميزات للهيكل ( <html> و <body> )  حيث <body> احد اهم العناصر يتضمن بداخله على جميع محتويات الموقع او الصفحة . - ترميزات المحتويات و هذه تعطي اوامر للسرفر او المتصفح بعمل شيىء معين مثل  <p> لكتابة فقرة او <a> لوضع رابط ....الخ فترميزات  html  كلها تبدا ب <tagname> ثم المحتوى و في الاخير ترميز الاغلاق <tagname/>  مثال : <P/> هنا نص الفقرة  <p> 1-كتابة العناوين في html : علامة ترميز العناوين<h1> </h1>  الحرف h اختصار لكلمة heading و التي يعني عنوان و الرقم 1 يشير الى حجم الخط ، يمكننا تغييره فالعنوان الرءيسي يكون كبير و نرمز له ب1 و 2 يكون اصغر منه و هكذا حتى الرقم 6 . 2-كتابة الفقرات في html : ترميز الفقرة هو  <p> </p>  يرمز الحرف p لكلمة paragraph . في هذا المثال سنكتب عنوان و فقرة للتوضيح : <html> <body> <h1/> تعلم البرمجة <h> <P/> مرحبا بك في الدرس <p> <body/> <html/> 3-كتابة الرابط في html : لادخال رابط في الصفحة ن
المزيد

برمجة بانر اعلاني بكل سهولة

صورة
 مقدمة : اعلان البانر هو مساحة اعلانية  تظهر غالبًا في أعلى صفحة ويب أو في جانبها. وهو عبارة عن بنية HTML تعرض إعلانًا معينًا ، وعند النقر عليه  تنقل مباشرة إلى موقع المعلن. لقد كانت إعلانات البانر شائعة منذ القدم في الإنترنت  وتم تطويره في العصر الحديث واصبح كجزا أساسي من الإعلان في الإنترنت.  طريقة عمل إعلانات البانر هي نفسها في الإعلان التقليدي ، قد تختلف الطريقة التي يدفع بها المعلن  للمضيف  من خلال واحدة من ثلاث طرق: - الدفع لكل زائر موقع ويب يشاهدالإعلانcpm - الدفع لكل زائر موقع ينقر على الإعلان cpc  - الدفع لكل زائر موقع ويب ينقر على الإعلان ويكمل مهمة مثل ملء نموذج أو إجراء عملية شراء cpa. ستتعلم برمجة بانر اعلاني بكل سهولة في هذه التدون ، عليك باتباع الخطوات التالية :  انسخ هذا الكود  <center> <a href='رابط الموقع' rel='dofollow' target=_blank> <img src="رابط الصوره" style="width:728px;height:90px;" /> </a></center> - ضع رابط الموقع الذي تريد التحويل اليه . - ضع رابط للصورة التيتريد اظهارها فالبانر  - غير المقاس
المزيد

استخدام لغة html

صورة
  تعلمنا في الدرس السابق ان لغة HTML تستخدم مع النصوص للتنسيقها و هيكلتها  وبالتالي تعتبر وسيلة يستخدمها مبرمجي الويب في: - نشر الملفات والمستندات بطريقة مرتبة على شبكة الإنترنت، حيث تحتوي على نصوص صورًا وجداول وقوائم . - تبادل المعلومات في الإنترنت عن طريق الروابط التشعبية بمجرد النقر عليها. - تصميم نماذج لتنفيذ عمليات على مزودات الخدمة ، كشراء منتج او حجز تذاكر او غير ذلك . - اضافة مقاطع فيديو مرئية و صوتيات وغيرها لعرضها وتشغيلها ضمن ملفاتك مباشرة.  و تُستخدم هذه اللغة لبناء النماذج الأولية للبرمجيات و الأنظمة وكذلك بناء واجهات تجريبية للمستخدم  تحاكي الواجهات الفرعية والنوافذ وكيفية التنقل بين هذه الصفحات بدلًا من الرسوميات. إضافة إلى ذلك تُستخدم لغة HTML حديثًا كبرمجة اساسية لكتابة واجهات تطبيقات سطح مكتب تعمل على أنظمة تشغيل مختلفة في نفس الوقت عبر استعمال الثلاثي الذهبي مع إطار العمل إلكترون Electron، نعتمد هناعلى المعايير الموحدة في تطوير الويب بدلًا من تعلم لغة مخصصة لكل نظام ، فاغلب التطبيقات التي تستعملها الآن مكتوبة بلغة HTML . تحتوي لغة HTML على مفهوم الوسم tag وهو مفتاح د
المزيد

تعريف بعض المفاهيم في لغة php

صورة
 مقدمة : الحـمـد لـله رب الـعـالمين صلى الله وسلم على سيدنا محمد إمام المرسلين وخاتم النبيين وعلى آله وصحبه أجمعين , في العصر الحديث ظـهـرت عـدة لـغـات بـرمـجيـة  للـويـب كـلـغة jsp ولـغـة asp وغـيـرها لكن اللغة التي اثبتت جـدارتـهـا وقـوتـهـا فـي هـذا المـجـال وهي لغة php التي  انشقت من لغتها الام لغة c بالاضافة الى كونها مجانية و مفتوحة المصدر حيث تصل نسبة المـواقـع المبرمجة بهذه اللغة حـتـى %75 مـن مـجـمل الـمـواقـع الـتفاعلية ومـن أشهرها موقع التواصل الجتماعـي Facebook بالاضافة الى الموسوعة الحر ة wikipedia و wordpress و ... غيرها . تعريف مختصر عن لغة PHP:  هي تعد لغة حرة مفتوحة المصدر  لها تشابه كبير مع لغة c ومن كانت له دراية من قبل مع هذه اللغة فلن يجد صعوبة في فهم لغة php  , وتعد مجانية الاستخدام و مخصصة لتطوير تطبيقات الويب وبيئة تطويرها هي Linux .  المعروف ان صفحة الويب  تتضمن عدة لغات برمجية  ولتبيين  أكواد PHP  للمترجم حتى يتعرف عليها يجب تضمينها في وسم الفتح php?> ووسم الغلق <?  .  و الان لكتابة جملة إفتتاحية  ! world helloً   على المتصفح نستخدم echo بأقواس أو بدون أ
المزيد

تعلم لغة برمجة html من الصفر

صورة
 نحن في عصر  الانترنت و أصبح من السهل إيجاد اكثر من مصدر وموقع اوفيدوهات التي تعمل على تعليم HTML للمبتدئين ، وهذا بفضل التطور المعلوماتي فالعصر الراهن ، ولكن هذا الانفتاح المعلوماتي له ايجابيات كما عليه سلبيات. فوجود أعداد كبيرة من المعلومات و المواقع التعليمية، اصبح من الصعب الاختيار بين أفضلهم وأكثرهم إفادةً ، وهنا يكمن الخلل حيث يتشتت ذهن المبتدا و يترك ما بدأ ويعود لنقطة الصفر. فيجب على المتعلم البداية تدريجيا  و تتبع الدروس خطوة بخطوة حتى يتمكن و يصل الى الاحتراف في هذه اللغة البرمجية.  في هذه التدوينة ساختصر لك بعد الخطوات المهمة التي سترفع من مستواك فال html . ما الذي تحتاجه فالhtml؟ اول اداة تحتاجها كمبتدا في عملك هو محرر html وهو برنامج لتكتب به أكواد ورموز HTML وتقوم عليه بتطبيق ما تعلمته، ويوجد العديد من البرامج  ومن أشهرها وأفضلها:   Phase5  : مُحرر معروف و يدعم  العديد من لغات البرمجة مثل php و Java Script جافا سكربت وجافا Java وغيرها ، ويمكّن المستخدم من العمل على مختلف البرمجيات والتعديل على مستندات مختلفة . Notepad++ : برنامج تحرير كلاسيكي يدعم  html وcssو لغات برمجة ع
المزيد