الإعداد
المتطلبات الأساسية
قبل بدء هذا البرنامج التعليمي، ستحتاج إلى ما يلي:
- معرفة أساسية بـ HTML وCSS وJavaScript
- فهم أساسي لمفاهيم AMP الأساسية (راجع البرنامج التعليمي "تحويل HTML إلى AMP")
- متصفح من اختيارك
- محرر نصوص من اختيارك
إعداد بيئة التطوير لديك
الخطوة 1. تنزيل الرمز
-
قم بتنزيل الكود الخاص بالبرنامج التعليمي، والذي يتم ضغطه كملف مضغوط بتنسيق zip من عنوان URL التالي: /static/files/tutorials/amp-pets-story.zip
-
استخرج محتويات الملف المضغوط، وفي الدليل amp-pets-story توجد ملفات الصور والفيديو والصوت والبيانات التي سنستخدمها لإنشاء قصتنا. ويُعد ملف pets.html نقطة البداية للقصة، فيما يمكن العثور على النسخة المكتملة من القصة في ملف pets-complete.html.
الخطوة 2. قم بتشغيل صفحة المثال
لاختبار نموذج قصة الويب، نحتاج إلى الوصول إلى الملفات من خادم ويب. ثمة عدة طرق لإنشاء خادم ويب محلي مؤقت لأغراض الاختبار. فيما يلي بعض الخيارات، اختر الأنسب بالنسبة لك:
بعد إعداد خادم الويب المحلي، ألق نظرة على الشكل الذي ستظهر عليه قصة الويب المكتملة بنهاية هذا البرنامج التعليمي من خلال الوصول إلى URL التالي:
http://localhost:8000/pets-completed.html
localhost وإلا فقد لا يتم تحميل قصة الويب تحميلًا صحيحًا، وقد تواجه أخطاء مثل "source" "must start with "https://" or "//" or be relative and served from either https or from localhost. انقر على القصة المكتملة وتعرَّف على ما سننشئه.
-