Um número crescente de desenvolvedores da web mudou para o Firefox nos últimos meses, impulsionado pelo lançamento do Firefox Quantum depois que o Mozilla melhorou o desempenho para ficar no mesmo nível do Google Chrome.
Embora o Firefox ofereça ferramentas amigáveis ao desenvolvedor por padrão com recursos inovadores como o inspetor CSS Grid, recursos mais interessantes ainda podem ser adicionados ao navegador por meio do ecossistema de complementos.
Com isso em mente, aqui estão alguns plug-ins que você deve experimentar se estiver usando o Firefox como desenvolvedor web.
1. Relatório de compatibilidade
Te ajuda Relatório de Compatibilidade Para identificar possíveis problemas de compatibilidade do navegador da web ao desenvolver sites ou aplicativos da web. Por enquanto, isso só funciona para CSS.
Assim que o plugin for instalado, um novo painel de "compatibilidade" será adicionado às ferramentas do desenvolvedor. A partir daí, você poderá ver o desempenho de qualquer site específico em cada um dos principais navegadores
As versões do navegador sem problemas de compatibilidade são coloridas em verde, apenas algumas versões são amarelas e aquelas com várias versões são coloridas em vermelho. Você pode pesquisar versões específicas do navegador para descobrir as regras CSS exatas que causam problemas.
2. JSON Lite
Se você trabalha com APIs JSON com frequência, pode achar entediante visualizar dados JSON em um navegador. Isso ocorre porque o navegador não o formata corretamente por padrão, o que dificulta a leitura.
Trabalho JSON Lite Corrige esse problema formatando as respostas JSON e JSONP com destaque de arquitetura adequado e recurso de exibição de erro que é útil ao examinar grandes dados JSON.
Se você não precisa de todos os recursos que o JSON Lite oferece, pode apenas habilitar o visualizador JSON integrado no Firefox digitando “about: config” na barra de endereço e, em seguida, procurando por devtools.jsonview.enabled. Defina como "verdadeiro" clicando duas vezes na opção e carregue qualquer arquivo JSON no navegador para ver o resultado.
3. Reagir Devtools
React é uma das bibliotecas mais populares hoje no ecossistema de desenvolvimento web. Se você desenvolver Aplicativos da web com React , Você verá muito valor em usar a extensão do navegador para depurar seu código.
Depois de instalá-lo, você poderá verificar o código React em qualquer site que o utilize. O ícone de complemento aparecerá na barra de ferramentas do seu navegador e você também obterá uma guia "Interagir" ao lado de outros painéis do DevTools. O painel React permitirá a varredura da árvore React, incluindo hierarquia de componentes, struts, status e muito mais.
Você também pode instalar Devtools Vue.js و Redux DevToolsComment Em caso de desenvolvimento de alguma das bibliotecas.
4. Fontanelo
Fornece Fontanelo Maneira muito rápida de localizar fontes em qualquer site. Com esta extensão, você não precisa mais abrir devtools apenas para descobrir qual fonte o site está usando. Fontanello exibe estilos básicos de tipografia de texto no menu de contexto do botão direito do Firefox.
5. Wappalyzer
Você já se perguntou quais técnicas são usadas para criar seu site favorito? Pode te salvar Wappalyzer Esta informação está com um clique. Ele pode descobrir vários sistemas de gerenciamento de conteúdo, plataformas de comércio eletrônico, servidores da web, estruturas JavaScript, programas de banco de dados, ferramentas analíticas e muito mais.
Embalagem
Se você deseja aumentar seu fluxo de desenvolvimento, não pode errar com nenhuma das adições listadas acima. Não se esqueça de compartilhar seus clipes favoritos na seção de comentários abaixo.
