ال WhatsApp

12 إضافات Firefox للمطورين & المصممين

Anonim

مؤخرًا ، أصدرنا منشورًا على 12 امتدادًا لـ Google Chrome للمطورين والمصممين ، بينما تتوفر بعض هذه الإضافات علىFirefox، لن أكرر أي شيء هنا.

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

1.مدقق HTML

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

مدقق HTML لمتصفح فايرفوكس الملحق

2. Octotree

بصفتي مطورًا ، أقوم بتشغيل العديد من صفحات الرموز علىGitHubبين الحين والآخر عند البحث لمعرفة كيفية حل المطورين الآخرين لمشاكل معينة . إذا كنت مثلي فستجدOctotreeمفيد.

Octotreeيعرض كود GitHub بتنسيق شجرة. بهذه الطريقة ، يمكنك تصفح أسطر التعليمات البرمجية دون تنزيل الملفات المصدر.

Octotree يظهر كود GitHub بتنسيق شجرة

3. HTTPS Everywhere

HTTPS Everywhereيشفر البيانات التي تتبادلها مع جميع صفحات الويب الرئيسية حتى لو لم تستخدم HTTPS.

لذلك إذا تم توجيهك إلى صفحات لا تستخدم https ، يمكنك التأكد من أن اتصالك عبر الإنترنت آمن.

4. اختبار أداء الصفحة

يمنحك اختبار أداء الصفحةإحصائيات عن صفحات الويب الخاصة بك عن طريق قياس سرعتها وأداء التحميل. يمكنك حفظ نتائج المخطط لمقارنتها بالاختبارات اللاحقة

اختبار أداء الصفحة

5. خريطة المستخدمين

Usersnapتمكنك من التقاط لقطات شاشة لمواقع الويب والتعليق عليها عن طريق إضافة رسومات التوصيف والتعليقات. كما يأتي مزودًا بمسطرة بكسل ويمكن أن يتكامل مباشرةً مع أدوات إدارة المشاريع المختلفة بما في ذلك Slac و Trello و JIRA.

لن تكتمل هذه القائمة بدون Usersnap نظرًا لأنها تتيح عملية ردود فعل فعالة. ومع ذلك ، فهي خدمة مدفوعة مع نسخة تجريبية مجانية مدتها 14 يومًا.

Usersnap

6. ألغ تفعيل الجافا سكربت

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

ألغ تفعيل الجافا سكربت

7. قائمة مراجعة مطور الويب

يوفر لك ملحق قائمة مراجعة مطوري الويب لمحة عامة عن مدى إمكانية استخدام موقعك وفقًا لأفضل ممارسات التصميم والتطوير.

سيؤدي النقر فوق الرمز إلى إعلامك بمُحسّنات محرّكات البحث لموقعك وعناوين URL الودية والأيقونة المفضلة وما إلى ذلك مع وجود علامات اختيار بجانبها للإشارة إلى مرور.

قائمة مراجعة مطور الويب

8. أدوات المطور للتفاعل

مع الارتفاع اللامتناهي على ما يبدو لشعبية React ، يولد مطورو React كل يوم تقريبًا ويقوم فريق React بتغطيتهم.

أدوات المطورين المتفاعلةتمنحك القدرة على فحص شجرة رد الفعل مع حالتها ، والدعائم ، والتسلسل الهرمي ، وما إلى ذلك لتنشيطها ، قم بتشغيل Firefox devtools وانتقل إلى علامة التبويب React

هناك أيضًا إصدار لـVueمطورون في شكل Vue.js devtools

أدوات المطور المتفاعلة

9. ColorZilla

ColorZillaهي أداة ممتازة للمطورين ومصممي الرسوم لاختيار الألوان من صفحات الويب المختلفة.

يحتوي أيضًا على قطارة ، ومولد متدرج ، ومتصفح لوح الألوان ، وسجل الألوان.

ColorZilla

10. Evernote Web Clipper

Evernote Web Clipperتمكنك من التقاط لقطات شاشة لصفحات الويب وحفظها تلقائيًا فيEvernoteيمكنك من خلاله عمل التعليقات التوضيحية ومشاركتها مع أعضاء الفريق.

Evernote Web Clipper

11. مدير ملفات تعريف الارتباط

مدير ملفات تعريف الارتباطهو امتداد يراعي الأمان يمكّنك من عرض ملفات تعريف الارتباط وإضافتها وتحريرها وحذفها والبحث عنها في أي منها نطاق.

ما هو أكثر روعة في Cookie Manager هو أنه يمكنك تصدير واستيراد ملفات تعريف الارتباط بين المجالات.

مدير ملفات تعريف الارتباط

12. Live Editor لـ CSS و LESS

محرر مباشر لـ CSS وأقليمكّنك من كتابة رمز CSS / LESS مباشرة في متصفحك. يسري رمزك على الفور وسيتم حفظه على مستوى الموقع في التخزين المحلي لمتصفحك.

يتميز المحرر داخل الصفحة بإكمال تلقائي ، تجميل ، linter ، إلخ. يجب عليك التحقق من ذلك.

محرر مباشر لـ CSS

هل تتخيل أيًا من الامتدادات المدرجة أو لديك قائمة يمكننا استخدامها؟ قسم التعليقات أدناه.