المهارات vanilla-webpage
📦

vanilla-webpage

مراجعة المحتوى r1 آمن ⚡ يحتوي على سكربتات⚙️ الأوامر الخارجية🌐 الوصول إلى الشبكة📁 الوصول إلى نظام الملفات

إنشاء صفحات ويب ثابتة باستخدام Vanilla

غالبا لا تحتاج صفحات الويب البسيطة إلى نظام بناء أو إطار عمل للواجهة الأمامية. تساعد هذه المهارة Claude وCodex وClaude Code على إنشاء صفحات ثابتة سهلة الوصول باستخدام HTML وCSS وJavaScript الحديثة.

يدعم: Claude Codex Code(CC)
📊 76 كافٍ

التثبيت باستخدام Agent لدي

انسخ هذا الطلب إلى Agent لديك. يتضمن صفحة Skill المعتمدة وملف manifest.

طلب الوكيل
Review the Skillstore skill "vanilla-webpage" from https://skillstore.io/skills/yuzu-octopus-vanilla-webpage.md and its manifest at https://skillstore.io/api/skills/yuzu-octopus-vanilla-webpage/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.

يجب أن يواصل Agent عرض خطته وطلب أي تأكيد تفرضه سياسة الأمان.

موارد مهيّأة لـ Agents

استخدم هذه الروابط عندما يحتاج AI Agent أو crawler أو script إلى سياق نظيف بدلًا من قراءة الصفحة كاملة.

تفاصيل Markdown GET /skills/yuzu-octopus-vanilla-webpage.md manifest موقَّع GET /api/skills/yuzu-octopus-vanilla-webpage/manifest lockfile موقَّع GET /api/skills/yuzu-octopus-vanilla-webpage/lockfile

اختبرها

جارٍ استخدام "vanilla-webpage". أنشئ صفحة رئيسية بدون بناء لاستوديو تصميم محلي.

النتيجة المتوقعة:

صفحة HTML واحدة بأقسام دلالية، وأنماط مضمّنة، وطباعة متجاوبة، وأزرار سهلة الوصول، وتسلسل بصري واضح.

جارٍ استخدام "vanilla-webpage". أنشئ واجهة ملاحظات صغيرة باستخدام تخزين المتصفح.

النتيجة المتوقعة:

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

جارٍ استخدام "vanilla-webpage". أنشئ صفحة توثيق مع تنقل وأمثلة.

النتيجة المتوقعة:

تخطيط توثيق قابل للقراءة مع شريط جانبي، وأقسام مقالات، وأمثلة تعليمات برمجية، وسلوك متجاوب، وأنماط تركيز سهلة الوصول.

التدقيق الأمني

آمن
v4 • ٨‏/٧‏/٢٠٢٦ فتح التقرير المرتبط بالإصدار

Most static alerts are false positives caused by Markdown backticks, CSS terminology, tutorial URLs, and browser syntax. I confirmed unsafe copyable DOM-rendering examples that place local user data into innerHTML without escaping. No evidence found for prompt injection, secret exfiltration, or actual shell command execution.

81
الملفات التي تم فحصها
6,611
الأسطر التي تم تحليلها
3
عناصر المراجعة
0
تم تجاهل الإيجابيات الكاذبة
عناصر مراجعة القدرات (3)

هذه قدرات محلية حقيقية قد يُتوقع وجودها لهذه المهارة، لذا فهي تتطلب مراجعة ولكن لا تُحتسب كسلوك خبيث مؤكد.

