أخر الاخبار

جافا سكريبت كورس تعلم لغة البرمجه JavaScript

"JavaScript" "جافا سكريبت" أو اختصارًا JS هي لغة برمجة عالية المستوى تستخدم في متصفحات الويب لإنشاء صفحات أكثر تفاعلية. ، سنتحدث اليوم عن تلك اللغة الرائعة في البرمجة وأفضل ميزات لغة JavaScript وطريقة العمل وبنهاية المقال كورس مجاني في جافا سكريبت.

جافا سكريبت كورس تعلم لغة البرمجه JavaScript

وتُستخدَم لغة "JavaScript " "جافا سكريبت" لإنشاء صفحات الويب، وهي مُستعمَلة من أغلبية المواقع، وتدعمها جميع المتصفحات.

كورس تعلم جافا سكريبت

"JavaScript" "جافا سكريبتهي لغة برمجة نصية أو برمجة تسمح لك بتنفيذ ميزات معقدة على صفحات الويب في كل مرة تقوم فيها صفحة الويب بعرض معلومات ثابتة لك لتطلع عليها.

وعرض تحديثات المحتوى في الوقت المناسب ، والخرائط التفاعلية ، والرسوم المتحركة ثنائية الأبعاد / رسومات ثلاثية الأبعاد ، وتمرير مربعات موسيقية للفيديو.



لغات البرمجة

لغات البرمجة

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

CSS هي لغة قواعد النمط التي نستخدمها لتطبيق التصميم على محتوى HTML ، على سبيل المثال تعيين ألوان الخلفية والخطوط، ووضع المحتوى الخاص بنا في أعمدة متعددة.

"JavaScript " "جافا سكريبتهي لغة برمجة تتيح لك إنشاء محتوى محدث ديناميكيًا ، والتحكم في الوسائط المتعددة ، وتحريك الصور ، وكل شيء آخر تقريبًا.

الطبقات الثلاث تبني فوق بعضها بشكل جيد لنأخذ تسمية نصية بسيطة كمثال يمكننا ترميزه باستخدام HTML لمنحه الهيكل والغرض :

<p>Player 1: Chris</p>

ثم يمكننا إضافة بعض CSS إلى المزيج لجعله يبدو رائعًا :

p {
font-family: 'helvetica neue', helvetica, sans-serif;
letter-spacing: 1px;
text-transform: uppercase;
text-align: center;
border: 2px solid rgba(0,0,200,0.6);
background: rgba(0,0,200,0.3);
color: rgba(0,0,200,0.6);
box-shadow: 1px 1px 2px rgba(0,0,200,0.4);
border-radius: 10px;
padding: 3px 10px;
display: inline-block;
cursor: pointer;
}

وأخيرًا، يمكننا إضافة بعض "JavaScript " "جافا سكريبتلتنفيذ السلوك الديناميكي :

const para = document.querySelector('p');

para.addEventListener('click', updateName);

function updateName() {
let name = prompt('Enter a new name');
para.textContent = 'Player 1: ' + name;
}

*إذن ما الذي يمكن فعله بــ

لغة البرمجة "JavaScript"جافا سكريبت؟

تتكون لغة "JavaScript " "جافا سكريبتالأساسية من جانب العميل من بعض ميزات البرمجة الشائعة التي تتيح لك القيام بأشياء مثل:
- تخزين القيم المفيدة داخل المتغيرات. في المثال أعلاه ، على سبيل المثال ، نطلب إدخال اسم جديد ثم تخزين هذا الاسم في متغير يسمى name.
- عمليات على أجزاء من النص (المعروفة باسم "سلاسل" في البرمجة). في المثال أعلاه ، نأخذ السلسلة "Player 1:" وضمها إلى name المتغير لإنشاء تسمية نص كاملة ، على سبيل المثال "Player 1: Chris".
- تشغيل التعليمات البرمجية استجابةً لأحداث معينة تحدث على صفحة الويب. استخدمنا click حدثًا في المثال أعلاه لاكتشاف وقت النقر فوق الزر ثم تشغيل الكود الذي يقوم بتحديث تسمية النص.

ولكن لا تتعجل ، ولا تفرط في الشعور بالحماس بعد. لأنك لن تتمكن من إنشاء Facebook أو خرائط Google أو Instagram بعد دراسة "JavaScript " "جافا سكريبتفقط - هناك الكثير من الأساسيات التي يجب تغطيتها وتعلمها أولاً. 

ماذا تفعل JavaScript على صفحتك؟

