/ الدليل / الملعب / claude-skills
← كل الخوادم ↗ GitHub
● مجتمع secondsky ⚡ فوري

claude-skills

بواسطة secondsky · secondsky/claude-skills

مهارات Claude Code جاهزة للإنتاج لـ Cloudflare و React و Tailwind v4 والتكاملات الذكية — حزمة full-stack حديثة.

مجموعة مركزة من المهارات لمكدس Cloudflare + React + Tailwind v4 + AI. تركيزها على ما يُطلق فعلاً في 2026: Workers و D1 و R2 و Pages على Cloudflare؛ React 19 + Tailwind v4 على الواجهة الأمامية؛ أنماط تكامل ذكية محايدة تجاه موفري الخدمات.

▶ شاهد العرض 📦 التثبيت 💡 حالات الاستخدام

لماذا تستخدمه

الميزات الأساسية

عرض مباشر

كيف يبدو في الممارسة

claude-skill-5.replay ▶ جاهز
0/0

التثبيت

اختر العميل

~/Library/Application Support/Claude/claude_desktop_config.json  · Windows: %APPDATA%\Claude\claude_desktop_config.json
{
  "mcpServers": {
    "claude-skill-5": {
      "command": "git",
      "args": [
        "clone",
        "https://github.com/secondsky/claude-skills",
        "~/.claude/skills/claude-skills"
      ],
      "_inferred": true
    }
  }
}

افتح Claude Desktop → Settings → Developer → Edit Config. أعد التشغيل بعد الحفظ.

~/.cursor/mcp.json · .cursor/mcp.json
{
  "mcpServers": {
    "claude-skill-5": {
      "command": "git",
      "args": [
        "clone",
        "https://github.com/secondsky/claude-skills",
        "~/.claude/skills/claude-skills"
      ],
      "_inferred": true
    }
  }
}

يستخدم Cursor نفس مخطط mcpServers مثل Claude Desktop. إعدادات المشروع أولى من الإعدادات العامة.

VS Code → Cline → MCP Servers → Edit
{
  "mcpServers": {
    "claude-skill-5": {
      "command": "git",
      "args": [
        "clone",
        "https://github.com/secondsky/claude-skills",
        "~/.claude/skills/claude-skills"
      ],
      "_inferred": true
    }
  }
}

انقر على أيقونة MCP Servers في شريط Cline الجانبي، ثم "Edit Configuration".

~/.codeium/windsurf/mcp_config.json
{
  "mcpServers": {
    "claude-skill-5": {
      "command": "git",
      "args": [
        "clone",
        "https://github.com/secondsky/claude-skills",
        "~/.claude/skills/claude-skills"
      ],
      "_inferred": true
    }
  }
}

نفس الصيغة مثل Claude Desktop. أعد تشغيل Windsurf لتطبيق التغييرات.

~/.continue/config.json
{
  "mcpServers": [
    {
      "name": "claude-skill-5",
      "command": "git",
      "args": [
        "clone",
        "https://github.com/secondsky/claude-skills",
        "~/.claude/skills/claude-skills"
      ]
    }
  ]
}

يستخدم Continue مصفوفة من كائنات الخادم بدلاً من خريطة.

~/.config/zed/settings.json
{
  "context_servers": {
    "claude-skill-5": {
      "command": {
        "path": "git",
        "args": [
          "clone",
          "https://github.com/secondsky/claude-skills",
          "~/.claude/skills/claude-skills"
        ]
      }
    }
  }
}

أضف إلى context_servers. يعيد Zed التحميل تلقائيًا عند الحفظ.

claude mcp add claude-skill-5 -- git clone https://github.com/secondsky/claude-skills ~/.claude/skills/claude-skills

أمر من سطر واحد. تحقق باستخدام claude mcp list. احذف باستخدام claude mcp remove.

حالات الاستخدام

استخدامات عملية: claude-skills

نشر تطبيق React جديد مستضاف على Cloudflare في جلسة واحدة

👤 المطورون الذين يبنون على مكدس CF ⏱ ~60 min intermediate

متى تستخدمه: تريد Workers + Pages + D1 متصلة دون قراءة 5 وثائق Cloudflare.

المتطلبات الأساسية
  • حساب Cloudflare + wrangler — npm i -g wrangler; wrangler login
  • تثبيت المهارة — git clone https://github.com/secondsky/claude-skills ~/.claude/skills/claude-skills
الخطوات
  1. توليد الكود
    استخدم claude-skills. وليد كود لتطبيق React 19 + Tailwind v4 مُنشر على Cloudflare Pages مع Workers API و D1 قاعدة بيانات.✓ تم النسخ
    → Monorepo structure with apps/web, apps/api (Worker), wrangler.toml
  2. إضافة ميزة
    أضف ميزة 'notes' — مخطط D1، نقاط نهاية CRUD Worker، واجهة مستخدم React بأسلوب Tailwind v4.✓ تم النسخ
    → Migration + Worker + React page
  3. نشر
    نشر على Cloudflare.✓ تم النسخ
    → wrangler deploy output; URLs returned

النتيجة: عنوان URL مباشر خلال ساعة.

