רק לאחרונה, פרסמנו פוסט על 12 תוספי Google Chrome למפתחים ומעצבים ובעוד שחלק מההרחבות הללו זמינות ב-Firefox , לא הייתי חוזר על שום דבר כאן.
באותו אופן, חלק מהתוספים המפורטים להלן זמינים ב-Chrome, לכן שקול אפליקציות כאלה כבונוסים עבור הדפדפנים המתאימים.
1. HTML Validator
HTML Validator פועל בקוד שלך כדי לוודא שהוא עומד במוסכמה הסטנדרטית של HTML. הוא מציג את מספר השגיאות שהוא רואה בסמל בסרגל הכלים.
HTML Validator Firefox Addon
2. Octotree
כמפתח, אני רץ על מספר דפי קוד ב-GitHub מדי פעם בעת חיפוש כדי לראות כיצד מפתחים אחרים פתרו בעיות מסוימות . אם אתה כמוני, תמצא את Octotree שימושי.
Octotree מציג קוד GitHub בפורמט עץ. כך, תוכל לדפדף בין שורות קוד מבלי להוריד את קבצי המקור.
Octotree מציג קוד GitHub בפורמט עץ
3. HTTPS בכל מקום
HTTPS Everywhere מצפין את הנתונים שאתה מחליף עם כל דפי האינטרנט הגדולים גם אם הם לא משתמשים ב-HTTPS.
אז אם אתה מופנה לדפים שאינם משתמשים ב-https אתה יכול להיות בטוח שהתקשורת שלך באינטרנט מאובטחת.
4. מבחן ביצועי דף
Page Performance Test נותן לך נתונים סטטיסטיים על דפי האינטרנט שלך על ידי מדידת המהירות וביצועי הטעינה שלהם. אתה יכול לשמור את תוצאות התרשים כדי להשוות אותו לבדיקות עוקבות.
מבחן ביצועי עמוד
5. Usersnap
Usersnap מאפשרת לך לצלם צילומי מסך של אתרים ולהוסיף להם הערות על ידי הוספת שרטוטי סימון והערות. זה גם מגיע עם סרגל פיקסל ויכול להשתלב ישירות עם כלים שונים לניהול פרויקטים כולל Slac, Trello ו-JIRA.
רשימה זו לא תהיה שלמה ללא Usersnap בהתחשב בכך שהיא מאפשרת תהליך משוב יעיל. עם זאת, מדובר בשירות בתשלום, עם ניסיון חינם של 14 יום.
תמונת משתמש
6. השבת JavaScript
Disable JavaScript, כפי שהשם מרמז, נותן לך את היכולת לכבות את JavaScript באתרים או רק בלשוניות ספציפיות. אתה יכול להתאים אישית את מצב JS ברירת המחדל של מופעל/כבוי, והתנהגות ברירת מחדל של השבתה לפי תחום/כרטיסייה וכו'.
השבת JavaScript
7. רשימת רשימת מפתח למפתחי אתרים
תוסף רשימת המפתחים למפתחי אינטרנט מספק לך סקירה כללית של עד כמה האתר שלך שמיש בהתאם לנוהלי העיצוב והפיתוח הטובים ביותר.
לחיצה על הסמל תודיע לך על SEO של האתר שלך, כתובות אתרים ידידותיות, סמלים וכו' עם סימני ביקורת לצדם כדי לציין מעבר.
רשימת רשימת מפתח למפתחי אתרים
8. React Developer Tools
עם העלייה הבלתי נגמרת לכאורה של הפופולריות של React, מפתחי React נולדים כמעט כל יום וצוות React מטפל בהם.
React Developer Tools נותן לך את היכולת לבדוק עץ React יחד עם מצבו, האביזרים, ההיררכיה שלו וכו'. כדי להפעיל אותו , הפעל את Firefox devtools ועבור ללשונית React.
יש גם גרסה למפתחי Vue בצורת Vue.js devtools.
React Developer Tools
9. ColorZilla
ColorZilla הוא כלי מצוין עבור מפתחים ומעצבים גרפיים לבחור צבעים מדפי אינטרנט שונים.
הוא מכיל גם טפטפת, מחולל מעברי צבע, דפדפן פלטות והיסטוריית צבעים.
ColorZilla
10. Evernote Web Clipper
Evernote Web Clipper מאפשר לך לצלם צילומי מסך של דפי אינטרנט ושומר אותם אוטומטית ב-Evernote שלךחשבון שממנו אתה יכול ליצור הערות ולשתף עם חברי הצוות.
Evernote Web Clipper
11. מנהל קובצי Cookie
Cookie Manager הוא תוסף מודע לאבטחה המאפשר לך להציג, להוסיף, לערוך, למחוק ולחפש עוגיות בכל תְחוּם.
מה שעוד יותר מגניב ב-Cookie Manager הוא שאתה יכול לייצא ולייבא קובצי Cookie בין דומיינים.
מנהל עוגיות
12. עורך חי עבור CSS ופחות
עורך חי עבור CSS ו-LESS מאפשר לך לכתוב קוד CSS/LESS ישירות לדפדפן שלך. הקוד שלך ייכנס לתוקף באופן מיידי ויישמר ברמת האתר באחסון המקומי של הדפדפן שלך.
העורך בתוך הדף שלו כולל השלמה אוטומטית, מיפוי, linter וכו'. כדאי לבדוק את זה.
עורך חי עבור CSS
האם מתחשק לך אחד מהתוספים הרשומים או שיש לך רשימה שנוכל להשתמש בה? קטע התגובות נמצא למטה.