سنبدأ  في النظر إلى بعض التعليمات البرمجية ، وأثناء القيام بذلك ، استكشف ما يحدث بالفعل عند تشغيل بعض "JavaScript" "جافا سكريبتفي صفحتك.

بإيجاز ما يحدث عند تحميل صفحة ويب في متصفح . عندما تقوم بتحميل صفحة ويب في متصفحك ، فأنت تقوم بتشغيل التعليمات البرمجية الخاصة بك (HTML و CSS و "JavaScript " "جافا سكريبت) داخل بيئة تنفيذ (علامة تبويب المتصفح). هذا يشبه المصنع الذي يأخذ المواد الخام (الكود) ويخرج منتجًا (صفحة الويب).

جافا سكريبت- كورس جافا سكريبت

ألأستخدام الشائع جدًا لـ "JavaScript " "جافا سكريبت" هو تعديل HTML و CSS ديناميكيًا لتحديث واجهة المستخدم ، عبر واجهة برمجة تطبيقات نموذج كائن المستند.

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

قد تحدث أخطاء إذا تم تحميل "JavaScript " "جافا سكريبتوتشغيله قبل HTML و CSS المقصود تعديلهما.


ترتيب تشغيل JavaScript

عندما يواجه المتصفح كتلة جافا سكريبت، فإنه يعمل بشكل عام بالترتيب ، من أعلى إلى أسفل. هذا يعني أنك بحاجة إلى توخي الحذر بشأن الترتيب الذي تضع فيه الأشياء. على سبيل المثال ، دعنا نعود إلى كتلة "JavaScript" "جافا سكريبتالتي رأيناها في مثالنا الأول :

const para = document.querySelector('p');

para.addEventListener('click', updateName);

function updateName() {
let name = prompt('Enter a new name');
para.textContent = 'Player 1: ' + name;
}

هنا نختار فقرة نصية (السطر 1) ، ثم نعلق مستمع حدث بها (السطر 3) بحيث عند النقر على الفقرة ، update Name ( ) يتم تشغيل كتلة الكود (الأسطر 5-8) و updateName( ) (وتسمى هذه الأنواع من التعليمات البرمجية القابلة لإعادة الاستخدام "وظائف") كتلة التعليمات البرمجية يسأل المستخدم عن اسم جديد، ومن ثم إدراج هذا الاسم في الفقرة لتحديث العرض.

إذا قمت بتبديل ترتيب أول سطرين من التعليمات البرمجية ، فلن يعمل بعد ذلك - وبدلاً من ذلك، ستظهر رسالة خطأ في وحدة تحكم مطور المتصفح - TypeError: para is undefined. هذا يعني أن para الكائن غير موجود بعد ، لذلك لا يمكننا إضافة مستمع الحدث إليه.

ملحوظة:
هناك خطأ شائع جدًا - يجب أن تكون حريصًا على وجود الكائنات المشار إليها في التعليمات البرمجية الخاصة بك قبل محاولة القيام بأشياء لها.

 

تفسير التعليمات البرمجية المترجمة مقابل الشفرة

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

ويتم تحويل (تجميع) اللغات المترجمة إلى نموذج آخر قبل تشغيلها بواسطة الكمبيوتر. على سبيل المثال ، يتم تجميع C / C ++ في رمز الجهاز الذي يتم تشغيله بعد ذلك بواسطة الكمبيوتر. يتم تنفيذ البرنامج من تنسيق ثنائي ، تم إنشاؤه من التعليمات البرمجية المصدر للبرنامج الأصلي.

JavaScript هي لغة برمجة مفسرة خفيفة الوزن. يتلقى متصفح الويب كود "JavaScript " "جافا سكريبتفي شكله النصي الأصلي ويقوم بتشغيل البرنامج النصي من ذلك. 

JavaScript

ويستخدم معظم مترجمي "JavaScript " "جافا سكريبتالحديث تقنية تسمى الترجمة في الوقت المناسب لتحسين الأداء؛ يتم تجميع شفرة مصدر "JavaScript " "جافا سكريبتفي تنسيق ثنائي أسرع أثناء استخدام البرنامج النصي، بحيث يمكن تشغيله في أسرع وقت ممكن. ومع ذلك ، لا تزال تعتبر "JavaScript" "جافا سكريبتلغة مفسرة ، حيث يتم التعامل مع الترجمة في وقت التشغيل، وليس في وقت مبكر.


جانب الخادم مقابل التعليمات البرمجية من جانب العميل

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

ويتم تشغيل الكود من جانب الخادم على الخادم ، ثم يتم تنزيل نتائجه وعرضها في المتصفح. تتضمن أمثلة لغات الويب الشائعة من جانب الخادم PHP و Python و Ruby و ASP.NET و JavaScript , ويمكن أيضًا استخدام JavaScript كلغة من جانب الخادم في مواقع الويب الديناميكية  .


    ديناميكي مقابل كود ثابت

    تُستخدم الكلمة ديناميكي لوصف كل من "JavaScript" "جافا سكريبتمن جانب العميل ولغات جانب الخادم - فهي تشير إلى القدرة على تحديث عرض صفحة الويب / التطبيق لإظهار أشياء مختلفة في ظروف مختلفة، وإنشاء محتوى جديد كما هو مطلوب. 

    تنشئ التعليمات البرمجية من جانب الخادم محتوى جديدًا ديناميكيًا على الخادم ، على سبيل المثال سحب البيانات من قاعدة البيانات ، بينما يقوم "JavaScript" "جافا سكريبتبإنشاء محتوى جديد ديناميكيًا داخل المتصفح، على سبيل المثال إنشاء جدول HTML جديد وملئه بالبيانات المطلوبة من الخادم ، ثم عرض الجدول في صفحة ويب تظهر للمستخدم.

    - يشار إلى صفحة الويب التي لا تحتوي على محتوى محدث ديناميكيًا على أنها ثابتة - فهي تعرض نفس المحتوى طوال الوقت.



    كيف تضيف JavaScript إلى صفحة HTML؟

    يتم تطبيق "JavaScript " "جافا سكريبتعلى صفحة HTML بطريقة مشابهة لـ CSS. بينما تستخدم CSS <link> عناصر لتطبيق أوراق أنماط <style> وعناصر خارجية لتطبيق أوراق أنماط داخلية على HTML، فإن JavaScript يحتاج فقط إلى صديق واحد في عالم HTML - وهو <script> العنصر. 


    معالجات جافا سكريبت المضمنة

    لاحظ أنه في بعض الأحيان ستصادف أجزاء من كود "JavaScript" "جافا سكريبتالفعلي تعيش داخل HTML مثل هذا:

    function createParagraph() {
    let para = document.createElement('p');
    para.textContent = 'You clicked the button!';
    document.body.appendChild(para);
    }
    <button onclick="createParagraph()">Click me!</button>


    هل تريد تعلم لغة البرمجة "JavaScript " "جافا سكريبت

    في هذا الموضوع سأقدم لك أفضل الكورسات المجانية والمدفوعة في تعلم لغة برمجة الويب جافا. سكريبت  "JavaScript " جافا سكريبت ومن كل قلبي ادعو الله أن يستفيد كل عربي بما أقدمه من شروحات وكورسات وغيرها كي نرتقي بمستقبل أفضل مدرك بما يدور حولنا من تقدمات سريعة كل لحظة.



    - أليك أفضل الكورسات المجانية والمدفوعة في تعلم "جافا سكريبت"

    كورس تعلم جافا سكريبت "JavaScript"

    كورس تعلم جافا سكريبت "JavaScript"

     كورس تعلم جافا سكريبت

      • الجهة المقدمة: Codecademy.
      • تكلفة الكورس: مجاني أول 7 أيام.
      • اللغات المتاحة: الإنجليزية، العربية ترجمة.
      • المستوى المستهدف: مبتدئ.
      • مدة الكورس: 30 أسبوعًا.
      • تقييم الكورس: 4.5.
      • الشهادة: متاحة بعد إتمام الكورس واجتياز كافة الاختبارات.
      • رابط الكورس أضغط هنا


      هذا الكورس مقدّم من Codecademy وهو من أفضل الكورسات المختصة في "JavaScript"، نود.جي إسSQL ، Express. JS ، يردون ، TDD.

      وستأخذ في كورس تعلم "جافا سكريبت" مقدمة في تطوير الويب وتطوير الشبكة والتنقل من برنامج no-code إلى مطور ويب مبتدئ عند الطلب ، وتعلم الواجهة الأمامية من خلال تعلم HTML و CSS و جافا سكريبت. وبعد ذلك ، أتقان الواجهة الخلفية وواجهات برمجة التطبيقات لاستكمال مهاراتك الكاملة.




      ماذا ستتعلم في كورس"JavaScript "جافا سكريبت

      - ستتعلم في كورس تعلم "جافا سكريبت"

      1- تعلم HTML

      ابدأ كمطور ويب من خلال تعلم أساسيات HTML، اللغة الأساسية للويب.

      2- تصميم موقع على شبكة الإنترنت

      تعلم وتمرن على أساسيات CSS لإضافة تصميم جميل إلى صفحات الويب الخاصة بك.

      3- الشروع في العمل مع JavaScript "جافا سكريبت"

      تعلم أساسيات "JavaScript ": بناء الجملة والمتغيرات والشرطية والوظائف.

      4- الحصول على مزيد من التقدم مع التصميم

      ستتعرف على تقنيات CSS لمواقع أكثر إثارة للاهتمام: العرض وتحديد المواقع والألوان والطباعة والتصميم سريع الاستجابة و flexbox.

      5- "JavaScript " "جافا سكريبت": المصفوفات والحلقات والكائنات

      اكتشاف المزيد من تقنيات وميزات جافا سكريبت بما في ذلك المصفوفات والحلقات والعناصر.

      6- بناء مواقع جافا سكريبت تفاعلية

      تعلم نموذج كائن المستند، الواجهة بين عناصر جافا سكريبت و HTML، واجمع بين HTML و CSS وجافا سكريبت في مواقع تفاعلية مثيرة!

      7- "JavaScript " متوسط "جافا سكريبت"

      ستتعرف على المزيد من التقنيات لتوسيع نطاق معرفتك بــ "JavaScript " بما في ذلك الفئات القابلة لإعادة الاستخدام وتقسيم التعليمات البرمجية إلى وحدات وتقديم طلبات HTTP.

      8- JavaScript تعلم سطر الأوامر

      اكتشف قوة هذه الأداة النصية البسيطة والأساسية وقم بزيادة إنتاجيتك كمطور.

      9- تعلم Git

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

      10- بناء تطبيقات الواجهة الأمامية باستخدام React

      تعلم كيفية إنشاء تطبيقات ويب ديناميكية وقوية باستخدام React.js ، وهو إطار أمامي قائم على المكونات.

      11- تطوير JavaScript Back-End

      ستتعلم كيفية إنشاء خوادم خلفية وواجهات برمجة تطبيقات في "جافا سكريبتباستخدام إطار عمل Express.js الشهير.

      12- SQL وقواعد البيانات لتطوير الويب

      تعلم أساسيات SQL اللازمة لتكون مطور ويب ناجحًا متكاملًا.

      13- بناء API المستمر

      تعلم Node-SQLite لتوصيل JS و SQL في تطبيقات الويب ، وبناء أول تطبيق للجهة الخلفية متكامل تمامًا.

      14- تطوير يعتمد على الاختبار باستخدام JavaScript

      إتقان أساسيات التطوير المستند إلى الاختبار لإنشاء تطبيقات ويب "JavaScript كاملة المكدس وموثوقة.


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

      - في نهاية كورس تعلم "جافا سكريبت" ستكون اكتسبت الاتي

      • تعلم تطوير الواجهة الأمامية والخلفية.
      • بناء وتصميم مواقع تفاعلية.
        • UNDERSTAND THE FULL STACK

        أتقن الأدوات التي يستخدمها مطورو الواجهة الأمامية كل يوم ، من HTML إلى React ، بالإضافة إلى مكتبات "جافا سكريبتللجهة الخلفية من جانب الخادم باستخدام Express.js.

        • BUILD A WEB APP

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

        • SHOW OFF YOUR SKILLS

        أيضا ستتعلم بناء مشاريع جديرة بالمحفظة أثناء التعلم ، حتى تتمكن من إظهار مهاراتك لموظفي التوظيف وبدء حياتك المهنية كمطور ويب.


        الخلاصة

        وفي النهاية كانت هذه نبذة عن أشهر لغات البرمجة "JavaScript " وأيضا أفضل الكورسات المجانية والمدفوعة في تعلم "جافا سكريبت"، وأتمني أن تكون استفدت من الشرح وأضاف لك شيئا جديداً.

        هذا كل شيء لهذا اليوم ، وسنعود إن شاء الله بمنشور جديد قريبًا . حتى ذلك الحين ، اعتني بنفسك جيداً ، وتعلم أكثر وفضلا وليس أمراً شارك الموضوع علي الواتساب ومواقع التواصل حتي يستفيد غيرك أزرر المشاركة أسفل الموضوع.

        دومتم في أمان الله
        Ahmed Alkoptan
        بواسطة : Ahmed Alkoptan
        أحمد القبطان | أعمل بمجال الكمبيوتر ومصمم جرافيك ومنشئ مواقع ويب وعاشق لمجال التقنية والجرافيك



        حجم الخط
        +
        16
        -
        تباعد السطور
        +
        2
        -