Se configurato correttamente, Firefox può diventare lo strumento di sviluppo web definitivo, dandoti accesso diretto alla pagina su cui stai lavorando in modo da poter modellare la tua pagina in tempo reale, eseguire il debug di javascript o persino modificare l'html.
Crea un profilo separato per lo sviluppo web
L'installazione di tutti questi strumenti di sviluppo trasformerà Firefox in un browser molto pesante, quindi dovremmo prima creare un nuovo profilo per Firefox.
Puoi avviare un profilo separato contemporaneamente al tuo profilo normale creando un nuovo collegamento con questi argomenti, sostituendo WebDev con il nome del tuo profilo. C'è anche un file spiegazione più dettagliata di come farlo.
firefox.exe -P WebDev -no-remote
Ora che hai configurato Firefox con un profilo separato solo per lo sviluppo web, diamo un'occhiata alle estensioni che possiamo utilizzare per trasformare Firefox nello strumento di sviluppo web definitivo.
Estensioni di sviluppo Web indispensabili
Queste sono tutte estensioni che utilizzo regolarmente per lo sviluppo web.
Firebug è l'estensione più potente per il debug di javascript, la visualizzazione di CSS e html. È possibile apportare modifiche dinamiche al codice e al CSS e utilizzarlo per eseguire il debug del codice Ajax. È davvero la migliore estensione disponibile.
Una delle migliori estensioni per x anni consecutivi. Questo è un must per qualsiasi sviluppatore, ma ne hai già sentito parlare.
Questa estensione è un'estensione molto leggera che ti mostrerà facilmente gli elementi sulla pagina e la loro classe / id assegnati. È più semplice da utilizzare rispetto all'estensione per sviluppatori web per quelle volte in cui hai solo bisogno delle informazioni rapide per un elemento. Puoi anche usarlo per rimuovere elementi dalla pagina.
Seleziona facilmente i colori. Niente più problemi nel trovare i colori incorporati da qualche parte in un foglio di stile.
È possibile impostare più profili di visualizzazione dell'origine per aprire l'origine in diverse applicazioni.
Questa estensione ti consente di convalidare facilmente il codice HTML della tua pagina e di installarla nel pannello Visualizza sorgente.
Non è esattamente un'estensione per sviluppatori web, ma Greasemonkey è fantastico, non da ultimo per la capacità di automatizzare le azioni eseguite comunemente, che è un grande risparmio di tempo per gli sviluppatori web.
Misura facilmente una distanza sullo schermo con questa estensione. Dopo aver misurato un'area, puoi trascinare il rettangolo sullo schermo per utilizzarlo come confronto.
IE View / IE Tab / OperaView / FirefoxView / Safari View / IE View Lite
Queste estensioni (a tua scelta) ti consentono di visualizzare facilmente la pagina corrente in diversi browser. IE Tab ti permetterà persino di eseguire IE all'interno di una scheda, se fossi così incline.
Cancella la cache. Particolarmente utile per controllare le nuove modifiche CSS.
L'estensione Riavvia Firefox è molto utile per chiudere e riavviare Firefox con tutte le schede e le sessioni intatte.
L'estensione Tab Mix Plus è un'ottima estensione in generale, ma ha alcune funzionalità essenzialmente utili per gli sviluppatori web: Duplica scheda e Copia URL scheda.
L'estensione YSlow è una nuova estensione di Yahoo che analizzerà la tua pagina e ti dirà dove stai commettendo errori. Ti darà anche un voto sulle prestazioni del tuo sito. Noterai il piccolo indicatore nell'angolo in basso a destra ... ti dice la dimensione totale della tua pagina e il tempo di caricamento. Estensione molto utile, ma richiede l'estensione Firebug.
L'estensione del generatore Dummy Lipsum genererà per te contenuti fittizi basati sul famoso testo di Lorem Ipsum che è molto utile per creare contenuti falsi nel tuo sito.
L'estensione Screengrab ti consente di acquisire schermate di pagine, ma può fare qualcosa che un normale strumento di screenshot non può fare: può acquisire un'immagine dell'intera pagina, non solo della parte visualizzabile.
Ci sono tantissime altre estensioni che puoi utilizzare, ma queste sono le migliori tra tutte quelle che ho visto. Se hai un'altra estensione che usi regolarmente, lascia una menzione nei commenti.
A questo punto, hai trasformato Firefox nello strumento di sviluppo web definitivo. Prenditi del tempo per imparare a usare in particolare Firebug.
