Para quem não conhece o editor de texto Atom é uma ferramenta para front-ends e devs muito semelhante ao Sublime mais com alguns diferenciais que fará você mudar sem pensar. O Atom é open-source, criado pela comunidade do Github, possui muitas características do Sublime e uma interface bem amigável quando se diz respeito ao instalador de temas e plugins.
Já existe muitos posts na internet falando sobre o Atom mas também quero deixar minha contribuição e dicas para resolver problemas de proxy, dicas e pacotes essenciais para front-end.
Proxy
Em algumas empresas para acessar a internet é necessário fazer o login na rede e acessar os sites através do browser, no Atom isso também ocorre quando tentamos procurar por themes e packages através do instalador da ferramenta, se não for configurado corretamente o editor não consegue acessar os repositórios para fazer as instalações.
Caso você tenha este problema siga os passos abaixo para ter acesso, é bem simples.
Criar na raiz da pasta c:\users\nomedousuario\.atom um arquivo chamado .apmrc, com o seguinte sintaxe
http-proxy=http://usuario:senha@proxy.dominio.com:3128
https-proxy=http://usuario:senha@proxy.dominio.com:3128
Fácil assim, agora o Atom já consegue acessar a internet para fazer o download dos pacotes e temas para instalar.
Dicas
Remover a Linha Guia: Desinstalar o package: wrap-guide
Inserir guias de identação de código: Entrar em configurações File>Settings, na aba Settings e habilitar Show Indent Guide
Para instalar os Package: Acesse no menu Packages > Settings View > Open, clique na aba install e digite o nome do plugin abaixo na busca.
Themes
Monokai Dark – https://atom.io/themes/monokai-dark
Um dos temas mais utilizados por desenvolvedores.
Packages
Minimap – https://github.com/atom-minimap/minimap
Cria o mapa de navegação do código na direita, semelhante ao sublime
Emmet – https://atom.io/packages/emmet
Um dos melhores plugins para desenvolvedores front-end, o emmet é um facilitador de código, completando sintaxe e multiplicando códigos de forma rápida.
Toolbar – https://atom.io/packages/tool-bar
Cria uma barra lateral bem interessante onde você pode trocar de lugar com ícones de atalhos de funções dos menus ou que você mesmo crie.
Atom Beautify – https://atom.io/packages/atom-beautify
Identa ou formata códigos CSS, JS, HTML e quase todas as linguagens suportadas pelo ATOM. Ele é parecido com o Beautify do Sublime Text. Deixa o código mais bonito.
Highlight Selected – https://atom.io/packages/highlight-selected
Semelhante ao Sublime este package deixa os textos selecionados com outline facilitando a visualização.
Pigments – https://atom.io/packages/pigments
Mostra a cor diretamente no códigos de cores, um excelente color view.
Color Picker – https://atom.io/packages/color-picker
Seleciona cores diretamente no editor, e converte também rgba e rgb além do hexa.
Auto Prefixer – https://atom.io/packages/autoprefixer
Adiciona os prefixos dos user-agents -moz -webkit etc… automaticamente no css quando necessário;
Autocomplete Paths – https://atom.io/packages/autocomplete-paths
Mostra o caminho das pastas na hora de inserir imagens no html.
Autocomplete Java – https://atom.io/packages/autocomplete-java
Completa código de java, facilitando a criação dos códigos e evitando erros de fechamento.
Auto Close HTML – https://atom.io/packages/autoclose-html
Completa o código HMTL criando a tag de fechamento.
E é isso pessoal, espero que tenham gostado, se tiverem mais dicas postem nos comentários.
Gostou desse artigo? Dá uma forcinha!
A única forma que consigo remunerar meu site é através de anúncios, não esqueça de conferir!