24Aug

Maak het ultieme webontwikkelingsprofiel van Firefox

Wanneer het goed is geconfigureerd, kan Firefox de ultieme webontwikkelingstool worden, waardoor je direct toegang hebt tot de pagina waar je aan werkt, zodat je je pagina in real-time kunt stijlen, foutopsporing javascript of zelfs de html kunt bewerken.

Maak een afzonderlijk profiel voor webontwikkeling

Door al deze ontwikkeltools te installeren, wordt Firefox een zeer zware browser, dus we moeten eerst een nieuw profiel voor Firefox maken.

U kunt een afzonderlijk profiel tegelijkertijd met uw normale profiel starten door een nieuwe snelkoppeling te maken met deze argumenten, ter vervanging van WebDev door de naam van uw profiel. Er is ook een meer gedetailleerde uitleg over hoe dit te doen.

firefox.exe -P WebDev -no-remote

Nu Firefox is geconfigureerd met een apart profiel voor webontwikkeling, laten we eens kijken naar de extensies die we kunnen gebruiken om van Firefox de ultieme webontwikkelingstool te maken.

Webuitbreidingen met een nieuwe extensie

Dit zijn allemaal extensies die ik regelmatig gebruik voor webontwikkeling.

Firebug

Firebug is de krachtigste uitbreiding voor het opsporen van fouten in javascript, het bekijken van CSS en html. U kunt dynamische wijzigingen aanbrengen in de code en CSS en deze gebruiken om uw Ajax-code te debuggen. Het is echt de beste extensie die er is.

Web Developer Extension

Een van de beste extensies voor x jaar op de markt. Dit is een must voor elke ontwikkelaar, maar je hebt er al van gehoord.

Aardvark Extension

Deze extensie is een zeer lichtgewicht extensie die u gemakkelijk de elementen op de pagina en hun toegewezen klasse / ID zal tonen. Het is eenvoudiger te gebruiken dan de extensie voor webontwikkelaars voor die keren dat u alleen de snelle informatie voor een element nodig heeft. U kunt het ook gebruiken om elementen van de pagina te verwijderen.

Colorzilla

Selecteer kleuren gemakkelijk. Geen pijn meer om kleuren te vinden die ergens in een stylesheet zijn ingebed.

Bron weergeven met

U kunt meerdere weergavebronprofielen instellen om de bron in verschillende toepassingen te openen.

HTML Validator

Met deze extensie kunt u eenvoudig uw pagina-HTML valideren en installeren in het paneel View Source.

Greasemonkey

Het is niet echt een extensie voor een webdeveloper, maar Greasemonkey is geweldig, niet het minst voor de mogelijkheid om vaak uitgevoerde acties te automatiseren, wat een geweldige tijdsbesparing is voor webontwikkelaars.

Measure It

Meet eenvoudig een afstand op het scherm met deze extensie. Nadat u een gebied hebt gemeten, kunt u de rechthoek rond het scherm slepen om als een vergelijking te gebruiken.

IE Bekijk / IE tabblad / OperaView / FirefoxView / Safari View / IE Lite

bekijken Met deze extensies( maak uw keuze) kunt u eenvoudig de huidige pagina in verschillende browsers bekijken. IE Tab laat je IE zelfs binnen een tab openen, als je dat zou willen.

Cache-knop wissen

Wist de cache. Vooral handig voor het controleren van nieuwe CSS-wijzigingen.

Start Firefox opnieuw

De herstart-extensie van Firefox is erg handig voor het afsluiten en herstarten van Firefox met alle tabbladen en sessies intact.

Tab Mix Plus

De Tab Mix Plus-extensie is in het algemeen een geweldige uitbreiding, maar heeft enkele in wezen nuttige functies voor webontwikkelaars: het tabblad Dubbele URL dupliceren en Kopiëren.

YSlow

De YSlow-extensie is een nieuwe extensie van Yahoo die uw pagina zal analyseren en u zal vertellen waar u fouten maakt. U krijgt zelfs een cijfer voor de prestaties van uw site. Je ziet de kleine meter in de rechter benedenhoek. .. het vertelt je de totale grootte van je pagina en de laadtijd. Zeer nuttige extensie, maar hiervoor is wel de Firebug-extensie vereist.

Dummy Lorem Ipsum

De Dummy Lipsum generator-extensie zal dummy-inhoud voor u genereren op basis van de beroemde Lorem Ipsum-tekst die erg handig is voor het opmaken van nep-inhoud op uw site.

Screengrab!

De Screengrab-uitbreiding laat je screenshots van pagina's maken, maar kan iets doen dat een reguliere screenshot-tool niet kan - het kan een afbeelding van de hele pagina maken, niet alleen het zichtbare deel.

Er zijn talloze andere extensies die je kunt gebruiken, maar deze zijn de beste van het beste van alles wat ik heb gezien. Als u een andere extensie heeft die u regelmatig gebruikt, laat dan een vermelding achter in de opmerkingen.

Op dit punt hebt u Firefox nu de ultieme webontwikkelingstool. Neem de tijd om te leren hoe je met name Firebug gebruikt.