web-development

دليل شامل لتحسين أداء React و Next.js يحتوي على أكثر من 40 قاعدة لإزالة الشلالات، تحسين الحزم، وتحسين العرض. يُستخدم عند تحسين تطبيقات React، مراجعة الأداء، أو إعادة هيكلة المكونات.

تحسين أداء الموقع الإلكتروني وتطبيقات الويب بما في ذلك سرعة التحميل، مؤشرات الويب الأساسية (Core Web Vitals)، حجم الحزمة، استراتيجيات التخزين المؤقت، وأداء وقت التشغيل

مدقق ومصلح تحسين محركات البحث التقنية. يقوم بتشغيل تدقيقات Lighthouse/PageSpeed على المواقع الإلكترونية أو خوادم التطوير المحلية، ويحلل درجات تحسين محركات البحث/الأداء/سهولة الوصول، وينفذ تلقائيًا الإصلاحات لعلامات الميتا، والبيانات المنظمة، ومؤشرات Core Web Vitals، وقضايا سهولة الوصول.

خطط وابنِ نقاط نهاية FastAPI جاهزة للإنتاج باستخدام async SQLAlchemy، ونماذج Pydantic v2، وحقن التبعيات للمصادقة، واختبارات pytest. يستخدم التخطيط المستند إلى المقابلات لتوضيح نماذج البيانات، وطريقة المصادقة، واستراتيجية الترقيم، والتخزين المؤقت قبل كتابة أي كود.

التنقيب في الويب العميق، لقطات الشاشة، تحليل ملفات PDF، وزحف المواقع باستخدام Firecrawl API

|

أنماط الخبراء لتطوير تطبيقات Shopify بما في ذلك تطبيقات Remix/React Router، التطبيقات المدمجة مع App Bridge، معالجة الويب هوك، واجهة برمجة تطبيقات GraphQL الإدارية، مكونات Polaris، الفوترة، وامتدادات التطبيقات. استخدم عند: تطبيق shopify، shopify، التطبيق المدمج، polaris، app bridge.

البحث على الويب، استخراج المحتوى، الزحف، وقدرات البحث باستخدام واجهة برمجة التطبيقات Tavily

يدير مكونات ومشاريع shadcn/ui، موفراً السياق، الوثائق، وأنماط الاستخدام لبناء أنظمة تصميم حديثة.

بناء أنظمة تصميم جاهزة للإنتاج باستخدام Tailwind CSS، بما في ذلك رموز التصميم، متغيرات المكونات، الأنماط المتجاوبة، وإمكانية الوصول.

أنماط شاملة لهندسة App Router في Next.js 14+، ومكونات الخادم، وتطوير React الكامل العصري.

بناء تطبيقات الويب التقدمية (PWAs) مع دعم العمل دون اتصال، وقابلية التثبيت، واستراتيجيات التخزين المؤقت. يتم التفعيل كلما ذكر المستخدم PWA، أو عمال الخدمة (service workers)، أو ملفات تعريف تطبيق الويب (web app manifests)، أو Workbox، أو 'الإضافة إلى الشاشة الرئيسية'، أو رغب في أن يعمل تطبيق الويب الخاص به دون اتصال، أو يشعر بأنه أصلي، أو يكون قابلاً للتثبيت.

البحث الدلالي، اكتشاف المحتوى المماثل، والبحث المنظم باستخدام Exa API

استخدم عندما يحتاج المستخدم إلى قدرات يفتقر إليها كلود (توليد الصور، بيانات X/Twitter في الوقت الحقيقي) أو يطلب صراحة نماذج خارجية ("blockrun"، "use grok"، "use gpt"، "dall-e"، "deepseek")

تشخيص مكونات React البطيئة واقتراح إصلاحات أداء مستهدفة.

أنماط جاهزة للإنتاج لتطوير React Native باستخدام Expo، بما في ذلك التنقل، إدارة الحالة، الوحدات الأصلية، وهندسة العمل دون اتصال أولاً.

اتقن إدارة الحالة الحديثة في React باستخدام Redux Toolkit وZustand وJotai وReact Query. استخدمها عند إعداد الحالة العالمية، إدارة حالة الخادم، أو الاختيار بين حلول إدارة الحالة.

أنماط الخبراء لمنصة بيانات العملاء Segment بما في ذلك Analytics.js، التتبع على جانب الخادم، خطط التتبع مع البروتوكولات، حل الهوية، تكوين الوجهات، وأفضل ممارسات حوكمة البيانات. يُستخدم عند: segment، analytics.js، منصة بيانات العملاء، cdp، خطة التتبع.

خبير Upstash QStash لطوابير الرسائل بدون خادم، والمهام المجدولة، وتسليم المهام الموثوق به عبر HTTP دون إدارة البنية التحتية. يُستخدم عند: qstash، طابور upstash، كرون بدون خادم، http المجدول، طابور الرسائل بدون خادم.

بناء مواقع إلكترونية تركز على المحتوى باستخدام Astro — بدون جافا سكريبت بشكل افتراضي، معمارية الجزر، مكونات متعددة الأُطُر، ودعم Markdown/MDX.

خبير في Zod — التحقق من صحة المخططات مع التركيز على TypeScript. يشمل التحليل، الأخطاء المخصصة، التحسينات، استنتاج النوع، والتكامل مع React Hook Form و Next.js و tRPC.

خبير في بناء إضافات كروم باستخدام Manifest V3. يغطي سكريبتات الخلفية، عمال الخدمة، سكريبتات المحتوى، والتواصل عبر السياقات.

خبير في TanStack Query (React Query) — إدارة الحالة غير المتزامنة. يشمل جلب البيانات، تكوين وقت التقادم، التعديلات، التحديثات التفاؤلية، وتكامل Next.js App Router (SSR).

اتقن تطوير تطبيقات سطح المكتب باستخدام Electron مع IPC الآمن، contextIsolation، سكربتات preload، بنية متعددة العمليات، تغليف electron-builder، توقيع الشيفرة، والتحديث التلقائي.

نشر تطبيقات Expo إلى الإنتاج

بناء تطبيقات الويب الشاملة باستخدام SvelteKit — التوجيه المعتمد على الملفات، SSR، SSG، مسارات API، وإجراءات النماذج في إطار عمل واحد.

إنشاء مخازن Zustand باتباع الأنماط المعتمدة مع أنواع TypeScript المناسبة والوسائط الوسيطة.

ابنِ واجهات برمجة تطبيقات ويب فائقة السرعة وتطبيقات متكاملة باستخدام Hono — يعمل على Cloudflare Workers وDeno وBun وNode.js وأي بيئة تشغيل متوافقة مع WinterCG.

خبير في Drizzle ORM لـ TypeScript — تصميم المخططات، الاستعلامات العلائقية، الترحيلات، وتكامل قواعد البيانات بدون خادم. يُستخدم عند بناء طبقات قواعد بيانات آمنة من حيث النوع باستخدام Drizzle.