لوحة المتصدرين

تساعدك الواجهة البرمجية (API) الخاصة بموقع التواصل الاجتماعي تويتر في إدارة الحسابات الموجودة فيه، كما وتسمح لك بالتنقيب عما يحتويه من بيانات. هذا الأمر يفيدك – مثلاً - في عملية ترويج هوية المؤسسة أو المنظمة التي تعمل فيها، وكذلك يُعدّ ممتعًا ومسليًا للمستخدمين الأفراد وهواة البرمجة. في هذا الدرس سوف نشرح لكم الخطوات اللازمة لإنشاء تطبيق توتير، وبعد ذلك سنبني سكربت بايثون من خلال استخدام مكتبة Tweepy للاستفادة من التطبيق و نشر تغريدات من خلاله. المتطلبات قبل البدء، تأكد من وجود المتطلبات التالية: وجود حساب توتير مرتبط برقم هاتف محمول صحيح، وتستطيع إعداد ذلك بالذهاب إلى خيار الهاتف المحمول في قائمة الإعدادات والخصوصية. وجود بيئة بايثون مثبتة على جهاز العمل. الخطوة الأولى: إنشاء تطبيق تويتر لنبدأ في بناء تطبيق تويتر والحصول على مفاتيح ورموز الوصول الخاصة بالواجهة البرمجية للتطبيق. هذه الرموز هي التي تسمح لك بالاستيثاق من أي تطبيق تطوّره لكي يعمل مع تويتر. كما ذكرنا في المتطلبات، فأنت تحتاج لرقم هاتف محمول لكي تستطيع بناء التطبيق. افتح المتصفح وزر هذا الرابط وسجّل الدخول للصفحة باستخدام بيانات حسابك. اضغط بمجرد ولوجك على الزر المعنون ب (Create New App). سوف تُوجَّه إلى صفحة بناء التطبيق التالية: أدخل في هذه الصفحة الحقول المطلوبة كما في المثال التالي: الاسم: AcademyHsoubTest الوصف: Academy Hsoub Application الموقع: https://my.example.placeholder اقرأ اتفاقية مطور تويتر. إذا كنت موافقاً عليها، اضغطعلى خيار الموافقة واضغط على الزر المعنون ب Create your Twitter application والموجود في أسفل الصفحة، وسوف تتلقى صفحة تأكيد على ذلك. ستُوجَّه بعد أن نجاح إنشاء التطبيق إلى صفحة التطبيق التالية، والتي تُقدم لك بعض المعلومات العامة عن التطبيق. الخطوة الثانية: تعديل مستوى الإذن للتطبيق وتوليد رموز الوصول الخاصة به من صفحة التفاصيل (Details Page) السابقة، اذهب لخيار الأذونات (Permissions) وذلك للتأكد من أننا نمتلك مستوى الوصول المطلوب لتوليد مفاتيح التطبيق. يمتلك التطبيق تلقائيا أذونات القراءة والكتابة. إذا لم يكن كذلك، عدّل التطبيق وتأكد من أن خيار القراءة والكتابة هو المحدد من قائمة الأذونات. هذا الأمر يسمح للتطبيق بالنشر على حساب تويتر بالنيابة عنك. اذهب بعد التأكد من أذونات التطبيق التي تسمح له بالنشر إلى خيار المفاتيح ورموز الوصول (Keys and Access Tokens). ستُنقَل إلى صفحة تعرض لك مفتاح المستهلك (Consumer Key) والرمز السري للمستهلك (Consumer Secret)، وكذلك تُمكنك من توليد رمز الوصول ورمز الوصول السري. هذه الرموز والمفاتيح هي التي ستقوم بعملية الاستيثاق لتطبيقك مع تويتر. اضغط على الزر المعنون ب (Create my access token) لتوليد رمز الوصول ورمز الوصول السري. أصبح لديك الآن رمز الوصول ورمز الوصول السري. الخطوة الثالثة: تثبيت مكتبة Tweepy تستطيع أن تستخدم مجموعة متنوعة من لغات البرمجة للتخاطب مع الواجهة البرمجية لتويتر. سنختبر التطبيق الذي أنشأناه عن طريق تشغيل سكربت بايثون ينشُر نصًّا معيّنًا على حساب تويترللمستخدم. مكتبة Tweepy مفتوحة المصدر وسهلة الاستخدام وتسمح للمشاريع المكتوبة بلغة البايثون بالوصول للواجهة البرمجية لتويتر بكل سهولة. سنستخدم أداة pip لتثبيت مكتبة tweepy. أنشئ مجلدًا خاصًّا للمشروع باسم twitter. تأكد قبل تثبيت المكتبة أن أداة pip مُحدثة: >> pip install --upgrade pip بعد أن تُحدَّث الأداة بنجاح، نثبّت مكتبة Tweepy: >> pip install tweepy بعد تثبيت المكتبة تستطيع البدء بكتابة البرنامج. الخطوة الرابعة: بناء البرنامج الذي يتخاطب مع الواجهة البرمجية لتويتر أصبحنا، بعد أن بنينا التطبيق وولّدنا الرموز والمفاتيح اللازمة للوصول للتطبيق، على مشارف بناء البرنامج الذي سينشر بالنيابة عنك. أنشئ باستخدام محرر النصوص المفضل لديك ملف بايثون باسم helloworld.py في داخل المجلد twitter الذي أنشأناه في الخطوة السابقة. في بداية الملف، نحتاج أن نستورد المكتبة باستخدام جملة import: import tweepy سننشئ متغيرات لكل مفتاح ورمز ولّدناه. استبدل ما بين علامات التنصيص في المتغيرات التالية بالمفاتيح والرموز التي تم توليدها في تطبيقك الخاص. import tweepy consumer_key = 'your_consumer_key' consumer_secret = 'your_consumer_secret' access_token = 'your_access_token' access_token_secret = 'your_access_token_secret' ننشئ بعدها عنصرًا من الصنف OAuthHandler الموجود في مكتبة Tweepy وسنمرر لهذا العنصر المفاتيح والرموز الموجودة لدينا. يعمل هذا العنصر من خلال بروتوكول HTTP يعطي التصريح اللازم للأجهزة، الواجهات البرمجية، الخوادم والتطبيقات، ويعدّ هذا الصنف صنفا معياريا يقدّم ألية وصول آمن وذي تفويض كامل. نعدّ كذلك رموز الوصول وندمجها مع الواجهة البرمجية المنشأة من تعريف عنصر من نوع API. import tweepy consumer_key = 'your_consumer_key' consumer_secret = 'your_consumer_secret' access_token = 'your_access_token' access_token_secret = 'your_access_token_secret' auth = tweepy.OAuthHandler(consumer_key, consumer_secret) auth.set_access_token(access_token, access_token_secret) api = tweepy.API(auth) نحدّد في نهاية البرنامج النص الذي سننشره. عرف متغيرًا باسم tweet ومرر له النص الذي تريد نشره ومرّر هذا المتغير للدالة api.update_status. import tweepy # Create variables for each key, secret, token consumer_key = 'your_consumer_key' consumer_secret = 'your_consumer_secret' access_token = 'your_access_token' access_token_secret = 'your_access_token_secret' # Set up OAuth and integrate with API auth = tweepy.OAuthHandler(consumer_key, consumer_secret) auth.set_access_token(access_token, access_token_secret) api = tweepy.API(auth) # Write a tweet to push to our Twitter account tweet = 'أكاديمية حسوب، أهلا بالعالم' api.update_status(status=tweet) تستطيع الان حفظ الملف وتشغيله: >> python helloworld.py بعد انتهاء تنفيذ البرنامج، قم بمراجعة الحساب توتير الخاص بك. نشرت التغريدة على الخط الزمني لحسابك بنجاح وبذلك تكون قد هيّأت تطبيق تويتر واستخدمته من خلال مكتبة Tweepy! خاتمة باتباعك للشرح في هذا المقال، أنت أصبحت قادرا على تهيئة تطبيق تويتر وربطه بحسابك الخاص على الموقع. بمجرد بناء التطبيق وتوليد المفاتيح والرموز اللازمة، قمنا باستخدام التطبيق والرموز للاستيثاق من برنامج بايثون باستخدام المكتبة المفتوحة المصدر Tweepy. إذا لم تكن مبرمجًا للغة فابدأ بتعلم بايثون، أو هناك العديد من لغات البرمجة والمكتبات التي من الممكن استخدامها مع الواجهة البرمجية لتويتر. يحتوي الموقع الخاص بمطوري تويتر العديد من هذه المكتبات التي تدعم التخاطب مع الواجهة البرمجية لتويتر. ترجمة - بتصرّف - للمقال How To Create a Twitter App لصاحبته Lisa Tagliaferri. حقوق الصورة البارزة محفوظة لـ Freepik

