De acordo com as Leis 12.965/2014 e 13.709/2018, que regulam o uso da Internet e o tratamento de dados pessoais no Brasil, ao me inscrever na newsletter do portal DICAS-L, autorizo o envio de notificações por e-mail ou outros meios e declaro estar ciente e concordar com seus Termos de Uso e Política de Privacidade.
Colaboração: Diego Boot
Data de Publicação: 27 de julho de 2016
O Brackets é um software para criação e edição de arquivos (IDE) HTML, CSS e JS. Através de configuração é possível trabalhar com PHP. Com ele é possível criar um site e testar o que está sendo feito através do recurso de atualização em tempo real, diretamente no Chrome. Além dos recursos nativos, o Brackets ainda possui um instalador de extensões que ajuda a aumentar e personalizar os recursos.
O programa da Adobe é open source e pode ser baixado e utilizado livremente. Além de GNU/Linux, suporta também Windows e Mac e suas extensões são distribuídas de forma gratuita. Também é possível instalar temas para deixá-lo com uma aparência personalizada.
O Brackets é um leve e poderoso editor de textos moderno. Foram combinadas ferramentas visuais no editor para que o usuário tenha acesso e ajuda adequada sempre que precisar. Com novos recursos e extensões disponibilizados a cada 3-4 semanas, ele facilita bastante o desenvolvimento Front-end.
Ao digitar-se o arquivo CSS, ele apresenta opções de autocomplete referente a camada clicada. Ao iniciar a digitação de background , por exemplo, aparece uma sugestão de salvar como imagem a layer selecionada (ele cria a pasta images e salva dentro delas) já inserindo o restante do código automaticamente; que seria url(caminho/para-imagem.jpg); .
Quando uma camada de texto é selecionada, aparece a opção de colocar automaticamente o font-size, a font-family, o line-height e outras. As configurações que foram setadas no Photoshop, podem ser inseridas automaticamente, -não é necessário- alternar entre as janelas do editor e do Photoshop. Fonte, tamanho, cor, são disponibilizadas automaticamente na forma de autocomplete.
Esse recurso permite que o resultado da digitação seja visto, sem reload, (recarregar) a página. O Brackets vai mostrando o resultado em tempo real, funcionando quando a alteração for feita em um arquivo HTML ou CSS, sendo que no JavaScript ele precisa recarregar a página.
Para trabalhar no CSS aplicado a um ID específico, o Brackets permite a expansão de um trecho de código. Com o cursor do mouse em cima deste ID, pressione Ctrl+E e o Brackets irá mostrar todos os seletores CSS com este ID em um editor em série dentro da janela atual. O código pode ser editado paralelamente ao trabalho.
Divide o editor em duas telas, podendo ser na horizontal ou vertical. (Está em View)
╏ Instalar Brackets no Ubuntu e derivados
Para instalar o editor de código para web Brackets no Ubuntu e ainda poder receber automaticamente as futuras atualizações dele, você deve fazer o seguinte:
⋕ Abra um terminal [ no Unity use as teclas CTRL + ALT + T ]
⋕ Instale o Brackets usando os comandos abaixo
sudo add-apt-repository ppa:webupd8team/brackets [ENTER] sudo apt-get update [ENTER] sudo apt-get install brackets [ENTER]
⋕ Caso queira DESINSTALAR o Brackets
sudo add-apt-repository ppa:webupd8team/brackets --remove [ENTER] sudo apt-get remove Brackets [ENTER] sudo apt-get autoremove [ENTER]
✍ Assine o canal । Subscribe
✍ YouTube: http://bit.ly/Taverna_Linux
⑄ Redes Sociais । Social Networks
⑄ Google+: http://bit.ly/g_plus_taverna
⑄ Facebook: https://fb.me/tavernalinux
⑄ Quitter: https://quitter.se/tavernalinux
⑄ Tumblr: http://tavernalinux.tumblr.com
⑄ Twitter: https://twitter.com/tavernalinux
⑄ Medium: https://medium.com/@tavernalinux
⑄ Instagram: https://instagram.com/tavernalinux
║ Creative Commons
║
║ Músicas pro Lyvo 📼
║ Ozymandias Part I e II https://soundcloud.com/lyvo
║
║ Intro por Simon OZ prod no ViMeO 🎥
║ Firefox in Motion https://vimeo.com/3183064