انشاء موقع متكامل مع مدونة ونظام لتسجيل و تحليل عدد الزوار للموقع. بالاضافة الى أعمال الاستضافة و التحديث الدوري.
لغات وتقنيات البرمجة:-
- لغة البرمجة: TypeScript
- إطار الويب: Next.js (الإصدار 16)
- واجهة المستخدم: React (الإصدار 19)
- التنسيق: Tailwind CSS (الإصدار 4)
- مكونات الواجهة: Radix UI و shadcn/ui
- أدوات أخرى: Biome (للتحليل والتنسيق)، Recharts (للرسوم البيانية)، Resend (للإيميل)، ودمج n8n للدردشة
مميزات الموقع:-
1. الصفحة الرئيسية: قسم Hero مع رسوم جزيئات متحركة، عرض للشركاء، الخدمات، أدوات SaaS، ونموذج تواصل.
2. الخدمات: صفحات فرعية للخدمات: أتمتة الذكاء الاصطناعي، أدوات الأعمال، تطبيقات مخصصة، حلول الويب.
3. الحلول: صفحات مخصصة (مثل حلول العقارات).
4. المدونة: عرض المقالات من ملفات Markdown مع تغطية صور وتواريخ ووسوم.
5. الصفحات القانونية: سياسة الخصوصية، الشروط، وملفات تعريف الارتباط.
6. التواصل: نموذج استفسار (Intake Form) في الهيدر والصفحة الرئيسية وصفحات الخدمات.
7. الدردشة: واجهة دردشة مدمجة (Chat UI) في الصفحة الرئيسية.
8. التحليلات: تكامل Umami لتحليلات الزيارات.
9. تحسين محركات البحث (SEO): بيانات منظمة (JSON-LD)، وصف وروابط Open Graph وTwitter، وروابط canonical.
10. إمكانية الوصول: زر "تخطي إلى المحتوى" ودعم السمات (مثل aria-label) حيث يلزم.
11. الوضع الداكن: دعم الثيم الفاتح/الداكن مع حفظ تفضيل المستخدم.
بنية المشروع
- التوجيه (Routing): App Router في Next.js (app/).
- التخزين المؤقت: استخدام cacheLife و cacheTag لتحسين الأداء.
- المحتوى: مقالات المدونة عبر gray-matter و remark/rehype لمعالجة Markdown.