For nylig udgav vi et indlæg om de 12 Google Chrome-udvidelser til udviklere og designere, og mens nogle af disse udvidelser er tilgængelige på Firefox , jeg ville ikke gentage nogen her.
På samme måde er nogle af udvidelserne anført nedenfor tilgængelige på Chrome, så overvej sådanne apps som bonusser til de respektive browsere.
1. HTML Validator
HTML Validator kører gennem din kode for at sikre, at den følger HTML-standardkonventionen. Den viser antallet af fejl, den ser på ikonet på værktøjslinjen.
HTML Validator Firefox Addon
2. Oktotræ
Som udvikler kører jeg gennem adskillige kodesider på GitHub nu og da, når jeg søger for at se, hvordan andre udviklere løste visse problemer . Hvis du er ligesom mig, vil du finde Octotree nyttigt.
Octotree viser GitHub-kode i et træformat. På den måde kan du gennemse kodelinjer uden at downloade kildefilerne.
Octotree Viser GitHub-kode i træformat
3. HTTPS over alt
HTTPS Everywhere krypterer de data, du udveksler med alle større websider, selvom de ikke bruger HTTPS.
Så hvis du bliver dirigeret til sider, der ikke bruger https, kan du være sikker på, at din kommunikation online er sikker.
4. Sideydelsestest
Page Performance Test giver dig statistik på dine websider ved at måle deres hastighed og indlæsningsydelse. Du kan gemme resultaterne af diagrammet for at sammenligne det med efterfølgende tests.
Page Performance Test
5. Usersnap
Usersnap giver dig mulighed for at tage websites skærmbilleder og kommentere dem ved at tilføje markup-tegninger og kommentarer. Den leveres også med en pixellineal og kan integreres direkte med forskellige projektstyringsværktøjer, herunder Slac, Trello og JIRA.
Denne liste vil ikke være komplet uden Usersnap, da den muliggør en effektiv feedbackproces. Det er dog en bet alt tjeneste med en 14-dages gratis prøveperiode.
Usersnap
6. Deaktiver JavaScript
Deaktiver JavaScript, som navnet antyder, giver dig mulighed for at slå JavaScript fra på websteder eller blot bestemte faner. Du kan tilpasse den til at have en standard JS-tilstand til/fra og en standard deaktiveringsadfærd efter domæne/fane osv.
Deaktiver JavaScript
7. Tjekliste for webudvikler
Udvidelsen til webudviklertjekliste giver dig et overblik over, hvor brugbart dit websted er i henhold til den bedste design- og udviklingspraksis.
Hvis du klikker på ikonet, informeres du om dit websteds SEO, venlige URL'er, favicon osv. med flueben ud for dem for at angive et bestået.
Webudviklertjekliste
8. React Developer Tools
Med den tilsyneladende uendelige stigning i Reacts popularitet bliver React-udviklere født næsten hver dag, og React-teamet har dem dækket.
React Developer Tools giver dig mulighed for at inspicere et React-træ sammen med dets tilstand, rekvisitter, hierarki osv. For at aktivere det , start Firefox devtools og skift til fanen React.
Der er også en version til Vue udviklere i form af Vue.js devtools.
React Developer Tools
9. ColorZilla
ColorZilla er et glimrende værktøj for udviklere og grafiske designere til at vælge farver fra forskellige websider.
Den indeholder også en pipette, en gradientgenerator, paletbrowser og farvehistorik.
ColorZilla
10. Evernote Web Clipper
Evernote Web Clipper giver dig mulighed for at tage skærmbilleder af websider og gemmer dem automatisk på din Evernotekonto, hvorfra du kan lave anmærkninger og dele med teammedlemmer.
Evernote Web Clipper
11. Cookie Manager
Cookie Manager er en sikkerhedsbevidst udvidelse, der giver dig mulighed for at se, tilføje, redigere, slette og søge efter cookies i enhver domæne.
Det, der er endnu smartere ved Cookie Manager, er, at du kan eksportere og importere cookies mellem domæner.
Cookie Manager
12. Live Editor til CSS og LESS
Live Editor for CSS og LESS giver dig mulighed for at skrive CSS/LESS-kode direkte i din browser. Din kode træder i kraft med det samme og vil blive gemt på webstedsniveau i din browsers lokale lager.
Dens in-page editor har autofuldførelse, forskønnelse, linter osv. Du bør tjekke det ud.
Live editor til CSS
Kan du lide nogen af de angivne udvidelser, eller har du en liste, som vi kan bruge? Kommentarsektionen er nedenfor.