Di recente, abbiamo pubblicato un post sulle 12 estensioni di Google Chrome per sviluppatori e designer e mentre alcune di queste estensioni sono disponibili su Firefox , non ne ripeterei nessuna qui.
Allo stesso modo, alcune delle estensioni elencate di seguito sono disponibili su Chrome quindi considera tali app come bonus per i rispettivi browser.
1. Validatore HTML
HTML Validator esegue il codice per assicurarsi che segua la convenzione standard HTML. Mostra il numero di errori che vede sull'icona nella barra degli strumenti.
Convalida HTML Componente aggiuntivo per Firefox
2. Ottoalbero
Come sviluppatore, passo in rassegna diverse code page su GitHub di tanto in tanto durante le ricerche per vedere come altri sviluppatori hanno risolto determinati problemi . Se sei come me, troverai Octotree utile.
Octotree visualizza il codice GitHub in un formato ad albero. In questo modo, puoi sfogliare le righe di codice senza scaricare i file sorgente.
Octotree mostra il codice GitHub in formato albero
3. HTTPS Ovunque
HTTPS Ovunque crittografa i dati che scambi con tutte le principali pagine Web anche se non utilizzano HTTPS.
Quindi, se vieni indirizzato a pagine che non utilizzano https, puoi essere certo che le tue comunicazioni online siano sicure.
4. Test delle prestazioni della pagina
Page Performance Test fornisce statistiche sulle tue pagine web misurando la loro velocità e le prestazioni di caricamento. Puoi salvare i risultati del grafico per confrontarlo con i test successivi.
Test delle prestazioni della pagina
5. Utentinap
Usersnap ti consente di acquisire screenshot di siti Web e annotarli aggiungendo disegni e commenti di markup. Inoltre viene fornito con un righello di pixel e può integrarsi direttamente con vari strumenti di gestione dei progetti tra cui Slac, Trello e JIRA.
Questo elenco non sarà completo senza Usersnap dato che consente un efficace processo di feedback. È un servizio a pagamento, tuttavia, con una prova gratuita di 14 giorni.
Usersnap
6. Disabilita JavaScript
Disabilita JavaScript, come suggerisce il nome, ti dà la possibilità di disattivare JavaScript sui siti web o solo su schede specifiche. Puoi personalizzarlo per avere uno stato JS predefinito di attivazione/disattivazione e un comportamento di disabilitazione predefinito per dominio/scheda, ecc.
Disabilita JavaScript
7. Lista di controllo per sviluppatori web
L'estensione Web Developer Checklist ti fornisce una panoramica dell'usabilità del tuo sito secondo le migliori pratiche di progettazione e sviluppo.
Fare clic sull'icona ti informerà sul SEO del tuo sito, URL amichevoli, favicon, ecc. con segni di spunta accanto a loro per indicare un passaggio.
Lista di controllo per sviluppatori web
8. Strumenti per sviluppatori React
Con l'aumento apparentemente infinito della popolarità di React, gli sviluppatori React nascono quasi ogni giorno e il team di React li copre.
React Developer Tools ti dà la possibilità di ispezionare un albero React insieme al suo stato, oggetti di scena, gerarchia, ecc. Per attivarlo , avvia Firefox devtools e passa alla scheda React.
Esiste anche una versione per sviluppatori Vue sotto forma di Vue.js devtools.
Strumenti per sviluppatori React
9. ColorZilla
ColorZilla è uno strumento eccellente per sviluppatori e grafici per scegliere i colori da diverse pagine web.
Contiene anche un contagocce, un generatore di sfumature, un navigatore di tavolozze e una cronologia dei colori.
ColorZilla
10. Evernote Web Clipper
Evernote Web Clipper ti consente di acquisire schermate di pagine Web e di salvarle automaticamente sul tuo Evernoteaccount dal quale puoi inserire annotazioni e condividerle con i membri del team.
Evernote Web Clipper
11. Gestore dei cookie
Cookie Manager è un'estensione attenta alla sicurezza che ti consente di visualizzare, aggiungere, modificare, eliminare e cercare i cookie in qualsiasi dominio.
La cosa ancora più interessante di Cookie Manager è che puoi esportare e importare i cookie tra domini.
Gestore dei cookie
12. Live Editor per CSS e LESS
Live Editor per CSS e LESS ti permette di scrivere codice CSS/LESS direttamente nel tuo browser. Il tuo codice ha effetto immediato e verrà salvato a livello di sito nella memoria locale del tuo browser.
Il suo editor in-page include completamento automatico, abbellimento, linter, ecc. Dovresti dare un'occhiata.
Live editor per CSS
Hai voglia di qualcuna delle estensioni elencate o hai una lista che possiamo usare? La sezione dei commenti è sotto.