Todos os desenvolvedores constroem seu próprio conjunto de ferramentas quando se trata de lidar com vários projetos. As ferramentas que um desenvolvedor da Web usa podem reduzir o tempo necessário para concluir um site ou aplicativo da Web e podem facilitar o manuseio das tarefas.
Ferramentas inteligentes são essenciais para o fluxo de trabalho de todo desenvolvedor bem-sucedido, portanto, se você deseja aprimorar seu kit de ferramentas com uma nova caixa de truques, é uma boa ideia ler este artigo cuidadosamente do começo ao fim.
Não faltam editores de código que você pode usar para facilitar seu trabalho. Decidir entre eles se torna muito mais difícil quando há tantas opções esperando por você.
Portanto, apresentaremos uma opção que se destaca das demais: Sublime Text. Este é um dos editores de código mais usados no mercado e é o preferido por milhares de programadores, desenvolvedores web e web designers.
O que é tão impressionante no Sublime Text é sua flexibilidade. Você pode facilmente estender o editor de código usando plugins Sublime Text criados para quase todos os propósitos imagináveis. E você pode até criar pacotes personalizados que melhorarão visivelmente seu fluxo de trabalho e aumentarão sua produtividade.
Continue lendo mais neste artigo criado por nossa equipe em wpDataTables e conheça alguns dos melhores pacotes Sublime Text, como eles funcionam e como você pode usá-los.
Plugins Sublime Text: Instalando Pacotes
Antes de listar os plugins Sublime Text que consideramos relevantes para todos os web designers, você deve aprender a instalar pacotes neste editor de código. Aqui estão os passos que você precisa seguir:
- Baixe o arquivo zip do repositório de pacotes. Você pode fazer isso na página do GitHub do pacote.
- Extraia os arquivos na pasta Sublime Text Packages. Você deve encontrá-lo em: {{ user name }}AppDataRoamingSublime Text {{ version }}Packages
Ou
- Instale o pacote através do Controle de Pacotes oficial do Sublime Text Clique no link e copie o código adequado à versão do Sublime Text que você possui.
- Cole o código no console do Sublime Text, que você pode acessar pressionando CTRL + ~.
- Reinicie seu editor de código, abra a janela de comando pressionando CTRL + Shift + P e digite “Package Control: Install Package" (ou apenas “Install Package” – o preenchimento automático mostrará as opções desejadas)
Depois que o pacote estiver instalado, não faça nenhuma alteração em seu arquivo de configuração padrão, a menos que você saiba exatamente o que está fazendo. Os pacotes Sublime Text destinam-se principalmente a serem personalizados com o uso de arquivos de substituição separados para que suas alterações não sejam perdidas quando os pacotes forem atualizados.
Plugins de texto sublime que todos os desenvolvedores da Web devem experimentar
Falando sobre a extensibilidade do editor de código, seria útil listar alguns dos melhores Plugins de Texto Sublime e como eles podem ajudá-lo a se tornar um desenvolvedor melhor no menor tempo possível.
Esperamos que você ache esses plugins úteis e relevantes para o seu trabalho. Aqui está a lista:
Controle de pacote
O Sublime Text Package Control é provavelmente a ferramenta mais popular disponível para este editor de código. Ele permite baixar, instalar e atualizar pacotes diretamente da interface do Sublime Text.
Embora “plugin” e “pacote” sejam frequentemente usados de forma intercambiável, os pacotes incluem plugins, menus, trechos e outros bits e bobs que podem ser usados para estender o Sublime Text ao seu gosto.
Em vez de baixar os arquivos do pacote por conta própria e instalá-los na pasta correta, deixe este plugin fazer tudo por você sem sair do Sublime Text. Se você é um programador, pense nisso como pip para Python ou npm para node.js.
Alinhamento
Alinhamento faz exatamente o que o nome diz: é um daqueles plugins Sublime Text que torna seu trabalho 10 vezes mais fácil, alinhando seu código para torná-lo mais limpo e fácil de ler. Funciona muito bem com PHP, JavaScript, CSS e muito mais.
Você pode alinhar seções, seleções de várias linhas ou todo o seu código com o uso de delimitadores como “=”. Mesmo que você pense que não ajuda muito, uma vez que você o use, você ficará viciado em como ele é útil.
Emmet
Entre os plugins Sublime Text mais usados está o Emmet, um plugin simples que pode melhorar a produtividade de qualquer desenvolvedor ajudando em seu fluxo de trabalho CSS e HTML.
Por exemplo, se você escrever html:5 e pressionar CTRL + E enquanto estiver usando o Emmet, você terá acesso a um modelo básico de página HTML5 para trabalhar. O plugin é simples, mas extremamente eficaz e definitivamente melhorará seu trabalho.
Alterar citações
Você odeia lidar com citações? Parabéns, você é um dos milhões de desenvolvedores que também têm dificuldade em mantê-los consistentes. ChangeQuotes irá ajudá-lo.
Ele pode facilmente converter aspas simples/duplas e reescapá-las. Se você deseja alterar aspas, coloque o cursor dentro do texto citado e abra a paleta de comandos. Execute o plug-in e você não precisará mais selecionar a linha inteira para alterar as cotações. É muito mais rápido assim!
Aprimoramentos da Barra Lateral
Este plugin Sublime Text adicionará alguns novos recursos ao menu da barra lateral. Por exemplo, você pode criar um novo arquivo muito mais rápido enquanto permanece na pasta do projeto atual. Você também pode mover arquivos e pastas com mais facilidade, duplicá-los conforme necessário e abrir arquivos no Finder ou no navegador.
SublimeEnhancements adiciona uma série de recursos úteis da barra lateral que ajudarão você a gerenciar seu projeto com mais eficiência. Instale-o para descobrir todas as funções úteis.
SublimeLinter
Se você é um usuário do Sublime Text 3, você vai adorar o SublimeLinter. Poucos plugins do Sublime Text foram atualizados para a versão mais recente do editor, então é sempre bom ver que os desenvolvedores de plugins se concentram em atualizar seus produtos. Em vez de ter todos os seus linters em um pacote, este plugin permite que você instale os que você usa regularmente.
Basicamente, o SublimeLinter fornece uma estrutura para usar para fazer o linting do código. Caso você não saiba, linting representa o processo de sinalizar sintaxe não portátil ou incorreta em seu código. Em palavras mais simples, ele avisa quando o código está cheio de bugs.
SublimeGit
Trabalhar com software de controle de versão é comum para desenvolvedores. O mais popular é o Git. Para aqueles que estão cansados de salvar arquivos de texto e voltar a um terminal para executar alguns comandos do Git, o SublimeGit será a resposta. Este plugin Sublime Text permite que você execute todos os seus comandos Git dentro do editor de texto.
Ao usar o SublimeGit, os desenvolvedores podem fazer mais em menos tempo, aumentando muito sua produtividade. Você não precisará alternar entre o editor de código e a linha de comando.
Isso costumava estar disponível apenas como um plugin pago, mas no ano passado tornou-se de código aberto. Ele possui vários recursos que você achará úteis, bem como os documentos do SublimeGit, que o ajudarão a entender e usar o plug-in.
GitGutter
Você sempre pode executar comandos do Git dentro do próprio Sublime Text, mas não é a maneira mais rápida de lidar com essa tarefa. O Sublime Text faz você executar um comando separado, em vez de permitir que você visualize as alterações em tempo real. Bem, é aqui que entra o GitGutter.
O GitGutter é semelhante ao Atom de alguns pontos de vista. Ele adiciona os mesmos tipos de funcionalidades ao Sublime Text, o que significa que você pode começar a adicionar dicas de diferenças à calha da sua barra lateral. Ao passar o mouse sobre os indicadores da barra lateral, você obtém acesso a pop-ups de diferenças muito úteis.
SASS
Destacar é fundamental para perceber erros e bugs rapidamente. Para os desenvolvedores, corrigir erros de forma rápida e eficiente é uma necessidade absoluta. SASS ajuda você a fazer isso. Ele destaca a sintaxe SASS e SCSS e ajudará qualquer desenvolvedor de CSS que use essas linguagens de extensão.
GitHubinatorGenericName
Aqueles que usam repositórios GitHub/Bitbucket devem experimentar o GitHubinator. Este plugin mostra o texto selecionado no repositório remoto. Assim, o texto que você está procurando é destacado e você pode simplesmente clicar no menu de contexto para iniciar a página da web correspondente no navegador.
Como no caso de outros plugins Sublime Text listados aqui, o GitHubinator ajuda os desenvolvedores a economizar tempo e evitar ações repetitivas.
GitOpenChangedFiles
Como você pode ver, este plugin é usado para abrir arquivos alterados de um repositório Git. Você simplesmente precisa instalá-lo e iniciar o plug-in para abrir os arquivos que você alterou anteriormente em sua ramificação do Sublime Text.
Não é muito um plugin, mas aqueles que precisam dessa função vão achar muito útil.
terminal
Você sabe quanto tempo demora o processo de abertura de pastas de projetos com o Sublime Text. O Terminal permite abrir as pastas diretamente do Sublime Text na plataforma com uma única tecla de atalho. Não é conveniente?
Ao executar linhas de comando em uma determinada pasta, você precisa passar por algumas etapas que são demoradas e bastante estressantes. O Terminal reduz essas etapas para a tecla de atalho CTRL + SHIFT + T.
Sublime REPL
Usar o SublimeREPL tornará o trabalho do programador 10 vezes mais fácil. Este plugin permite que você execute intérpretes das linguagens mais comuns, incluindo NodeJS, Python, Ruby, Scala ou Haskell.
Você pode executar um intérprete em qualquer um desses idiomas e muito mais, diretamente do Sublime Text. Dê uma olhada nas outras funções do plugin para uma compreensão mais profunda do que ele pode fazer.
Babel
Se você precisar de definições de linguagem para Javascript ES6+, você deve usar o Babel. Poucos plugins Sublime Text oferecem boas definições de linguagem, especialmente para sua versão mais recente. O Babel foi desenvolvido especificamente para o Sublime Text 3 e não suporta versões anteriores. Ele também suporta a sintaxe React JSX.
TodosAutocompletar
Por padrão, o Sublime Text usa a opção de preenchimento automático apenas em palavras presentes no arquivo atual. Para expandir essa funcionalidade para todos os arquivos abertos, você pode usar o AllAutocomplete, um plug-in que pesquisa todos os arquivos que você abriu e encontra correspondências, além de sugerir palavras.
CSSComb
CSSComb classifica as propriedades CSS para que seu código fique mais limpo e fácil de ler. Ele coloca o código na ordem certa e permite que você personalize suas propriedades sem muita complicação. É um plugin útil para aqueles que trabalham em equipes onde nem todos os membros escrevem código da mesma maneira.
MarkdownPreview
Muitos desenvolvedores estão acostumados a criar arquivos Markdown no GitHub, StackEdit ou Markable, na nuvem. Se você é um escritor da velha guarda e prefere manter seus arquivos localmente, experimente o MarkdownPreview.
Você também pode instalar o MarkdownEditing e destacar seu código Markdown.
DocBlockrGenericName
Em algumas empresas, todas as diretrizes de codificação devem ser respeitadas religiosamente. Isso pode pressionar os ombros dos desenvolvedores. O DocBlockr facilita isso criando comentários para seu código, analisando as funções, variáveis ou parâmetros e adicionando itens básicos automaticamente.
Você só terá que digitar /e o plugin faz o trabalho para você.
Trechos CSS materializados
MaterializeCSSisa memorável framework front-end criado pelo Google. É moderno, totalmente responsivo e pronto para uso por todos os designers e desenvolvedores. Este plugin Sublime Text irá ajudá-lo a usar Materialize CSS dentro do editor de texto com o uso de snippets comuns.
Snippets CSS materializados adicionam componentes CSS diretamente no editor de código, para que você possa acessá-los com comandos básicos. Snippets CSS materializados podem economizar muito tempo e energia que normalmente seriam usados digitando a sintaxe manualmente e adicionando componentes CSS separadamente.
Formato padrão
Sem formatação, seu código parecerá confuso e difícil de passar. O StandardFormat permite que você crie uma base de código muito mais sólida enquanto ajuda as pessoas a lerem seu código com mais rapidez e eficiência sempre que precisarem.
O plugin é baseado na biblioteca Standard Format JS, que será aplicada ao que você escreve. Todo mundo sabe ler o formato JS tradicional, então este plugin prova ser bastante útil para desenvolvedores.
Trechos de consulta de mídia CSS
As consultas de mídia são usadas para desenvolver aplicativos e software para dispositivos móveis ou tamanhos de tela escalonáveis. Sem essas consultas, você não pode transformar seu projeto em um compatível com dispositivos móveis.
O CSS Media Query Snippets tem como objetivo ajudá-lo nessa tarefa, oferecendo modelos pré-escritos para consultas de mídia. Você pode apenas usar o modelo para fazer modificações.
Shell Exec
Todos sabemos que o acesso ao Shell é um tópico controverso por causa das configurações inseguras que os servidores executavam no passado. Ser vítima de hackers era muito mais comum quando os comandos do Shell Exec podiam ser acessados do exterior, abrindo vulnerabilidades na plataforma.
Este plugin ajuda você a executar comandos shell dentro do Sublime Text 3, considerando que a Internet está muito mais segura agora. É uma boa maneira de economizar tempo, mas não se esqueça de definir as configurações do firewall e descobrir os padrões de acesso para evitar a situação acima.
Laravel BladeHighlighter
Laravel é um framework de código aberto para PHP e influenciou o desenvolvimento do PHP de forma bastante visível. O Laravel usa o Blade Engine, uma sintaxe que permite desenvolver novos softwares sobre o framework.
O Sublime Text não seria o mesmo sem o Laravel Blade Highlighter se você usar o Laravel diariamente. Com mais de 300.000 instalações, este plugin não deve ser esquecido por nenhum desenvolvedor PHP.
Considerações finais sobre esses plugins de texto sublime
O Sublime Text é forte o suficiente por si só, mas plugins e pacotes o tornam ainda mais poderoso. O maior benefício desses plugins é economizar seu tempo, ajudando você a personalizar o Sublime Text para atender às suas necessidades, requisitos e tarefas do dia-a-dia.
Todo desenvolvedor prefere uma certa rotina de codificação, e você pode sustentar essa rotina selecionando os plugins Sublime Text que funcionam melhor para sua situação. Escolha aqueles que fazem sentido para o seu modo de trabalho e seu trabalho. Isso tornará tudo mais eficiente e menos demorado.
Boa sorte com suas tarefas de codificação!
Se você gostou de ler este artigo sobre plugins do Sublime Text, você deve conferir este sobre os temas do Sublime Text.
Também escrevemos sobre alguns assuntos relacionados, como os melhores pacotes Atom e como se tornar um desenvolvedor front-end.