نظرة عامة
هنالك أدوات تحتاج ان تتعلمها وان تكون متمكن من استخدامها لتصميم موقع بشكل عصري. في هذه القائمه سوف اذكر لكم جميع هذه الادوات، وظائفها، ميزاتها، أهميتها لتطوير المواقع الإلكترونية في عام ٢٠١٩.
أدوات اساسيه
في البدايه تحتاج إلى محرر لكتابة أكواد بشكل متناسق مثل VSCode، Atom, Brackets.
أيضاً تحتاج لـ Browser مناسب مثل Chrome او Firefox.
إذا كنت تريد التعمق اكثر في تصميم الواجهات لتصبح متخصص في Front-End، إذآ يجب الإلمام أيضاً ببرامج الفوتوشوب مثل XD, Sketch, Figma.
أدوات التصميم
في بداية اي مشروع تقني يتعلق بالصفحات الإلكترونية لابد من الإلمام بالـ HTML & CSS , جميع الصفحات الإلكترونية تحتوي على HTML & CSS.
يجب ان تكون متمكن من استخدام هذه الادوات بشكل احترافي خصوصاً الـ CSS Positioning, box model, flexbox, CSS Grade, CSS variables.
التصميم المتجاوب Responsive layout
أن تكون الصفحات الإلكترونية تعمل بشكل متناسق على جميع مقاسات الأجهزة.
بداية من شاشات الجوال، اللابتوب حتى شاشة الكمبيوتر PC, كانت تعد من الكماليات، أما الآن فهي من الاساسيات.
تحتاج لتعلم Set viewport, Fluid width, Media queries, rem over px
التمكن من أستخدم JavaScript
قوة الجافاسكربت تعكس قوة اساس كل صفحه إلكترونية.
تعلم استخدم الجافا سكربت بدون أي مكتبات مساعده.
مثل ال Loops, Data Types, functions, operators, conditions.
بالاضافه إلى معرفة استخدامات الـ JSON و fetch API و DOM.
استخدام قوالب التصميم
أهم هذه القوالب هو الـ Bootstrap.
هو عباره عن إطار خليط من CSS، HTML، JS طورته Twitter.
سوف تحتاجه كثيرا في الـ Front-End لإضافة قوالب، ايقونات، تنقل سهل بين الصفحات.
الـ Bootstrap يختصر عليك وقت ويضيف طابع جميل على صفحتك. بالإضافه إلى Materialize, Bulma.
إطارات الـ JavaScript
في الوقت الحالي اصبح من الضروري تعلم ومعرفة استخدام اطارات مثل React و Vue في واجهات المستخدم الـ UI.
هذه الإطارات تتشابه مع الـ bootstrap كثيراً في خصائصها إلى ان هنالك إختلاف طفيف في التفاصيل.
رفع الصفحات الإلكترونيه
عد إتمام المشروع وعمل الصفحات الإلكترونية بالشكل المطلوب.
إبحث عن شركة استضافه والخيارات كثيره، منها المجاني ومنها بأسعار معقوله.
بعد ذلك سوف تحتاج لبرنامج نقل الملفات من وإلى الخادم.
أفضل برنامج مستخدم حالياً هو Filezilla, يعمل على جميع أنظمة التشغل.
مصادر للتعلم
في حال لديك أى استفسارات يمكنك ترك تعليق في التعليقات أو التواصل معنا من خلال صفحة التواصل.
