تفاصيل العمل

# موقع العمودي للمفروشات

## نبذة عن المشروع

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

## ميزات الموقع

### الصفحة الرئيسية

- قسم البطل (Hero Section) مع صور عالية الجودة

- عرض أقسام المنتجات الرئيسية

- أيقونات خدمات تفاعلية

- معرض فيديو للمطابخ

### ️ المنتجات المتوفرة

- **موكيت مساجد**: موكيت عالي الجودة بتصميمات إسلامية

- **أرضيات مكتبية**: حلول أنيقة للبيئة المهنية

- **باركيه ضد الماء**: أرضيات مقاومة للرطوبة

- **العشب الصناعي**: للحدائق والمساحات الخارجية

- **أرضيات فينيل رول**: خيارات متنوعة ومتينة

- **أرضيات باركيه**: للمسة كلاسيكية

- **موكيت عام**: تشكيلة واسعة للمنازل

### ️ الخدمات المتخصصة

- **المطابخ**: تصميم وتنفيذ مطابخ عصرية

- **الستائر**: تشكيلة متنوعة من الستائر

- **تنسيق الحدائق**: خدمات تنسيق المساحات الخارجية

- **السجاد التقليدي**: مجموعة فاخرة من السجاد

### وسائل التواصل

- **رقم الجوال**: +966567746257

- **واتساب**: تواصل مباشر وسريع

- **العنوان**: حي العزيزية، شارع عبدالله بن صالح، الرياض

### ⏰ ساعات العمل

- الأحد - الخميس: 9:00 ص - 10:00 م

- الجمعة: 2:00 م - 10:00 م

- السبت: 9:00 ص - 10:00 م

## التقنيات المستخدمة

### Frontend Framework

- **Next.js 15.3.4**: إطار عمل React للتطوير المتقدم

- **React 19**: مكتبة JavaScript لبناء واجهات المستخدم

- **TypeScript**: للأمان في الكود وتطوير أفضل

### التصميم والأسلوب

- **Tailwind CSS 4**: إطار عمل CSS للتصميم السريع

- **Cairo Font**: خط عربي أنيق من Google Fonts

- **Responsive Design**: تصميم متجاوب لجميع الأجهزة

### المكونات والأيقونات

- **Lucide React**: مكتبة أيقونات عصرية

- **React Icons**: مجموعة شاملة من الأيقونات

- **Class Variance Authority**: إدارة أساليب CSS

- **clsx**: دمج الفئات بطريقة ديناميكية

### إدارة الجودة

- **ESLint**: فحص جودة الكود

- **PostCSS**: معالج CSS متقدم

## هيكل المشروع

```

src/

├── app/ # صفحات التطبيق (App Router)

│ ├── about/ # صفحة من نحن

│ ├── carpets/ # صفحة السجاد

│ ├── contact/ # صفحة التواصل

│ ├── curtains/ # صفحة الستائر

│ ├── garden/ # صفحة تنسيق الحدائق

│ ├── kitchens/ # صفحة المطابخ

│ ├── products/ # صفحات المنتجات

│ └── layout.tsx # التخطيط الرئيسي

├── components/ # المكونات القابلة لإعادة الاستخدام

│ ├── hero/ # مكونات قسم البطل

│ ├── navbar/ # مكونات شريط التنقل

│ └── ui/ # مكونات واجهة المستخدم

├── constants/ # الثوابت والإعدادات

├── data/ # بيانات المنتجات والأقسام

├── styles/ # ملفات الأنماط

└── types/ # تعريفات TypeScript

```

## الملفات الثابتة

```

public/

├── images/ # صور المنتجات

├── home/ # صور الصفحة الرئيسية

├── NavBar/ # أيقونات شريط التنقل

├── fonts/ # الخطوط المخصصة

└── videos/ # ملفات الفيديو

```

## ميزات تجربة المستخدم

### التصميم

- واجهة مستخدم عربية أصيلة

- ألوان متناسقة مع هوية العلامة التجارية

- تصميم متجاوب للهواتف والأجهزة اللوحية

### التنقل والبحث

- شريط بحث ذكي

- قائمة تنقل سهلة الاستخدام

- روابط سريعة للمنتجات والخدمات

### التواصل السريع

- أزرار عائمة للاتصال والواتساب

- نماذج تواصل متعددة

- معلومات واضحة للتواصل

### الاستجابة والأداء

- تحميل سريع للصفحات

- صور محسنة لجميع الأجهزة

- تجربة سلسة عبر المنصات

## إعدادات التطوير

### تشغيل المشروع محلياً

```bash

# تشغيل خادم التطوير

npm run dev

# بناء المشروع للإنتاج

npm run build

# تشغيل النسخة المبنية

npm start

# فحص جودة الكود

npm run lint

```

### متطلبات النظام

- Node.js 18.0 أو أحدث

- npm أو yarn لإدارة الحزم

## الهوية البصرية

### الألوان الأساسية

- اللون الأساسي: ألوان ترابية وذهبية

- ألوان مساعدة: رمادي، أبيض، أخضر للواتساب

- ألوان التفاعل: أزرق للروابط، أحمر للتنبيهات

### الخطوط

- **Cairo**: الخط الأساسي للنصوص العربية

- أوزان متعددة: من 300 إلى 800

- دعم كامل للغة العربية واللاتينية

## الميزات المتقدمة

### SEO وإمكانية الوصول

- عناوين meta محسنة لمحركات البحث

- وصف منسق للمنتجات والصفحات

- إمكانية وصول كاملة للمستخدمين ذوي الاحتياجات الخاصة

### الأمان والأداء

- كود TypeScript آمن

- تحسين الصور والملفات الثابتة

- فحص دوري لجودة الكود

بطاقة العمل

اسم المستقل
عدد الإعجابات
0
عدد المشاهدات
7
تاريخ الإضافة
تاريخ الإنجاز