🌐 Cyberpunk Code Hub - نيون البرمجة

موقع تفاعلي بأسلوب سايبر بانك مع نمط نيون مظلم يوفر مستودعاً شاملاً لأكواد برمجية احترافية بلغات برمجة مختلفة.

✨ المميزات

🎨 التصميم

• نمط نيون مظلم: خلفيات سوداء عميقة مع ألوان نيون ساطعة (أزرق، بنفسجي، وردي)
• تأثيرات بصرية متقدمة: حدود متوهجة، نصوص مضيئة، وظلال ناعمة
• رسوم متحركة سلسة: تأثيرات الظهور، الحركة العائمة، والنبضات الضوئية
• تصميم مستجيب: يعمل بشكل مثالي على جميع الأجهزة

🔧 الوظائف

• 8 لغات برمجة: Python, JavaScript, TypeScript, Rust, Go, C++, Java, C#
• أكواد عينة: 3 أمثلة لكل لغة مع شرح مفصل
• نسخ سهل: انسخ الكود بضغطة زر واحدة
• تحميل الملفات: حمّل الأكواد كملفات جاهزة للاستخدام
• واجهة سهلة الاستخدام: تصفح سلس بين اللغات المختلفة

🚀 البدء السريع

المتطلبات

• Node.js 18+
• npm أو pnpm

التثبيت

# استنساخ المشروع
git clone https://github.com/yourusername/cyberpunk-code-hub.git
cd cyberpunk-code-hub

# تثبيت المكتبات
pnpm install

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

سيفتح الموقع تلقائياً على http://localhost:3000

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

cyberpunk-code-hub/
├── client/
│   ├── src/
│   │   ├── pages/
│   │   │   ├── Home.tsx          # الصفحة الرئيسية
│   │   │   ├── LanguagePage.tsx  # صفحات اللغات
│   │   │   └── NotFound.tsx      # صفحة 404
│   │   ├── components/           # المكونات المشتركة
│   │   ├── App.tsx              # التطبيق الرئيسي
│   │   └── index.css            # الأنماط العامة
│   ├── public/                  # الملفات الثابتة
│   └── index.html              # صفحة HTML الرئيسية
├── package.json
└── README.md

🎯 الألوان المستخدمة

الاسم	الرمز	الاستخدام
Cyan Neon	#00d9ff	العناصر الأساسية والحدود
Magenta	#d946ef	العناصر الثانوية والتفاعلات
Hot Pink	#ff006e	التحذيرات والتركيز
Neon Green	#39ff14	العناصر الإضافية
Dark Background	#0a0e27	الخلفية الرئيسية

🔤 الخطوط المستخدمة

• Space Mono: للعناوين والنصوص الكبيرة (جريئة وحادة)
• Roboto Mono: للنصوص العادية والأكواد (قابلة للقراءة)

🎬 التأثيرات والرسوم المتحركة

تأثيرات النيون

• Glow Effect: توهج مستمر على العناوين
• Pulse Glow: نبضات ضوئية على الحدود
• Neon Border: حدود متوهجة حول العناصر

الرسوم المتحركة

• Fade In: ظهور سلس للعناصر
• Float: حركة عائمة للعناصر الرئيسية
• Slide In: انزلاق العناصر من الجانب
• Cyber Pulse: نبضات خفيفة للعناصر التفاعلية

📝 اللغات المدعومة

1. Python 🐍

لغة برمجة قوية وسهلة التعلم مع أمثلة على الحلقات والدوال.

2. JavaScript ⚡

لغة الويب الأساسية مع أمثلة على الدوال السهمية ومعالجة البيانات.

3. TypeScript 📘

JavaScript محسّن بنظام الأنواع مع أمثلة على الواجهات والفئات.

4. Rust 🦀

لغة آمنة وسريعة مع أمثلة على المتغيرات والدوال.

5. Go 🐹

لغة البرمجة المتزامنة مع أمثلة على Goroutines.

6. C++ ⚙️

لغة الأداء العالي مع أمثلة على الفئات والدوال.

7. Java ☕

البرمجة الموجهة للكائنات مع أمثلة على الفئات والوراثة.

8. C# 🎮

تطوير تطبيقات متقدمة مع أمثلة على الخصائص والفئات.

🛠️ الأدوات والمكتبات

• React 19: مكتبة بناء واجهات المستخدم
• Tailwind CSS 4: نظام تصميم قائم على الفئات
• shadcn/ui: مكونات واجهة مستخدم عالية الجودة
• Wouter: توجيه خفيف الوزن للصفحات
• Lucide React: أيقونات جميلة وحديثة
• Sonner: إشعارات سهلة الاستخدام

📱 التوافقية

• ✅ Chrome/Edge (آخر إصدار)
• ✅ Firefox (آخر إصدار)
• ✅ Safari (آخر إصدار)
• ✅ الهواتف الذكية والأجهزة اللوحية

🚀 النشر

نشر على Manus

# إنشاء نسخة للنشر
pnpm build

# النشر يتم من خلال واجهة Manus

نشر على GitHub Pages

# تحديث ملف package.json
# ثم استخدام GitHub Actions

📄 الترخيص

هذا المشروع مرخص تحت رخصة MIT - انظر ملف LICENSE للتفاصيل.

👨‍💻 المساهمة

نرحب بمساهماتك! يرجى:

1. Fork المشروع
2. إنشاء فرع للميزة الجديدة (git checkout -b feature/amazing-feature)
3. Commit التغييرات (git commit -m 'Add amazing feature')
4. Push إلى الفرع (git push origin feature/amazing-feature)
5. فتح Pull Request

📞 التواصل

• البريد الإلكتروني: your.email@example.com
• GitHub: @yourusername
• Twitter: @yourhandle

🙏 شكر خاص

شكر لجميع المساهمين والمستخدمين الذين يدعمون هذا المشروع!

---

صُنع بـ ❤️ بأسلوب النيون المستقبلي

© 2026 Cyberpunk Code Hub - جميع الحقوق محفوظة