- تعرّف على تطبيقات الويب وكيف تختلف عن تطبيقات الأجهزة المحمولة
- تعرف على الخيارات المختلفة لبرمجة تطبيقات الويب وإنشاء تطبيقات الويب
- تثبيت البرنامج اللازم لإنشاء تطبيق ويب
هذه هي أنشطة هذا الدرس:
تطبيقات الويب
بالنسبة لمشروعك في Technovation، لديك خيار إنشاء تطبيق جوال أو تطبيق تطبيق ويب.
للمشاركين الذين شاركوا في Technovation من قبل ويبحثون عن تحدٍ جديد، أو للمشاركين الجدد الذين لديهم خبرة سابقة في البرمجة، يمكنك التفكير في إنشاء تطبيق ويب لمشروع Technovation الخاص بك.
سيختار العديد من المشاركين إنشاء تطبيق جوال، باستخدام أحد أدوات إنشاء التطبيقات المقترحة لدينا، App Inventor أو Thunkable. إذا كنت جديدًا على البرمجة أو كنت تعلم أنك تريد استخدام App Inventor أو Thunkable لبرمجة تطبيقك، يمكنك تخطي هذا الدرس!
ينطوي إنشاء تطبيق ويب على ترميز قائم على النصوص، وهو أكثر تقدمًا من الترميز القائم على الكتل باستخدام App Inventor أو Thunkable.
لنبدأ بمراجعة الفرق بين تطبيقات الأجهزة المحمولة وتطبيقات الويب وتطبيقات الويب التقدمية.
تطبيق الهاتف المحمول
- برنامج يعمل أصلاً على الهاتف
- تم تنزيله وتثبيته على الجهاز
- يمكن الوصول إلى ميزات الهاتف، مثل GPS والكاميرا
- خاص بالمنصة (iOS أو Android)
- مشفرة بلغات معينة لتتناسب مع نظام التشغيل
تطبيق الويب
- يشبه إلى حد كبير تطبيق الهاتف المحمول
- يعمل في متصفح الإنترنت
- ليس أصليًا لجهاز معين (iOS أو Android)
- يتم ترميزه بشكل عام باستخدام HTML و CSS و Javascript و Python
- لا يمكن تشغيله عند عدم الاتصال بالإنترنت
تطبيق الويب التقدمي
- نوع خاص من تطبيقات الويب التي تعد مزيجًا بين تطبيق الجوال وتطبيق الويب
- يعمل في متصفح
- يمكن أيضًا تثبيتها على الجهاز المحمول مثل تطبيقات المحمول العادية
- يمكن تشغيله حتى عندما يكون المستخدم غير متصل بالإنترنت
لاحظ أن تطبيق الويب يختلف عن الموقع الإلكتروني. فموقع الويب ثابت ومشفّر باستخدام HTML وCSS. تطبيقات الويب ديناميكية ومتغيرة، بناءً على مدخلات المستخدم والتفاعلات الخارجية الأخرى. بالنسبة لمشروع التكنوفيشن الخاص بك، الموقع الإلكتروني غير مقبول.
سنستكشف بعض خيارات المبتدئين لإنشاء تطبيقات الويب.
يتمثل أحد الاختلافات الكبيرة عن منصات بناء التطبيقات التي نغطيها لتطبيقات الجوال في أنك ستنشئ تطبيق ويب باستخدام لغة برمجة قائمة على النصوص بدلاً من لغة قائمة على الكتل.
هناك لغتان رئيسيتان تُستخدمان لإنشاء تطبيقات الويب.
JAVASCRIPT
جافا سكريبت, أو JSهي لغة برمجة نصية. هذا يعني أن الشيفرة البرمجية تُنفذ في وقت التشغيل، بدلاً من تجميعها، مثل تطبيقات الجوال. إنها مثل الممثل الذي يقوم بتشغيل نصه أثناء العرض في كل مرة يتم فيها تشغيل العرض.
غالبًا ما يتم دمج Javascript مع HTML و CSS لإنشاء مواقع الويب. تُستخدم HTML و CSS لإنشاء مواقع الويب الثابتة، والتي يمكن أن تقدم معلومات ولكنها لا تتغير. تضيف جافا سكريبت التفاعل والقدرة على تغيير الموقع الإلكتروني وتحديثه بناءً على عوامل خارجية. والموقع الإلكتروني الديناميكي التفاعلي هو في الأساس تطبيق ويب.
بيثون
بايثون هي لغة برمجة شائعة جدًا للأغراض العامة. بايثون هي لغة برمجة و ولغة برمجة نصية، لذا يمكن تجميعها للتشغيل ولكن يمكن أيضًا تنفيذها في وقت التشغيل.
ويُنظر إليها على أنها لغة مباشرة ومتعددة الاستخدامات ومتاحة للمبرمجين الجدد. وتستخدم في العديد من الجوانب المختلفة لتطوير البرمجيات. أحد المجالات هو تطوير الويب. ومجال آخر هو التعلم الآلي. لذا، تُعد بايثون خياراً رائعاً لتعلم وتطوير تطبيقات الويب الأكثر تقدماً في مجال الذكاء الاصطناعي.
سنركز في هذا المنهج على إنشاء تطبيقات الويب باستخدام Python. لإنشاء تطبيق ويب بسهولة باستخدام Python، سنستخدم إطار عمل يسمى Streamlit. يسمح لك Streamlit ببناء تطبيقات ويب تفاعلية قوية وتفاعلية مع القليل من التعليمات البرمجية. وهو متخصص في التطبيقات التي تتضمن البيانات، ويتيح لك استخدام مكتبات التعلم الآلي من بايثون بسهولة لدمج الذكاء الاصطناعي في تطبيقاتك.
فيما يلي بعض الميزات الرئيسية.
- خيار جيد للأشخاص الذين لديهم الكثير من الخبرة في البرمجة القائمة على الكتل ويبحثون عن تحدٍ جديد
- جيد للأشخاص الذين قاموا ببعض الترميز النصي
- لغة متعددة الاستخدامات تستخدم على نطاق واسع
- ستحتاج إلى تثبيت برنامج على جهاز الكمبيوتر الخاص بك
- بايثون والمكتبات المرتبطة بها
- محرر التعليمات البرمجية
- يحتوي Streamlit على خيار التشغيل في المتصفح، باستخدام Github
- لن نغطي هذا الخيار في هذا المنهج الدراسي
- يمكنك استخدام الذكاء الاصطناعي معها
- اللغة الأكثر شيوعًا لبناء نماذج التعلم الآلي واستخدامها
- سنستخدم دفاتر Jupyter Notebook في هذا المنهج لبناء النماذج
البدء
لترميز تطبيقات الويب لمشروعك Technovation، ستحتاج إلى
- جهاز كمبيوتر أو كمبيوتر محمول
- الوصول إلى الإنترنت
يجب أن تكون مرتاحًا إلى حدٍ ما في استخدام نافذة Terminal على نظام ماك أو لينكس وإما Terminal أو موجه الأوامر على ويندوز. إذا لم تكن لديك خبرة، أو حتى تعرف ما هي نافذة Terminal، فراجع مقاطع الفيديو هذه للمبتدئين قبل الانتقال إلى النشاط.
شاهد الفيديو المناسب لنظام التشغيل الخاص بك.
سنغطي خيارين لتطوير تطبيقات الويب. يمكنك إما البرمجة على حاسوبك أو حاسوبك المحمول، أو يمكنك برمجة كل شيء في السحابة. يمكنك اختيار أي من الخيارين، ولكن يوصى باختيار أحد الخيارين والالتزام به من خلال مشروعك التكنوفيشن. معرفة كيفية استخدام الأوامر الطرفية المذكورة أعلاه مفيدة في أي من الخيارين.
إليك بعض الإيجابيات والسلبيات لكل منها.
على جهاز الكمبيوتر الخاص بك
الإيجابيات:
- يتم حفظ الملفات على جهاز الكمبيوتر الخاص بك
- تعلم كيفية استخدام Visual Studio Code، IDE الشهير جدًا
- سوف تتعلم الكثير عن استخدام نافذة المحطة الطرفية، وتثبيت الحزم، وما إلى ذلك
- التحكم الكامل واختيار البرامج المستخدمة
- يمكن البرمجة دون الحاجة إلى الوصول إلى الإنترنت دائماً
السلبيات:
- ليس من السهل مشاركة الملفات والرموز البرمجية مع فريقك
- يمكن أن يكون تثبيت الحزم محبطاً للغاية وقد يستغرق وقتاً طويلاً في الإعداد
- احتمال فقدان الملفات في حالة تعطل الكمبيوتر
في السحابة
الإيجابيات:
- يتم تخزين الملفات في السحابة
- لا حاجة لتثبيت أي شيء على جهاز الكمبيوتر الخاص بك
- رابط تلقائي إلى Github لأغراض الحافظة
- سهولة المشاركة والترميز كفريق واحد
السلبيات:
- لن يكون لديك خبرة استخدام البرامج محلياً
- الاعتماد على الاتصال بالإنترنت
اختر إما النشاط (أ) أو النشاط (ب)، بناءً على ما إذا كنت تريد البرمجة محلياً على حاسوبك أو البرمجة في السحابة.
النشاط (أ): ابدأ باستخدام بايثون على جهاز الكمبيوتر الخاص بك
تثبيت البرنامج والتطبيق المبدئي للرموز البرمجية
- الخطوة 1: قم بتثبيت Python. فيما يلي مجموعة جيدة من الإرشادات للنوافذ أو ماك أو لينكس.
- الخطوة 2: تثبيت محرر التعليمات البرمجية و Streamlit. يوضح لك هذا الفيديو كيفية تثبيت Visual Studio Code ثم تثبيت Streamlit لتشغيله من محرر الأكواد.
- الخطوة 3: قم بتشغيل تطبيق ويب Streamlit بسيط للغاية في بيئة VS Code باتباع هذا الفيديو.
- احتفل بأخذ لقطة شاشة لأول تطبيق ويب لك وأرسلها مع ملاحظة إلى مرشدك!
النشاط ب: البدء باستخدام بايثون في السحابة
إنشاء الحسابات وترميز التطبيق
مراجعة المصطلحات الرئيسية
- تطبيق ويب - تطبيق يشبه تطبيق الهاتف المحمول ولكنه يعمل في متصفح الإنترنت ويتم ترميزه باستخدام HTML و CSS و Javascript أو Python
الانعكاس
تهانينا على تجربة بعض البرمجة النصية! إليك بعض أسئلة التفكير التي يمكنك التفكير فيها مع فريقك ومع مرشدك.
الموارد الإضافية
ستحتاج إلى الرجوع إلى الوثائق والدعم للمساعدة في العمل مع Python & Streamlit. فيما يلي بعض الأماكن الجيدة للبدء.
- يحتوي دليل Python.org للمبتدئين على بعض الروابط الجيدة لتعلم المزيد عن Python.
- معرض تطبيقات ستريمليت
- قائمة تشغيل دورة ستريمليت الكاملة من نايلج للإنتاج
