samedi 17 mars 2012

Créer le profil Ultimate Firefox Développement Web

Lorsqu'il est correctement configuré, Firefox peut devenir l'outil de développement web ultime, vous donnant un accès direct à la page sur lequel vous travaillez de sorte que vous pouvez définir le style de votre page en temps réel, de débogage JavaScript ou même modifier le code HTML.

Créer un profil séparé pour le développement Web

Installation de tous ces outils de développement de Firefox fera dans un navigateur très lourd, nous devons donc d'abord créer un nouveau profil pour Firefox.

Vous pouvez lancer un profil distinct dans le même temps que votre profil régulièrement par la création d'un nouveau raccourci avec ces arguments, en remplacement de WebDev avec le nom de votre profil. Il ya aussi une explication plus détaillée de comment faire cela.

firefox.exe-P WebDev-no-remote

Maintenant que vous avez Firefox configuré avec un profil distinct pour le développement web, nous allons jeter un oeil à l'extension, nous pouvons utiliser pour faire de Firefox dans l'outil de développement web ultime.

Must-Have Extensions Dev Web

Ce sont toutes les extensions que j'utilise sur une base régulière pour le développement web.

Firebug

Firebug est l'extension la plus puissante pour le débogage JavaScript, CSS et HTML visualisation. Vous pouvez faire des changements dynamiques au code et CSS, et l'utiliser pour déboguer votre code Ajax. C'est vraiment la meilleure extension là-bas.

image

Extension Web Developer

Une des meilleures extensions pour x années exécution. C'est un must-have pour tout développeur, mais vous avez déjà entendu parler de lui.

Extension Aardvark

Cette extension est une extension très légère qui pourront facilement vous montrer les éléments de la page et de leur classe assignée / id. C'est plus simple à utiliser que l'extension Web Developer pour les moments où vous avez juste besoin de l'info rapide pour un élément. Vous pouvez également l'utiliser pour supprimer des éléments de la page.

Colorzilla

Sélectionnez les couleurs facilement. Pas plus de douleur de couleurs intégrés trouver quelque part dans une feuille de style.

Afficher la source Avec

Vous pouvez configurer plusieurs profils source en vue d'ouvrir la source dans différentes applications.

HTML Validator

Cette extension vous permet de facilement valider votre page HTML et installe dans le panneau Afficher la source.

Greasemonkey

Ce n'est pas exactement une extension Web Developer, mais Greasemonkey est impressionnant, surtout pour la possibilité d'automatiser des actions couramment effectuées, ce qui est un grand gain de temps pour les développeurs web.

Elle Mesure

Facilement mesurer une distance sur l'écran avec cette extension. Une fois que vous avez mesuré une région, vous pouvez faire glisser le rectangle autour de l'écran à utiliser comme point de comparaison.

IE View / IE Tab / OperaView / FirefoxView / Safari View / IE View Lite

Ces extensions (faites votre choix) vous permettent de facilement visualiser la page en cours dans différents navigateurs. IE Tab vous permettent même de lancer IE à l'intérieur d'un onglet, si vous étiez si incliné.

Bouton Vider le cache

Efface la mémoire cache. Particulièrement utile pour la vérification de nouveaux changements de CSS.

Redémarrer Firefox

L'extension Redémarrer Firefox est très utile pour la fermeture et le redémarrage de Firefox avec tous les onglets et les séances intacte.

Tab Mix Plus

Le Tab Mix Plus est une extension beaucoup en général, mais a quelques fonctionnalités utiles pour l'essentiel pour les développeurs web: Duplicate Tab et Tab URL Copier.

YSlow

L'extension YSlow est une nouvelle extension de Yahoo qui va analyser votre page et vous dire où vous faites des erreurs. Il va même vous donner une note sur votre performance du site. Vous remarquerez la petite jauge en bas à droite ... il vous indique la taille totale de votre page ainsi que le temps de chargement. Extension très utile, mais elle ne nécessite l'extension Firebug.

Lorem Ipsum Dummy

L'extension Lipsum factice générateur va créer du contenu fictif pour vous basé sur le texte Lorem Ipsum célèbre qui est très utile pour la pose de faux sur le contenu de votre site.

Screengrab!

L'extension Screengrab vous permettra de prendre des screenshots de pages, mais peut faire quelque chose un outil de capture d'écran ordinaire ne peut pas - cela peut prendre une image de la page entière, pas seulement la partie visible.

Il ya des tonnes d'autres extensions que vous pouvez utiliser, mais ce sont les meilleurs des meilleurs de tout ce que j'ai vu. Si vous avez une autre extension que vous utilisez régulièrement, laisser une mention dans les commentaires.

A ce stade, vous avez maintenant tourné Firefox dans l'outil de développement web ultime. Prenez le temps d'apprendre comment utiliser Firebug en particulier.

Aucun commentaire:

Enregistrer un commentaire