robsonmoulin@gmail.com
(11) 9.8655-2539

Dicas para você começar a utilizar o editor de texto Atom


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 Darkhttps://atom.io/themes/monokai-dark
Um dos temas mais utilizados por desenvolvedores.

 

Packages

Minimaphttps://github.com/atom-minimap/minimap
Cria o mapa de navegação do código na direita, semelhante ao sublime

Emmethttps://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.

Toolbarhttps://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 Beautifyhttps://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 Selectedhttps://atom.io/packages/highlight-selected
Semelhante ao Sublime este package deixa os textos selecionados com outline facilitando a visualização.

Pigmentshttps://atom.io/packages/pigments
Mostra a cor diretamente no códigos de cores, um excelente color view.

Color Pickerhttps://atom.io/packages/color-picker
Seleciona cores diretamente no editor, e converte também rgba e rgb além do hexa.

Auto Prefixerhttps://atom.io/packages/autoprefixer
Adiciona os prefixos dos user-agents -moz -webkit etc… automaticamente no css quando necessário;

Autocomplete Pathshttps://atom.io/packages/autocomplete-paths
Mostra o caminho das pastas na hora de inserir imagens no html.

Autocomplete Javahttps://atom.io/packages/autocomplete-java
Completa código de java, facilitando a criação dos códigos e evitando erros de fechamento.

Auto Close HTMLhttps://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.

publicidade
publicidade
publicidade

Agora que você terminou de ler esse artigo

Que tal visitar nosso portfólio ou conhecer todas as soluções que oferecemos para você.