"إذا أراد العامل أن يؤدي عمله بشكل جيد، فعليه أولاً أن يشحذ أدواته." - كونفوشيوس، "مختارات كونفوشيوس. لو لينجونج"
الصفحة الأمامية > برمجة > مشاريع HTML وCSS وجافا سكريبت

مشاريع HTML وCSS وجافا سكريبت

تم النشر بتاريخ 2024-11-03
تصفح:907

HTML, CSS, and JavaScript Projects

مرحبًا بك في مجموعتي من مشاريع HTML وCSS وJavaScript! يقدم منشور المدونة هذا نظرة عامة شاملة على العديد من المشاريع التي قمت بإنشائها، ويعرض جوانب مختلفة من تطوير الويب. يتوفر كل مشروع في مستودعه الخاص، والذي يتضمن كل التعليمات البرمجية التي ستحتاج إلى استكشافها والتعلم منها.

جدول المحتويات

  • مقدمة
  • نظرة عامة على المشروع
  • ابدء
  • المساهمة
  • مؤلف

مقدمة

كمطور ويب، أستمتع بالعمل على مجموعة متنوعة من المشاريع التي تساعدني على تحسين مهاراتي في HTML وCSS وJavaScript. من الآلات الحاسبة البسيطة إلى التطبيقات الأكثر تعقيدًا، توضح هذه المشاريع تقنيات مختلفة وأفضل الممارسات في تطوير الويب. ستجد أدناه قائمة منسقة بالمشاريع، كل منها يحتوي على رابط إلى مستودع GitHub الخاص به.

نظرة عامة على المشروع

إليك ملخص للمشاريع التي عملت عليها:

  1. أخبار أبهي كي

    • تطبيق إخباري يجمع ويعرض أحدث العناوين.
    • عرض الرمز
  2. مولد النصائح

    • يُنشئ نصائح عشوائية لتزويد المستخدمين بنصائح مفيدة.
    • عرض الرمز
  3. حاسبة العمر

    • أداة لحساب العمر بناءً على إدخال تاريخ الميلاد.
    • عرض الرمز
  4. ساعة تناظرية

    • يعرض ساعة تناظرية وظيفية باستخدام JavaScript.
    • عرض الرمز
  5. بطاقة المقالة

    • مكون بطاقة منمقة لعرض المقالات.
    • عرض الرمز
  6. حاسبة مؤشر كتلة الجسم

    • حساب مؤشر كتلة الجسم بناءً على مدخلات المستخدم.
    • عرض الرمز
  7. مؤقت العد التنازلي

    • مؤقت يقوم بالعد التنازلي حتى تاريخ ووقت محددين.
    • عرض الرمز
  8. محاكي رمي النرد

    • يحاكي رمي النرد باستخدام مولد أرقام عشوائي.
    • عرض الرمز
  9. مجموعة الطبول

    • مجموعة طبول افتراضية تتيح للمستخدمين تشغيل أصوات الطبول المختلفة.
    • عرض الرمز
  10. الأسئلة الشائعة الأكورديون

    • قسم الأسئلة الشائعة على طراز الأكورديون لمواقع الويب.
    • عرض الرمز
  11. عملة الوجه

    • محاكاة بسيطة لقلب العملة.
    • عرض الرمز
  12. التركيز على اليوم

    • يساعد المستخدمين على التركيز على المهام اليومية من خلال واجهة مستخدم مركزة.
    • عرض الرمز
  13. عشاق همبرغر

    • قائمة همبرغر أنيقة للمواقع المتعلقة بالطعام.
    • عرض الرمز
  14. حاسبة القروض

    • يحسب أقساط سداد القروض بناء على مدخلات المستخدم.
    • عرض الرمز
  15. نموذج تسجيل الدخول

    • نموذج تسجيل دخول أساسي مع التحقق من صحة النموذج.
    • عرض الرمز
  16. تقويم الشهر

    • عرض تقويم لأي شهر معين.
    • عرض الرمز
  17. حاسبة الرهن العقاري

    • حساب أقساط الرهن العقاري بناءً على المدخلات المختلفة.
    • عرض الرمز
  18. الصفحة الرئيسية للأخبار

    • تصميم الصفحة الرئيسية لموقع إخباري.
    • عرض الرمز
  19. نموذج الاشتراك في النشرة الإخبارية

    • نموذج للمستخدمين للاشتراك في النشرات الإخبارية.
    • عرض الرمز
  20. مولد كلمات المرور

    • ينشئ كلمات مرور آمنة مع خيارات قابلة للتخصيص.
    • عرض الرمز
  21. مؤقت بومودورو

    • مؤقت للمساعدة في الإنتاجية باستخدام تقنية البومودورو.
    • عرض الرمز
  22. بطاقة الملف الشخصي

    • مكون بطاقة لعرض ملفات تعريف المستخدمين.
    • عرض الرمز
  23. مولد رمز الاستجابة السريعة

    • ينشئ رموز QR بناءً على إدخال المستخدم.
    • عرض الرمز
  24. مقص الورق الصخري

    • لعبة Rock Paper Scissors مطبقة بلغة JavaScript.
    • عرض الرمز
  25. آلة حاسبة بسيطة

    • آلة حاسبة أساسية لإجراء العمليات الحسابية.
    • عرض الرمز
  26. التجارة الإلكترونية للأحذية الرياضية

    • صفحة تجارة إلكترونية للأحذية الرياضية مع قوائم المنتجات.
    • عرض الرمز
  27. محول درجة الحرارة

    • تحويل درجات الحرارة بين مئوية، فهرنهايت، وكلفن.
    • عرض الرمز
  28. شريط تمرير الشهادات

    • مكون شريط تمرير لعرض شهادات المستخدمين.
    • عرض الرمز
  29. تحويل النص إلى كلام

    • يحول إدخال النص إلى كلمات منطوقة باستخدام Web Speech API.
    • عرض الرمز
  30. تيك تاك تو

    • لعبة Tic-Tac-Toe كلاسيكية تم تنفيذها بلغة JavaScript.
    • عرض الرمز
  31. حاسبة الإكرامية

    • يحسب مبلغ الإكرامية بناءً على الفاتورة ونسبة الإكرامية.
    • عرض الرمز

