Este artigo é dedicado ao mais recente editor de texto open source da Adobe, o Brackets. O projeto, desenvolvido pela Adobe em parceria com desenvolvedores externos, tem características e funcionalidades que batem de frente com outros editores de texto gratuitos do mercado, como o Sublime, Notepad++ e o Gedit. Mas o objetivo aqui não é fazer comparações, mas sim apresentar as principais funcionalidades.
Primeiramente é preciso ter em mente que o Brackets é um editor focado em desenvolvedores front end. Por esta razão, ele é focado em HTML, CSS e JavaScript (tecnologias que foram base para seu desenvolvimento). Além disso, como já foi dito, o Brackets é um projeto open source, ou seja, está aberto (está sob licença MIT) para todos desenvolvedores interessados em contribuir ou adapta-lo (existem várias issues abertas na página do GitHub). Ele também possui versões para Windows, Linux e Mac e é bem leve. Além disso, o Brackets possui suporte a pré-processadores, como LESS e SCESS e à edição inline, ou seja, é possível, por exemplo, editar um CSS dentro do próprio HTML, sem a necessidade de abrir uma nova janela (que convenhamos, é uma coisa bem chata). Mas o principal aspecto é que o Brackets é extensível. Falaremos mais sobre isso.
Principais Funcionalidades
Extract: Através do plugin Extract é possível tratar arquivos com extensão PSD (Photoshop Document). De forma resumida, é possível extrair todas as informações que você precisa sobre a composição e traduzi-la em código: espaçamentos, bordas, margens, etc. Ele dispensa o uso do Photoshop para extrair as informações de forma manual e faz de forma automática e sofisticada.
Split mode: Este modo permite dividir o seu monitor em múltiplas telas, seja na vertical ou na horizontal. É ideal para quem trabalha com front end, como por exemplo: Editar HTML e JavaScript ao mesmo tempo. Esta funcionalidade fica ainda melhor combinada com a característica abaixo.
Line Preview: Esta funcionalidade é uma das que achei mais interessantes. Ela permite que você visualize os resultados das suas alterações no código HTML de forma automática, sem que seja necessário dar reload na página, de forma semelhante a quando utilizamos no modo inspect dos navegadores atuais. No entanto, existem algumas limitações:
- Só funciona para alterações em CSS e HTML. Para alterações no JavaScript é necessário dar reload na página.
- Funcionalidade somente compatível com o navegador Google Chrome.
Para quem utiliza dois (ou mais) monitores (como eu), é realmente fantástico.
Extensões
Como já citei, o Brackets é extensível. Já existem diversas extensões excelentes (Além do próprio Extract), como:
- Brackets Git: Dá suporte completo ao Git dentro do editor
- JSHint: Permite esconder trechos já editados do arquivo ou formatam os documentos JavaScript, HTML e CSS
- Emmet: Disponibiliza abreviações para agilizar o desenvolvimento de HTML e CSS
- Indent Guide: Facilita a leitura do código. Ele cria uma linha guia ligando a tag de abertura e a tag de fechamento de determinado elemento
Segue uma lista das 11 extensões mais baixadas da última semana (de acordo com o site): Emmet (9900), Code Folding (4004), Beautify (3003), Extract for Brackets (2480), LESS Autocompile (2177), Breckets Git (2135), QuickDocsPHP (2011), Brackets Outline List (1909), JSHint (1828), CSSLint (1764) e HTML Wrapper (1589).
Minhas impressões foram muito boas. Estou utilizando há mais de uma semana e não pretendo parar. A única coisa que me incomodou foram os atalhos do teclado, que são um pouco diferentes do que estou acostumado (uso bastante o Gedit). Mas, fora isso, estou aproveitando bastante para experimentar temas e extensões diferentes.
Se você tem alguma dúvida ou se já utilizou e quer deixar sua impressão, utilize a área de comentários abaixo!
4 Comentários
Olá Diego, também achei muito interessante a esse novo editor, mas o que decepcionou bastante foi o fato dele só dar suporte ao charset UTF-8, e ele não permite nem que você abra a página para converter o formato, será que não vão dar suporte a outros tipos de charset? conhece alguma extensão para isso?
Fala Felipe, tudo bom? Então cara, realmente existem algumas coisas faltando no editor… Mas ele ainda é bem recente. A comunidade está bem ativa e toda semana saem vários plugins… Eu encontrei esse aqui (Az – Encoding), mas pelo que me parece também já está no backlog do produto este requisito 🙂 https://trello.com/c/DShzQztM/731-support-encodings-other-than-utf-8
Forte abraço!
Meu único problema também é o lance dos encodes.
Tem até uma extensão que permite abrir arquivos de qualquer encode, porém a gente altera o encode para o desejado, salva e edita o arquivo com caráteres especiais como: çãíéá e tudo funciona muito bem. Porém quando a gente abre o arquivo novamente, não acontece com todos, mas o encode está alterado e não fica o encode que escolhemos.
Essa extensão também não permiti que o Brackets forçe um encode padrão para novos e arquivos abertos.
O que ta sendo uma pena para mim, pois toda vez quando vou abrir um arquivo tenho que ativar o menu da extensão e escolher o encode desejado.
Oi, alguns atalhos meus não funcionam como o CTRL+SHIFT+T(ou A) para colocar uma tag entre textos rapidamente. Há alguma opção para eu corrigir isso ou trocar os atalhos?