·artifacts-builder
</>

artifacts-builder

مجموعة من الأدوات لإنشاء عناصر HTML معقدة ومتعددة المكونات claude.ai باستخدام تقنيات الويب الأمامية الحديثة (React، Tailwind CSS، @agenticindiedev/ui). يُستخدم مع العناصر المعقدة التي تتطلب إدارة الحالة أو مكونات واجهة المستخدم المشتركة - وليس مع عناصر HTML/JSX البسيطة ذات الملف الواحد.

48التثبيتات·1الرائج·@shipshitdev

التثبيت

$npx skills add https://github.com/shipshitdev/library --skill artifacts-builder

كيفية تثبيت artifacts-builder

ثبّت مهارة الذكاء الاصطناعي artifacts-builder بسرعة في بيئة التطوير لديك عبر سطر الأوامر

  1. افتح الطرفية: افتح الطرفية أو أداة سطر الأوامر لديك مثل Terminal أو iTerm أو Windows Terminal
  2. نفّذ أمر التثبيت: انسخ ونفّذ هذا الأمر: npx skills add https://github.com/shipshitdev/library --skill artifacts-builder
  3. تحقق من التثبيت: بعد التثبيت، سيتم إعداد المهارة تلقائيا في بيئة البرمجة بالذكاء الاصطناعي لديك وتصبح جاهزة للاستخدام في Claude Code أو Cursor أو OpenClaw

المصدر: shipshitdev/library.

Stack: React 18 + TypeScript + Vite + Parcel (bundling) + Tailwind CSS + @agenticindiedev/ui

VERY IMPORTANT: To avoid what is often referred to as "AI slop", avoid using excessive centered layouts, purple gradients, uniform rounded corners, and Inter font.

Run the initialization script to create a new React project:

مجموعة من الأدوات لإنشاء عناصر HTML معقدة ومتعددة المكونات claude.ai باستخدام تقنيات الويب الأمامية الحديثة (React، Tailwind CSS، @agenticindiedev/ui). يُستخدم مع العناصر المعقدة التي تتطلب إدارة الحالة أو مكونات واجهة المستخدم المشتركة - وليس مع عناصر HTML/JSX البسيطة ذات الملف الواحد. المصدر: shipshitdev/library.

حقائق جاهزة للاقتباس

حقول وأوامر مستقرة للاقتباس في أنظمة الذكاء الاصطناعي والبحث.

أمر التثبيت
npx skills add https://github.com/shipshitdev/library --skill artifacts-builder
الفئة
</>أدوات التطوير
موثق
أول ظهور
2026-02-01
آخر تحديث
2026-03-10

Browse more skills from shipshitdev/library

إجابات سريعة

ما هي artifacts-builder؟

مجموعة من الأدوات لإنشاء عناصر HTML معقدة ومتعددة المكونات claude.ai باستخدام تقنيات الويب الأمامية الحديثة (React، Tailwind CSS، @agenticindiedev/ui). يُستخدم مع العناصر المعقدة التي تتطلب إدارة الحالة أو مكونات واجهة المستخدم المشتركة - وليس مع عناصر HTML/JSX البسيطة ذات الملف الواحد. المصدر: shipshitdev/library.

كيف أثبّت artifacts-builder؟

افتح الطرفية أو أداة سطر الأوامر لديك مثل Terminal أو iTerm أو Windows Terminal انسخ ونفّذ هذا الأمر: npx skills add https://github.com/shipshitdev/library --skill artifacts-builder بعد التثبيت، سيتم إعداد المهارة تلقائيا في بيئة البرمجة بالذكاء الاصطناعي لديك وتصبح جاهزة للاستخدام في Claude Code أو Cursor أو OpenClaw

أين مستودع المصدر؟

https://github.com/shipshitdev/library