متوسط
cookbook/interactivity/todo-app/index.html:60
innerHTML assignment (XSS risk)
list.innerHTML = todos.map((t, i) => `
The todo demo renders locally entered todo text from localStorage into innerHTML without escaping. If copied for untrusted input, this is a stored DOM XSS pattern.
متوسط
docs/tutorials/04-full-project.md:96
innerHTML assignment (XSS risk)
document.getElementById('notes-grid').innerHTML = notes.map(n => `
The notes tutorial maps saved user note text into innerHTML without escaping. The example is documentation, but it teaches a copyable stored DOM XSS pattern.
متوسط
SKILL.md:1204
innerHTML assignment (XSS risk)
container.innerHTML = items.map(renderItem).join('');
The skill shows template-literal rendering into innerHTML using item fields. The snippet lacks an explicit trusted-data boundary, so it can encourage unsafe DOM rendering.

عوامل الخطر

⚡ يحتوي على سكربتات (8)
cookbook/forms/login-signup/index.html:71 cookbook/forms/login-signup/index.html:75 cookbook/interactivity/todo-app/index.html:60 docs/tutorials/04-full-project.md:96 SKILL.md:1517 SKILL.md:1204 SKILL.md:1228 SKILL.md:1232
⚙️ الأوامر الخارجية (300)
cookbook/interactivity/toast-notifications/index.html:63 cookbook/interactivity/todo-app/index.html:60-66 docs/tutorials/04-full-project.md:104-144 SKILL.md:41 SKILL.md:42 SKILL.md:43 SKILL.md:44 SKILL.md:48-51 SKILL.md:51-57 SKILL.md:57-60 SKILL.md:60-67 SKILL.md:67-70 SKILL.md:70-88 SKILL.md:88 SKILL.md:97-103 SKILL.md:103-109 SKILL.md:109 SKILL.md:110 SKILL.md:112 SKILL.md:113 SKILL.md:114-118 SKILL.md:118-132 SKILL.md:132-140 SKILL.md:140-147 SKILL.md:147-153 SKILL.md:153 SKILL.md:154-155 SKILL.md:155-159 SKILL.md:159-171 SKILL.md:171-175 SKILL.md:175-180 SKILL.md:180-184 SKILL.md:184-192 SKILL.md:192-194 SKILL.md:194 SKILL.md:198-212 SKILL.md:212-214 SKILL.md:214-218 SKILL.md:218-231 SKILL.md:231-233 SKILL.md:233-241 SKILL.md:241-245 SKILL.md:245-248 SKILL.md:248-252 SKILL.md:252-263 SKILL.md:263-265 SKILL.md:265 SKILL.md:266 SKILL.md:267 SKILL.md:272-275 SKILL.md:275-276 SKILL.md:276-278 SKILL.md:278-286 SKILL.md:286-303 SKILL.md:303-307 SKILL.md:307-318 SKILL.md:318-322 SKILL.md:322-333 SKILL.md:333-337 SKILL.md:337-347 SKILL.md:347-351 SKILL.md:351-369 SKILL.md:369-373 SKILL.md:373-382 SKILL.md:382-386 SKILL.md:386-398 SKILL.md:398-404 SKILL.md:404-407 SKILL.md:407-411 SKILL.md:411-415 SKILL.md:415-419 SKILL.md:419-425 SKILL.md:425-429 SKILL.md:429-432 SKILL.md:432-436 SKILL.md:436-439 SKILL.md:439-443 SKILL.md:443-452 SKILL.md:452-456 SKILL.md:456-465 SKILL.md:465-469 SKILL.md:469-476 SKILL.md:476-480 SKILL.md:480-494 SKILL.md:494-498 SKILL.md:498-513 SKILL.md:513-519 SKILL.md:519-524 SKILL.md:524-528 SKILL.md:528-535 SKILL.md:535-539 SKILL.md:539-548 SKILL.md:548-552 SKILL.md:552-566 SKILL.md:566-570 SKILL.md:570-585 SKILL.md:585-589 SKILL.md:589-624 SKILL.md:624-630 SKILL.md:630-641 SKILL.md:641-645 SKILL.md:645-669 SKILL.md:669-673 SKILL.md:673-693 SKILL.md:693-697 SKILL.md:697-701 SKILL.md:701-705 SKILL.md:705-710 SKILL.md:710-714 SKILL.md:714-720 SKILL.md:720-724 SKILL.md:724-752 SKILL.md:752-756 SKILL.md:756-767 SKILL.md:767-771 SKILL.md:771-777 SKILL.md:777-781 SKILL.md:781-789 SKILL.md:789-793 SKILL.md:793-802 SKILL.md:802-806 SKILL.md:806-820 SKILL.md:820-822 SKILL.md:822 SKILL.md:826-831 SKILL.md:831-835 SKILL.md:835-842 SKILL.md:842-846 SKILL.md:846-862 SKILL.md:862-864 SKILL.md:864-865 SKILL.md:865 SKILL.md:866-872 SKILL.md:872-889 SKILL.md:889-893 SKILL.md:893-898 SKILL.md:898-911 SKILL.md:911-913 SKILL.md:913-918 SKILL.md:918-921 SKILL.md:921-928 SKILL.md:928-943 SKILL.md:943-945 SKILL.md:945-946 SKILL.md:946-951 SKILL.md:951-963 SKILL.md:963-966 SKILL.md:966 SKILL.md:972-993 SKILL.md:993-1002 SKILL.md:1002-1016 SKILL.md:1016-1018 SKILL.md:1018-1028 SKILL.md:1028-1036 SKILL.md:1036-1059 SKILL.md:1059-1061 SKILL.md:1061-1062 SKILL.md:1062-1067 SKILL.md:1067-1072 SKILL.md:1072-1076 SKILL.md:1076-1082 SKILL.md:1082-1085 SKILL.md:1085-1090 SKILL.md:1090-1097 SKILL.md:1097-1099 SKILL.md:1099-1104 SKILL.md:1104-1108 SKILL.md:1108 SKILL.md:1116-1128 SKILL.md:1128-1132 SKILL.md:1132-1142 SKILL.md:1142-1146 SKILL.md:1146-1157 SKILL.md:1157-1161 SKILL.md:1161-1177 SKILL.md:1177-1181 SKILL.md:1181-1190 SKILL.md:1190-1194 SKILL.md:1194-1195 SKILL.md:1202-1205 SKILL.md:1205-1209 SKILL.md:1209-1211 SKILL.md:1211-1212 SKILL.md:1212-1215 SKILL.md:1215-1219 SKILL.md:1219-1237 SKILL.md:1237-1241 SKILL.md:1241-1246 SKILL.md:1246-1256 SKILL.md:1256-1260 SKILL.md:1260-1276 SKILL.md:1276-1280 SKILL.md:1280-1292 SKILL.md:1292-1296 SKILL.md:1296-1307 SKILL.md:1307-1311 SKILL.md:1311-1319 SKILL.md:1319-1323 SKILL.md:1323-1330 SKILL.md:1330-1334 SKILL.md:1334-1358 SKILL.md:1358-1362 SKILL.md:1362-1372 SKILL.md:1372-1375 SKILL.md:1375-1379 SKILL.md:1379-1388 SKILL.md:1388-1392 SKILL.md:1392-1398 SKILL.md:1398-1405 SKILL.md:1405-1466 SKILL.md:1466-1481 SKILL.md:1481-1488 SKILL.md:1488 SKILL.md:1489-1490 SKILL.md:1490-1494 SKILL.md:1494-1497 SKILL.md:1497-1505 SKILL.md:1505 SKILL.md:1513 SKILL.md:1515 SKILL.md:1516 SKILL.md:1517-1518 SKILL.md:1518 SKILL.md:1519 SKILL.md:1520 SKILL.md:1521-1542 SKILL.md:1542-1543 SKILL.md:1543-1545 SKILL.md:1545 SKILL.md:1547-1550 SKILL.md:1550-1558 SKILL.md:1558-1566 SKILL.md:1566-1573 SKILL.md:1573-1577 SKILL.md:1577-1602 SKILL.md:1602-1609 SKILL.md:1609-1614 SKILL.md:1614-1621 SKILL.md:1621-1629 SKILL.md:1629-1633 SKILL.md:1633-1638 SKILL.md:1638-1644 SKILL.md:1644-1649 SKILL.md:1649-1656 SKILL.md:1656-1659 SKILL.md:1659-1661 SKILL.md:1661-1673 SKILL.md:1673-1677 SKILL.md:1677-1681 SKILL.md:1681-1685 SKILL.md:1685-1699 SKILL.md:1699-1703 SKILL.md:1703-1709 SKILL.md:1709-1713 SKILL.md:1713-1721 SKILL.md:1721-1725 SKILL.md:1725-1734 SKILL.md:1734-1740 SKILL.md:1740-1743 SKILL.md:1743-1744 SKILL.md:1744-1745 SKILL.md:1745-1746 SKILL.md:1746-1747 SKILL.md:1747-1748 SKILL.md:1748-1751 SKILL.md:1751-1752 SKILL.md:1752-1753 SKILL.md:1753-1754 SKILL.md:1754-1755 SKILL.md:1755-1758 SKILL.md:1758-1759 SKILL.md:1759-1760 SKILL.md:1760-1761 SKILL.md:1761-1762 SKILL.md:1762-1765 SKILL.md:1765-1766 SKILL.md:1766-1767 SKILL.md:1767-1768 SKILL.md:1768-1771 SKILL.md:1771-1772 SKILL.md:1772-1773 SKILL.md:1773-1774 SKILL.md:1774-1775 SKILL.md:1775-1776 SKILL.md:1776-1777 SKILL.md:1777-1778 SKILL.md:1778-1779 SKILL.md:1779-1782 SKILL.md:1782-1783 SKILL.md:1783-1784 SKILL.md:1784 SKILL.md:1785 SKILL.md:1786-1787 SKILL.md:1787-1788 SKILL.md:1788-1789 SKILL.md:1789-1790 SKILL.md:1790-1793 SKILL.md:1793-1794 SKILL.md:1794-1795 SKILL.md:1795-1796
🌐 الوصول إلى الشبكة (12)
docs/guides/framework-usage.md:14 docs/guides/framework-usage.md:50 docs/guides/getting-started.md:67 docs/guides/getting-started.md:82 docs/tutorials/01-first-page.md:109 SKILL.md:1245 SKILL.md:1272 SKILL.md:1273 SKILL.md:1299 SKILL.md:59 SKILL.md:1255 templates/with-framework.html:7
📁 الوصول إلى نظام الملفات (1)
templates/starter.html:8
دقّقه: codex عرض سجل التدقيق →
شارك واستشهد بهذا التقرير

شارك تقرير التقييم المرتبط بالإصدار والشارة المحايدة وبطاقة التضمين والاستشهادات. تعرض Skillstore الأدلة من دون أن تقرر ما إذا كانت هذه المهارة آمنة.

فتح التقرير المرتبط بالإصدار
تقييم الأمان

نسخ رابط التقرير

https://skillstore.io/skills/yuzu-octopus-vanilla-webpage/audits/4?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_report

شارة Markdown

[![Skillstore security assessment](https://skillstore.io/badges/skills/yuzu-octopus-vanilla-webpage/security.svg)](https://skillstore.io/skills/yuzu-octopus-vanilla-webpage?utm_source=security_passport_badge)

شارة HTML

<a href="https://skillstore.io/skills/yuzu-octopus-vanilla-webpage?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/yuzu-octopus-vanilla-webpage/security.svg" alt="Skillstore security assessment" loading="lazy"></a>

بطاقة قابلة للتضمين

<iframe src="https://skillstore.io/embed/skills/yuzu-octopus-vanilla-webpage.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>
الاستشهادات الأكاديمية (APA · BibTeX · CFF)

اقتباس APA

yuzu-octopus. (2026). vanilla-webpage security audit report (audit version 4) [Author version unspecified]. Skillstore. https://skillstore.io/skills/yuzu-octopus-vanilla-webpage/audits/4

اقتباس BibTeX

@techreport{yuzu-octopus-yuzu-octopus-vanilla-webpage-2026, author = {yuzu-octopus}, title = {vanilla-webpage security audit report (audit version 4)}, institution = {Skillstore}, year = {2026}, number = {4}, url = {https://skillstore.io/skills/yuzu-octopus-vanilla-webpage/audits/4}, note = {Author version unspecified} }

CITATION.cff

cff-version: 1.2.0 message: "If you use this Skill, cite its author and this versioned security audit report." title: "vanilla-webpage security audit report (audit version 4)" version: "unspecified" type: report authors: - name: "yuzu-octopus" date-released: "2026-07-08" url: "https://skillstore.io/skills/yuzu-octopus-vanilla-webpage/audits/4" identifiers: - type: other value: "skillstore:yuzu-octopus-vanilla-webpage:audit:4" description: "Skillstore immutable audit report identifier"

تقييم Skillstore

سبب هذا التقييم موثوقية الأدلة: متوسط
55
الهندسة المعمارية
85
قابلية الصيانة
87
المحتوى
67
المجتمع
70
الامتثال للمواصفات

ما الذي يمكنك بناؤه

إنشاء نموذج أولي لصفحة منتج

أنشئ صفحة تسويقية أو صفحة منتج متجاوبة بأقسام دلالية وCSS مصقول وبدون أدوات بناء.

إنشاء صفحة توثيق

أنشئ تخطيطات توثيق قابلة للقراءة تتضمن التنقل، والطباعة، وكتل التعليمات البرمجية، وبنية سهلة الوصول.

إنشاء أداة متصفح صغيرة

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

جرّب هذه الموجّهات

صفحة هبوط للمبتدئين 
أنشئ صفحة ويب ثابتة في ملف واحد لشركة صغيرة. استخدم HTML دلالية، وCSS متجاوبة، وألوانا سهلة الوصول، وبدون خطوة بناء.
تخطيط متجاوب 
أنشئ تخطيط صفحة ويب متجاوبا مع رأس ثابت، وأقسام ميزات، وبطاقات، وتذييل. استخدم vanilla CSS واشرح أي قرارات تخطيط بإيجاز.
نموذج تفاعلي 
أنشئ نموذج تواصل سهل الوصول مع حالات تحقق، وعناصر تحكم ملائمة للوحة المفاتيح، وتحديثات DOM آمنة باستخدام vanilla JavaScript.
صفحة مصقولة متعددة الأقسام 
استخدم مهارة vanilla webpage لإنشاء صفحة لوحة معلومات مصقولة متعددة الأقسام. أعد استخدام أنماط الدليل العملي عند الاقتضاء وتحقق من السلوك المتجاوب.

أفضل الممارسات

  • ابدأ باستخدام HTML دلالية وأضف CSS أو JavaScript فقط عندما يتطلب سلوك الصفحة ذلك.
  • استخدم الرموز والأنماط العملية المتوفرة قبل ابتكار مسافات أو ألوان أو أنماط مكونات جديدة.
  • اعرض النصوص المقدمة من المستخدم باستخدام textContent أو مخرجات منقحة بدلا من innerHTML الخام.

تجنب

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

الأسئلة المتكررة

هل تتطلب هذه المهارة Node أو npm؟
لا. صممت المهارة من أجل HTML وCSS وJavaScript ثابتة تقدم مباشرة عبر خادم محلي بسيط.
هل يمكنها استخدام أطر عمل CSS؟
نعم، ولكن فقط أطر العمل الصغيرة المسموح بها عندما يوضح إطار اتخاذ القرار أنها مفيدة للصفحة.
هل هي مناسبة لتطبيقات الويب المعقدة؟
لا. إنها أفضل للصفحات الثابتة، والنماذج الأولية، وصفحات التوثيق، وأدوات المتصفح الصغيرة.
هل تتضمن إرشادات لسهولة الوصول؟
نعم. تغطي الترميز الدلالي، والتسميات، وتركيز لوحة المفاتيح، والتباين، وتقليل الحركة، والسلوك المتجاوب.
هل يمكن لـ Claude Code أو Codex استخدامها؟
نعم. تعلن المهارة دعمها لسير عمل Claude وCodex وClaude Code.
هل الأمثلة جاهزة للإنتاج؟
إنها نقاط بداية مفيدة. يجب مراجعة أمثلة JavaScript التي تعرض إدخال المستخدم وتقويتها قبل استخدامها في الإنتاج.

تفاصيل المطور

المؤلف

yuzu-octopus

الترخيص

MIT

مراجعة Skillstore

r1

تنبيه الإصدار

لم يعلن المؤلف عن إصدار.

المستودع

https://github.com/yuzu-octopus/simple-webpage/tree/main/skills/simple-webpage

مرجع

64ca8af0f54a325752f08bd54e52151061ea659a

حداثة الصيانة

٢١‏/٧‏/٢٠٢٦

الاستخدام

4 تنزيلات · 1 مشاهدات

بنية الملفات

📁 cookbook/

📁 cards/

📁 article-card/

📄 index.html

📁 pricing-card/

📄 index.html

📁 product-card/

📄 index.html

📁 profile-card/

📄 index.html

📁 effects/

📁 animated-tooltips/

📄 index.html

📁 border-animations/

📄 index.html

📁 glassmorphism/

📄 index.html

📁 gradient-text/

📄 index.html

📁 hover-effects/

📄 index.html

📁 neumorphism/

📄 index.html

📁 scroll-driven-animations/

📄 index.html

📁 scroll-snap/

📄 index.html

📁 triangles/

📄 index.html

📁 forms/

📁 contact-form/

📄 index.html

📁 form-validation/

📄 index.html

📁 login-signup/

📄 index.html

📁 multi-step/

📄 index.html

📁 search-bar/

📄 index.html

📁 interactivity/

📁 accordion/

📄 index.html

📁 carousel/

📄 index.html

📁 css-only-dropdown/

📄 index.html

📁 dark-mode/

📄 index.html

📁 modal-dialog/

📄 index.html

📁 popover-api/

📄 index.html

📁 tabs/

📄 index.html

📁 toast-notifications/

📄 index.html

📁 todo-app/

📄 index.html

📁 layouts/

📁 dashboard/

📄 index.html

📄 README.md

📁 hero-section/

📄 index.html

📁 holy-grail/

📄 index.html

📁 masonry/

📄 index.html

📁 responsive-grid/

📄 index.html

📄 README.md

📁 sidebar-layout/

📄 index.html

📁 navigation/

📁 breadcrumbs/

📄 index.html

📁 mobile-hamburger/

📄 index.html

📁 navbar/

📄 index.html

📁 sidebar-menu/

📄 index.html

📁 sticky-header/

📄 index.html

📁 typography/

📁 decorative-headings/

📄 index.html

📁 fluid-type/

📄 index.html

📁 text-balance/

📄 index.html

📁 vertical-rhythm/

📄 index.html

📄 README.md

📁 docs/

📁 guides/

📄 accessibility.md

📄 animations.md

📄 colors-deep-dive.md

📄 dark-mode.md

📄 file-structure.md

📄 framework-usage.md

📄 getting-started.md

📄 modern-css.md

📄 responsive.md

📁 principles/

📄 decision-framework.md

📄 design-philosophy.md

📄 why-no-frameworks.md

📁 specs/

📄 buttons.md

📄 cards.md

📄 colors.md

📄 effects.md

📄 forms.md

📄 interactivity.md

📄 layout-system.md

📄 modals.md

📄 navigation.md

📄 spacing.md

📄 typography.md

📁 tutorials/

📄 01-first-page.md

📄 02-layout-masterclass.md

📄 03-interactivity.md

📄 04-full-project.md

📁 templates/

📄 blank.html

📄 starter.html

📄 with-framework.html

📁 tokens/

📄 base.css

📄 components.css

📄 index.css

📄 semantic.css

📄 typography.css

📄 SKILL.md