4.6 KiB
4.6 KiB
id | title | isRequired | challengeType | videoUrl | localeTitle |
---|---|---|---|---|---|
bd7157d8c242eddfaeb5bd13 | Build a Markdown Previewer | true | 3 | بناء على Markdown Previewer |
Description
textarea
مع id="editor"
المقابلة id="editor"
. قصة المستخدم رقم 2: يمكنني رؤية عنصر له id="preview"
مناظر id="preview"
. قصة المستخدم رقم 3: عند إدخال نص في عنصر #editor
، يتم تحديث عنصر #preview
أثناء الكتابة لعرض محتوى النص. قصة المستخدم رقم 4: عندما أقوم بإدخال #editor
GitHub في عنصر #editor
، يتم عرض النص على هيئة HTML في عنصر #preview
أثناء الكتابة (HINT: لست بحاجة إلى تحليل Markdown بنفسك - يمكنك استيراد المكتبة المحددة لهذا: https://cdnjs.com/libraries/marked ). قصة المستخدم رقم 5: عندما يتم أولاً تحميل أداة معاينة #editor
يجب أن يحتوي النص الافتراضي في الحقل #editor
على #editor
صالحة تمثل عنصرًا واحدًا على الأقل من كل عنصر من العناصر التالية: رأس (حجم H1) ، رأس فرعي (حجم H2) ، ورابط ، ورمز مضمّن ، وكتلة برمجية ، وبند قائمة ، وقطعة اقتباس ، وصورة ، ونص غامق. قصة المستخدم رقم 6: عندما يتم أولاً تحميل أداة معاينة #editor
يجب أن يتم عرض #editor
حقل #editor
على #editor
HTML في عنصر #preview
. مكافأة اختيارية (لا تحتاج إلى إجراء اختبار تجريبي): يفسر أداة معاينة العلامة التجارية الخاصة بي إرجاع الإرجاع وتجعلها كعناصر br
(فواصل الأسطر). يمكنك بناء مشروعك عن طريق تسجيل قلم CodePen هذا . أو يمكنك استخدام رابط CDN هذا لتشغيل الاختبارات في أي بيئة تفضلها: https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js
بمجرد الانتهاء ، أرسل عنوان URL إلى عملك مشروع مع كل اختباراتها تمر. تذكر استخدام طريقة Read-Search-Ask إذا واجهتك مشكلة. Instructions
Tests
tests: []
Challenge Seed
Solution
// solution required