زهير طه

0

3,899

أدوات ومواقع مهمة لكل مصمم مواقع انترنت أو مطور ويب يجب أن تضيفها إلى مفضلتك

في هذا الموضوع مجموعة روابط مواقع انترنت وروابط مهمة ومفيدة لكل مطور ويب أو مصمم مواقع انترنت أضفهم إلى المفضلة لأنك ستحتاجهم. تم تصنيفهم على شكل مجموعات كالتالي:

مولدات نصوص وبيانات وقواعد بيانات:

  • أداة بسيطة لتوليد نصوص عشوائية لأهداف اختبار موقع انترنت - http://www.lipsum.com
  • لإنشاء أيقونة موقع favicon انترنت من صورة يتم رفعها - http://tools.dynamicdrive.com/favicon
  • من أروع الأدوات لتوليد كل أنواع البيانات من خلال إدخال الحقول وأنواعها  وعدد الحقول ويحوي الكثير من الأنواع ويتم توليد قواعد بيانات أو بنى بيانات مثل xml وغيرها - https://mockaroo.com/
  • من خلاله ترفع صورة لموقع أو تطبيق فيتم إحاطتها بإطار على شكل هاتف محمول أو جهاز لوحي لتضع هذه الصورة في مكان ما تعرض تطبيقك أو موقعك- https://mockuphone.com
  • لتوليد صورة شعار Logo  لك بكل بساطة - https://www.logaster.com
  • لتوليد UUID بسهولة- https://www.uuidgenerator.net/
  • اطبع نص ما واحصل على ترميزه. يستخدم في الحصول على ترميز كلمة سر مثلاً- https://passwordsgenerator.net/sha256-hash-generator/

مصادر الصور:

  • موقع رائع لتحميل صور مجانية بدقة عالية بأبعاد متنوعة أو اختيارية أو وفقاً للون معين - https://www.pexels.com
  • مشابه للسابق بتشكيلة أقل لكن يمكن الحصول على رابط مباشر لصور بأبعاد أو فئات محددة لاستخدامها في موقعك أو بشكل مؤقت - https://unsplash.com/
  • موقع رائع ومشهور لتحميل الصور وملفات التصميم مثل ملفات الفوتوشوب- https://www.freepik.com
  • يمكن توليد صور بأبعاد معينة لكن صور رمادية مكتوب داخلها الأبعاد- https://source.unsplash.com/
  • مصدر صور- https://placeholder.com
  • موقع تحميل أيقونات (يوجد مجاني ويوجد مدفوع) - https://www.iconfinder.com
  • موقع تحميل أيقونات مسطحة رائع http://flaticon.com/ 

لتحسين الأكواد:

  • لتصغير وضغط ملفات جافا سكربت وملفات css التنسيق - http://minifier.org
  • يحوي الكثير من الأدوات مثل أدوات عرض json بشكل منسق أو لتصغيرها وللتحقق من صحة كتابته وتحويله إلى xml أيضاً وكثير من الأدوات الأخرى مثل تحويل json إلى صف class بلغة جافا وأدوات تحسين الكود للعديد من اللغات وأدوات للألوان والحصول على IP والكثير - https://codebeautify.org
  • للمقارنة بين كودين أو نصين يمكن استخدامه أحياناً في تفحص ومقارنة الأكواد عند الحاجة - https://www.diffchecker.com

أدوات التحويل:

ضغط الصور:

لفحص والتحقق من صحة HTML , CSS:

كتابة الكود (محررات IDE) داخل متصفح:

  • المحرر القوي الشهير والمعروف لكتابة شيفرات الويب ويدعم مكتبات ومنصات مثلاً React, typescript, bootstrap, ...و الكثير - https://codepen.io
  • قوي جداً وقديم - https://jsfiddle.net
  • محرر جديد وجيد- http://liveweave.com
  • محرر رائع لكتابة لغات من طرف السيرفر Server Side  مثل python , node.js وغيرهم- https://repl.it

أدوات SNIPPET  (مشاركة أكواد لإعادة استخدامها):

التصميم والألوان:

تجاوب الموقع:

مخططات العمل:

اختبار سرعة موقع ما:

غير ذلك:

للاطلاع على توضيح بالفيديو لما تم ذكره يمكنكم مشاهدة هذا الفيديو


التعليقات (0)