front-end

تعرّف على كل ما يخص front-end في مجال البرمجة، الشبكات، الأمن السيبراني، الهندسة العكسية، والتصميم من خلال شروحات عملية ودروس احترافية متجددة على منتديات أكتب كود.

  1. Blazor WebAssembly شرح شامل للمطورين

    شرح Blazor WebAssembly للمطورين بلغة بسيطة، إزاي تشغّل تطبيقات C# و .NET جوه المتصفح بأداء عالي ومن غير JavaScript
    • x32x01
    • الموضوع
    • الردود: 0
    • المنتدى: منتدى لغة ASP.NET [Microsoft ASP.NET]
    • .net blazor c sharp debugging front-end static hosting visual studio webassembly أداء عالي تطبيق ويب

  2. اكتشف قوة TypeScript ومزاياها للمبرمجين المحترفين

    تعرف على لغة TypeScript وأهم ميزاتها مقابل JavaScript وPython، مع أمثلة عملية لكتابة كود احترافي منظم وسهل الصيانة.

  3. برمجة ساعة بواسطة HTML و CSS

    برمجة ساعة تبدو واقعية اكثر كجعل الساعة زجاجية + وضع ظلال من وراء الساعة من الجانب <div class="clook"> <div class="org"></div> <div class="second"></div> <span>1</span> <span>2</span> <span>3</span> <span>4</span> <span>5</span> <span>6</span> <span>7</span>...

  4. دورة تعلم Bootstrap 4 كاملة بالصوت والصورة

    لو ناوي تتعلم Bootstrap 4 وتبني مواقع شكلها احترافي ومتجاوبة مع كل الشاشات 📱💻، فالدورة دي اختيار ممتاز جدًا، خصوصًا لو لسه مبتدئ في تصميم الويب. الدورة بتشرح Bootstrap 4 خطوة بخطوة وبأسلوب بسيط، مع تطبيق عملي يخليك تفهم الإطار صح وتستخدمه في شغلك أو مشاريعك. لمشاهدة الدورة التعليمية على...

  5. تعلم تصميم مواقع بـ HTML CSS Sass بسهولة

    دورة شاملة لتعلم تصميم مواقع ويب بـ HTML، CSS، وSass بسرعة واحترافية مع أكواد عملية لتسهيل التعلم والبرمجة

  6. إنشاء ساعة رقمية بأستخدام أكواد HTML & JavaScript

    إنشاء ساعة رقمية بأستخدام أكواد HTML & JavaScript كود HTML & JavaScript <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <link rel="stylesheet"...

  7. عمل موقع الكتروني متجاوب بتأثير زجاجي بـ HTML, CSS

    Make a Responsive Glass Website Using HTML and CSS Only | عمل موقع الكتروني متجاوب بتأثير زجاجي انيق في هذا الدرس ستتعلم كيفية عمل موقع الكتروني مودرن باسهل الطرق الممكنة و بافكار ابداعية حيث ان هذا الدرس يتضمن فكرة انشاء موقع متجاوب بتأثير زجاجي انيق

  8. عمل قائمة بتأثير أبداعي Creative Hover Menu Effect

    عمل قائمة بتأثير أبداعي Creative Hover Menu Effect Using HTML, CSS قائمة إبداعية بتأثير Hover باستخدام HTML و CSS تضيف تفاعلًا مميزًا للمستخدم. عند التحويم على الروابط، يظهر تأثير اللون والظهور التدريجي للخط السفلي، مما يحسن تجربة المستخدم
    • x32x01
    • الموضوع
    • الردود: 0
    • المنتدى: منتدى لغة الترميز والتنسيق HTML, CSS
    • css front-end hover effect html تأثير إبداعي تجربة المستخدم تصميم ويب تفاعل المستخدم قائمة واجهة مستخدم

  9. تعلم بوتستراب بالكامل في فيديو واحد | كورس Bootstrap 4

    تعلم بوتستراب بالكامل في فيديو واحد | كورس Bootstrap 4 كامل للمبتدئين تعلم بوتستراب بالكامل في فيديو واحد يتيح لك اكتساب مهارات تصميم المواقع باستخدام Bootstrap 4. يشمل الكورس الأساسيات مثل الشبكات، الأزرار، القوائم المنسدلة، والتخصيص، مما يسهل تطوير مواقع متجاوبة بشكل سريع

  10. 8 أدوات أحترافية بـ CSS هتساعدك في تطوير مواقع الويب

    أدوات أحترافية بـ CSS هتساعدك في تطوير مواقع الويب CSS Buttons, checkboxes, and more! Copy paste CSS & HTML (uiverse.io) Get Waves – Create SVG waves for your next design Keyframes Bennett Feely Smooth Shadow (brumm.af) BGJar | Free svg background image generator for your websites...

  11. موقع بيقدملك أكتر من 700 أيقونة مفتوحة المصدر ..

    موقع بيقدملك أكتر من 700 أيقونة مفتوحة المصدر .. تستخدمهم فى عملك ومتاحين ك CSS أو SVG لكن إيه الجميل في الموضوع إنك لو لسة بتتعلم أو حتى مستواك متوسط ممكن تشوف الأيقونات دي بتترسم إزاي بال CSS وتزود عندك الأفكار الموقع دة بجد هيفرق معاك جدا 700+ CSS Icons, Customizable, Retina Ready & API

  12. معلومة ع السريع فى Progress bar بـ HTML

    هل تعلم أن هذا الـ Tag يعطيك Progress bar ! هل تعلم أن الـ tag في HTML يعطيك شريط تقدم (Progress Bar) بشكل سهل؟ يمكن استخدامه لعرض التقدم في تحميل الملفات أو العمليات الطويلة باستخدام قيمة مئوية meter tag (codepen.io)

  13. زر بأضاءة متحركة بأستخدام HTML, CSS

    تعلم إنشاء زر بأضاءة متحركة باستخدام HTML وCSS مع تأثير Outline يدور باستمرار وتأثير Hover جذاب للمستخدمين

  14. كيفية رسم مثلث بـ CSS

    كيفية رسم مثلث بـ CSS: يمكنك رسم مثلث باستخدام خاصية border في CSS. بتعيين border-left و border-right كـ "transparent" و border-bottom بلون معين، يتم رسم مثلث بسهولة

  15. تأثير الكتابة التلقائية بالنص باستخدام CSS أتوماتيك

    شرح تأثير الكتابة التلقائية في CSS بطريقة سهلة، مع مثال كود عملي يساعدك تضيف أنيميشن كتابة احترافي لمواقع البرمجة بسرعة ومن غير جافاسكريبت سهلة!

  16. ملخص تفاعلي جميل للغة HTML / CSS / JS

    ملخص تفاعلي جميل للغة HTML / CSS / JS ويحتوي كمان مولّدات، وقوالب، وروابط مفيدة ..الخ https://htmlcheatsheet.com

  17. أفضل 10 مكتبات CSS لتصميم صفحات ويب احترافية

    تعرف على أفضل مكتبات CSS لتصميم صفحات ويب جذابة ومتجاوبة بسهولة. أضف تأثيرات، أنيميشن، وأزرار احترافية لمشاريعك.

  18. طريقة عمل قمر مكتمل بـ CSS

    طريقة عمل قمر مكتمل بـ CSS يمكنك إنشاء قمر مكتمل باستخدام CSS عن طريق استخدام border-radius لجعل الشكل دائريًا، ويمكن إضافة تأثير الظل باستخدام ::before لخلق تأثير الظلام على جزء من القمر او من طريقة أخرى

  19. أداة رهيبة لتوليد كود clip-path في CSS

    أداة رهيبة لتوليد كود clip-path في CSS https://bennettfeely.com/clippy وهنا شرح مختصر لـ clip-path لو ما تعرفها
    • x32x01
    • الموضوع
    • الردود: 0
    • المنتدى: منتدى لغة الترميز والتنسيق HTML, CSS
    • clip-path css front-end أدوات css أشكال مخصصة تأثيرات تصميم احترافي تصميم ويب كود عملي واجهة مستخدم

  20. مستودع في github يحتوي على 50 مشروع بسيط html , css

    بناء المشاريع واحده من أفضل الطرق لتعلم وأحتراف تصميم المواقع مستودع في github يحتوي على 50 مشروع بسيط في html , css , javascript يمكنك القيام بها لتطوير مستواك في الويب لعرض المشاريع .. أضغط هنا https://github.com/bradtraversy/50projects50days