Share
Wat je gaat creërenFirefox Developer Edition is door Mozilla uitgebracht tijdens de tiende verjaardag van Firefox vorig jaar. Onlangs zijn 64-bits versies van Firefox Developer Edition ook beschikbaar voor Windows, Linux en Mac OS X. Firefox Developer Edition biedt gemakkelijke toegang voor een breed scala aan ontwikkelaarstools die helpen bij het eenvoudig debuggen en helpen bij sneller en professioneler werken ontwikkeling. U kunt de nieuwste versie van de Firefox Developer Edition hier downloaden. Laten we eens kijken naar enkele van de geweldige functies van de Firefox Developer Edition.
Met WebIDE kunt u webapps maken, bewerken, testen of debuggen door ze in de Firefox OS-simulator uit te voeren. Als u een nieuwe web-app aanmaakt, maakt deze ook een basis-app-boilerplate of een completere boilerplaat voor u samen met een juiste directorystructuur. Met WebIDE kunt u Firefox Devtools ook verbinden met vele andere webbrowsers, zoals Safari (iOS), Firefox (Android) en Chrome (Android).
Responsive Design View in Firefox kan worden opgeroepen door op Ctrl + Shift + M te drukken. U kunt de responsiviteit van uw webtoepassing controleren met behulp van dit hulpprogramma. Het biedt een aantal opties, zoals het instellen van de grootte van het apparaat dat u wilt emuleren, het draaien van het scherm (verschuiven van staande naar liggende modus), simuleren van aanraakgebeurtenissen en het nemen van een screenshot van de webpagina in de responsieve modus.
De Eyedropper Tool is echt een geweldige tool die je helpt om de hexadecimale waarde van elke kleur op een webpagina te weten (net als de pipet in Photoshop). Dit helpt bij het vinden van de kleur van elk element of beeld dat via Element Inspector door zijn code moet bladeren. Als u op de kleur klikt, wordt de waarde naar uw klembord gekopieerd!
We hebben allemaal met de Element Inspector samengewerkt, wat is browserinspecteur nu eigenlijk? Welnu, Browser Inspector wordt gebruikt voor het debuggen van de Firefox-browser zelf. Als u de kleur van de URL-balk wilt wijzigen of bijvoorbeeld de curve van de tabbladen wilt wijzigen met niet-permanente resultaten, dan kunt u dat doen via de browserinspector. Hoewel hetzelfde resultaat kan worden behaald met Scratchpad, is Browser Inspector geweldig als u geen Firefox-ontwikkelaar bent of als u alleen uw wijzigingen wilt testen!
Dit is naar mijn mening de meest geweldige functie van de Firefox-ontwikkelaarstools. U kunt naar de 3D-weergave van een website kijken, waarbij elk hoogteblok een element vertegenwoordigt, in volgorde van hun nesting in de websitecode. Dit helpt je om te weten welke elementen in welk element zijn genest. Je kunt de 3D-weergave openen door op Ctrl + Shift + C te drukken en vervolgens het rechthoekige pictogram aan de rechterkant van het nieuw geopende paneel te selecteren.
U kunt het Scratchpad openen door op Shift + F4 te drukken. Scratchpad kan worden gebruikt om clusters van JavaScript-code uit te voeren en de resultaten te bewerken, uit te voeren en te onderzoeken. De manier waarop het verschilt van de Browserconsole is dat Browser Console is ontworpen voor het interpreteren van een enkele coderegel tegelijk, maar met Scratchpad kunt u met grotere hoeveelheden code werken op verschillende manieren, afhankelijk van hoe u de code wilt gebruiken. uitgang.
De Firefox Developer Edition biedt een breed scala aan hulpmiddelen voor het maken, debuggen, bewaken van prestaties, het debuggen van de browser en het uitbreiden van de DevTools zelf. Het uitleggen van alle tools valt buiten het bestek van dit artikel. U kunt hier echter de volledige lijst met hulpmiddelen bekijken. We hopen dat de introductie van de bovengenoemde hulpprogramma's u helpt bij uw dagelijkse webontwikkeling.
Accentsconagua