سنتعرّف في هذا الدّرس على لغة البرمجة جافاسكربت من منظور عامّ وسنجيب على تساؤلاتك ماهي جافاسكربت؟ وما الذي تقوم بعمله في صفحات الوِب؟ و نتأكد من أن مفهوم جافاسكريبت قد أصبح واضحًا لديك. ملحوظة: يتوجَّه هذا الدرس، والدروس التي تليه - إلى من لديهم معرفة سابقة بأساسيّات التطوير للوِب: HTML وCSS. التعريف العام لجافاسكريبت تُعرَّف جافاسكريبت بأنّها لغة برمجة تسمح لك بتنفيذ أشياء معقدة على صفحات الوِب، تعدّ صفحات الوِب الحديثة أكثر من مجرد موقع يُظهر لك معلومات ثابتة تتصفحها، فهي - مثلًا - تعرض تحديثات المحتوى المباشرة، أو تعرض الخرائط التفاعلية، أو الرسومات المتحركة ثنائية أو ثلاثية الأبعاد، أو تمرّر ملفات الفيديو المصورة، وما إلى ذلك. تمثّل جافاسكريبت الطبقة الثالثة من طبقات تقنيات الوِب القياسية. الطبقتان الأوليان هما HTML وCSS. HTML هي لغة توصيف Markup نستخدمها لإنشاء محتوى الوِب وإضفاء معنى عليه، مثل تعريف الفقرات، العناوين وجداول البيانات أو تضمين الصور ومقاطع الفيديو في الصفحة. CSS هي لغة تعرّف قواعد الأنماط Style rules التي نستخدمها لتطبيق التصميم على المحتوى الذي تصفه 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; } أصبحت النتيجة الآن كالتالي. وأخيرًا، نضيف بضعة تعليمات جافاسكريبت لتنفيذ السلوك الديناميكي. var para = document.querySelector('p'); para.addEventListener('click', updateName); function updateName() { var name = prompt('Enter a new name'); para.textContent = 'Player 1: ' + name; } غرضنا الآن ليس شرح التعليمات السابقة (سنفعل ذلك لاحقا) ولكن توضيح ما يمكن أن تضيفه جافاسكريبت لـHTML وCSS. عند النقر على النص تظهر نافذة تطلُب إدخال اسم ثم عند إدخال الاسم في النافذة المنبثقة والنقر على زر OK تأخذ النص وتطبعه أمام الجملة Player 1. استعرض المثال على Jsfiddle. الشفرة المصدرية الكاملة للمثال. التشغيل المباشر. يمكن لجافاسكريبت أن تفعل أكثر من ذلك بكثير؛ دعونا نستكشف مزيدًا من التفاصيل. مالذي يمكن لجافاسكريبت فعله حقا؟ تتكون لغة جافاسكريبت الأساسية من بعض ميزات البرمجة الشائعة التي تسمح لك بفعل أشياء مثل: تخزين قيم مفيدة داخل متغيرات Variables. في المثال السابق على سبيل المثال، نطلب من المستخدم ادخال اسم جديد ثم يُخزَّن هذا الاسم في متغير يسمى name. العمليات على أجزاء من النص (المعروفة باسم سلاسل المحارف Strings في البرمجة). في المثال أعلاه، نأخذ سلسلة المحارف Player 1: ونضمها إلى متغير الاسم المذكور أعلاه لإنشاء الجملة الكاملة، على سبيل المثال Player 1: Chris. تشغيل التعليمات البرمجية ردًا على أحداث معينة تحدث على صفحة وِب. في المثال أعلاه استخدمنا الحدث click الذي يخبرنا أن المستخدم نقر على النصّ ثم نشغّل الشفرة التي تعمل على تحديث النص. والكثير! ولكن ما هو أكثر إثارة هو وظيفة بُنيت على لبّ لغة جافاسكريبت الأساسي. تسمى APIs وهي اختصار لـ Application Programming Interface واجهات برمجة التطبيقات. تتيح لك واجهات برمجة التطبيقات (APIs) المزيد من القوة لاستخدامها في شفرة جافاسكريبت. تُعرّف واجهات برمجة التطبيقات (APIs) على أنها مجموعات جاهزة من الشفرات البرمجيّة تسمح لمطور البرامج بتنفيذ برامج سيكون من الصعب أو المستحيل تنفيذها من دون استخدام واجهة برمجة التطبيقات. لأوضح لك الفكرة، تخيل أنك تريد عمل رف خشبي للكتب، سيكون الأمر أسهل بكثير لو توافرت لك الألواح الخشبية والمسامير بالمقاسات المناسبة وما عليك سوى تجميعها معًا لعمل رف الكتب. في حين سيكون الأمر أصعب بكثير لو توجّب عليك أنت العثور على الخشب المناسب وتقطيعه إلى الحجم والشكل الصحيح وإيجاد قياس المسامير المناسب ومن ثم تجميعها معًا لعمل رف الكتب. هذا ما تسهل عمله واجهات برمجة التطبيقات. تنقسم واجهات برمجة التطبيقات (APIs) عمومًا إلى فئتين. واجهات برمجة التطبيقات الخاصّة بالمتصفّح Browser APIs: تُدمَج واجهات برمجة تطبيقات في المتصفّح لإعطائه القدرة على عرض البيانات من بيئة الحاسوب المحيطة به، أو القيام بأشياء معقدة مفيدة. فمثلا: تسمح لك واجهة برمجة تطبيقات DOM وهي اختصار لـ Document Object Model بمعالجة HTML و CSS، إنشاء، إزالة وتغيير HTML ، تطبيق أنماط Styles جديدة ديناميكيًّا على صفحتك، وما إلى ذلك. في كل مرة تُعرَض فيها نافذة منبثقة تظهر على صفحة، أو يُعرَض محتوى جديد -كما رأينا أعلاه في مثالنا السابق- فواجهة DOM هي المسؤولة عن ذلك. تستعيد واجهة برمجة التطبيقات Geolocation API معلومات الموقع الجغرافي، ممّا يفسّر كيف يمكن لخرائط جوجل Google Maps أن تعثُر على موقعك الجغرافي وترسمه على الخريطة. تسمح لك واجهات برمجة تطبيقات اللوحة Canvas و WebGL بإنشاء رسومات متحركة ثنائية الأبعاد وثلاثية الأبعاد. يقوم الأشخاص بأشياء مدهشة باستخدام تقنيات الوِب هذه. تسمح لك واجهات برمجة التطبيقات الصوتية والمرئية مثل HTMLMediaElement و WebRTC بالقيام بأشياء مثيرة للاهتمام حقًا مع الوسائط المتعددة، مثل تشغيل الصوت والفيديو مباشرة في صفحة وِب أو التقاط الفيديو من كاميرا الوِب الخاصة بك وعرضها على جهاز كمبيوتر شخص آخر (جرب العرض التوضيحي snapshot) ملاحظة: لن تعمل العديد من العروض التوضيحية المذكورة أعلاه في متصفح أقدم. عند التجربة، من الأفضل استخدام متصفح حديث مثل فايرفوكس أو كروم أو Edge أو Opera لتشغيل الشفرة. واجهة برمجة التطبيقات الخاصّة بطرف ثالث Third party APIs. لا تُضمَّن هذه الواجهات في المتصفح مبدئيًّا. وعليك عمومًا الحصول على التعليمات البرمجية والمعلومات من مكان ما على الوِب. فمثلا: تتيح لك واجهة برمجة تطبيقات تويتر Twitter API إجراء أشياء مثل عرض أحدث التغريدات على موقعك الإلكتروني. تسمح لك واجهة برمجة التطبيقات لخرائط غوغل Google Maps API بتضمين الخرائط المخصصة في موقعك على الوِب، وغير ذلك من الوظائف. ملاحظة: واجهات برمجة التطبيقات هذه متقدمة، ولن يتم تغطية أي منها في هذه الدّروس، ولكن الروابط الواردة أعلاه توفّر وثائق شاملة إذا كنت مهتمًا بمعرفة المزيد. يوجد الكثير لتعلّمه، لا تفقد حماسك. دراسة جافاسكريبت لمدة 24 ساعة لن تعطيك القدرة على بناء فيسبوك، خرائط غوغل أو إنستغرام. هناك الكثير من الأساسيات التي يجب تغطيتها أولًا. وهذا هو السبب في أنك هنا. سنكمل في الدرس السابق حديثنا عن جافاسكريبت وستكون فرصة على للنظر الفعلي في شفرات برمجية. ترجمة - بتصرف - للمقال What is JavaScript? الذي اشترك في كتابته مساهمو موزيللا.