32

. قائمة المهام
- تطبيق قائمة مهام بسيط لإدارة المهام.
- عرض الرمز

  1. تحويل الوزن
    • تحويل الأوزان بين الوحدات المختلفة.
    • عرض الرمز

ابدء

لاستنساخ وتشغيل أي من هذه المشاريع محليا، اتبع الخطوات التالية:

  1. استنساخ المستودع:
   git clone https://github.com/abhishekgurjar-in/html-css-javascript-projects.git
  1. انتقل إلى دليل المشروع:
   cd 
  1. افتح المشروع في متصفحك: افتح ملف Index.html في متصفحك لرؤية المشروع قيد التنفيذ.

المساهمة

إذا كنت ترغب في المساهمة في أي من هذه المشاريع، يرجى اتباع هذه الإرشادات:

  1. فرع المستودع.
  2. إنشاء فرع جديد لتغييراتك.
  3. نفذ تغييراتك وادفعها إلى مستودعك المتشعب.
  4. قم بإنشاء طلب سحب مع وصف التغييرات التي أجريتها.

مؤلف

ابهيشيك جورجار

بيان الافراج تم نشر هذه المقالة على: https://dev.to/abhishekgurjar/html-css-and-javascript-projects-3b6e?1 إذا كان هناك أي انتهاك، يرجى الاتصال بـ [email protected] لحذفه
أحدث البرنامج التعليمي أكثر>

تنصل: جميع الموارد المقدمة هي جزئيًا من الإنترنت. إذا كان هناك أي انتهاك لحقوق الطبع والنشر الخاصة بك أو الحقوق والمصالح الأخرى، فيرجى توضيح الأسباب التفصيلية وتقديم دليل على حقوق الطبع والنشر أو الحقوق والمصالح ثم إرسالها إلى البريد الإلكتروني: [email protected]. سوف نتعامل مع الأمر لك في أقرب وقت ممكن.

Copyright© 2022 湘ICP备2022001581号-3