المزالق
  • انجراف إعدادات wrangler بين البيئات — استخدم بيئات wrangler من البداية — أقسام dev/staging/prod
اجمعها مع: cloudflare · cloudflare-api

ترحيل مشروع Tailwind v3 إلى v4

👤 الفرق على v3 التي تصل إلى إصدار v4 ⏱ ~45 min intermediate

متى تستخدمه: تريد المحرك الجديد + إعدادات CSS-first دون كسر كل شيء.

الخطوات
  1. تدقيق الحالة الحالية
    استخدم claude-skills. دقق tailwind.config.js الخاص بي عن تغييرات v4 الكاسرة.✓ تم النسخ
    → قائمة التغييرات مع الخطورة
  2. ترحيل الإعدادات
    حول إلى إعدادات v4 CSS-first مع توجيهات @theme.✓ تم النسخ
    → globals.css جديد مع كتلة @theme
  3. إصلاح الأدوات
    ابحث عن أدوات v3 التي تغيرت أو تم إزالتها؛ أعد كتابة الاستخدام.✓ تم النسخ
    → Grep + rewrite pass

النتيجة: مشروع على v4 دون انحدارات بصرية.

المزالق
  • نظام الإضافات ليس جاهزاً لـ v4 بعد — تحقق من حالة v4 لكل إضافة؛ ابق على v3 إذا تأخرت واحدة حرجة
اجمعها مع: filesystem

لف موفري ذكاء متعددين خلف محول واحد

👤 المطورون الذين يريدون التبديل بين Claude / GPT / النماذج المحلية دون إعادة كتابة ⏱ ~45 min advanced

متى تستخدمه: تثبيت موفر واحد يشعر بأنه خطأ وتريد واجهة نظيفة.

الخطوات
  1. تحديد الواجهة
    استخدم نمط claude-skills ai-adapter. عرّف واجهة TS تجرد إكمال الدردشة عبر Claude و OpenAI ونموذج محلي.✓ تم النسخ
    → الواجهة + 3 تطبيقات
  2. توصيل البث
    أضف دعم بث SSE للمحول.✓ تم النسخ
    → تطبيق البث متسق عبر موفري الخدمات

النتيجة: طبقة ذكية قابلة للتبديل.

المزالق
  • الإفراط في التجريد وفقدان الميزات الخاصة بموفر الخدمة — احتفظ بمخرج طوارئ خاص بموفر الخدمة بجانب الواجهة المشتركة

التركيبات

اجمعها مع خوادم MCP أخرى لتحقيق نتائج x10

claude-skill-5 + cloudflare

نشر وإدارة موارد CF التي ينشئها البناء

بعد البناء، استخدم cloudflare MCP للتحقق من DNS وتتبع سجلات Worker.✓ تم النسخ
claude-skill-5 + cloudflare-api

عمليات إعدادات CF بكميات كبيرة

قم بإعداد قواعد التخزين المؤقت و WAF لمشروع Pages المنشور.✓ تم النسخ

الأدوات

ما يوفره هذا الـ MCP

الأداةالمدخلاتمتى تستدعيهاالتكلفة
cf_scaffold app type, features تطبيق CF جديد 0
tailwind_migrate v3 config ترقية Tailwind 0
ai_adapter_scaffold providers list إعداد ذكاء متعدد الموفرين 0

التكلفة والحدود

تكلفة التشغيل

حصة API
لا توجد حصص في المهارة
الرموز لكل استدعاء
معتدل
التكلفة المالية
يتمتع Cloudflare بطبقة مجانية سخية؛ الميزات المدفوعة عند النمو
نصيحة
استخدم wrangler dev محلياً؛ احفظ نشر المحرك السحابي للبيئات المرحلية والإنتاجية.

الأمان

الصلاحيات والأسرار ونطاق الأثر

تخزين بيانات الاعتماد: يتعامل wrangler مع مصادقة CF؛ مفاتيح موفري الذكاء عبر env / CF secrets
نقل البيانات الخارجي: CF وموفري الذكاء التي تقوم بإعدادها

استكشاف الأخطاء

الأخطاء الشائعة وحلولها

D1 migration fails

ترحيلات wrangler D1 حساسة؛ قم بالتشغيل مع --local أولاً وفحص SQL

تحقق: wrangler d1 migrations list <db>
Tailwind v4 styles not applying

تحقق من أن توجيه @source يلتقط مسارات المحتوى الخاصة بك

Deploy succeeds but Worker returns 500

استخدم wrangler tail لرؤية الخطأ الفعلي

تحقق: wrangler tail <worker>

البدائل

claude-skills مقابل البدائل

البديلمتى تستخدمهاالمقايضة
مكدس Vercel / Next.jsتفضل نظام Next البيئينموذج نشر مختلف، التسعير
cc-frontend-skillتهتم بشكل أساسي بالهوية البصريةليست خاصة بمكدس معين

المزيد

الموارد

📖 اقرأ ملف README الرسمي على GitHub

🐙 تصفح القضايا المفتوحة

🔍 تصفح أكثر من 400 خادم MCP و Skills