Description: Um guia interativo de primeiros passos para Brackets.

# PRIMEIROS PASSOS COM BRACKETS

## Este é o seu guia!

Bem-vindo a uma superprecoce pré-visualização de Brackets, um novo editor open-source para a próxima geração da web. Nós somos grandes fãs dos padrões e queremos construir melhores ferramentas para JavaScript, HTML e CSS e relacionadas tecnologias abertas da web. Este é o nosso humilde começo.

Você está olhando para uma versão precoce de Brackets. De muitas maneiras, Brackets é um tipo diferente de editor. Uma diferença notável é que este editor é escrito em JavaScript. Assim, enquanto Brackets poderia não estar pronto para seu uso no dia-a-dia ainda, estamos usando-o todos os dias para criar Brackets.

## Nós estamos tentando algumas coisas novas

### Edição Rápida de CSS e JavaScript

Ao editar HTML, use o atalho `Cmd/Ctrl + E` para abrir um editor rápido embutido que exibe todos os CSS relacionados. Faça um ajuste ao seu CSS, pressione `ESC` e você estará de volta editando HTML. Ou simplesmente deixe as regras CSS abertas e elas se tornarão parte de seu editor HTML. Se você pressionar `ESC` fora de um editor rápido, todos eles vão recolher. Sem mais comutação entre documentos perdendo seu contexto.

`Quer vê-lo em ação? Coloque o cursor sobre o tag acima e pressione `Cmd/Ctrl + E`. Você deverá ver um editor rápido de CSS aparecer acima. À direita, você verá uma lista de regras CSS que estão relacionadas com esta tag.Simplesmente role as regras com `Alt + Up/Down` para encontrar o que deseja editar.`

### Visualizar as alterações CSS ao vivo no navegador

Você sabe aquela "dança salvar/recarregar" que temos feito há anos? Aquela onde você faz mudanças no seu editor, clica em salvar, alterna para o navegador e então recarrega a pagina para finalmente ver o resultado Com Brackets, você não precisa fazer essa dança.

Brackets vai abrir uma conexão ao vivo com o seu navegador local e vai empurrar atualizações CSS enquanto você digita! Você já deve estar fazendo alguma coisa como esta hoje com ferramentas baseadas em navegador, mas com Brackets não há necessidade de copiar e colar o CSS final de volta para o editor. Seu código é executado no navegador, mas vive em seu editor!

`Se você tem o Google Chrome instalado, você pode tentar fazer isso sozinho. Clique no ícone em forma de raio no canto superior direito ou pressione `Cmd/Ctrl + Alt + P`. Quando a Visualização ao Vivo (Live Preview) é habilitada em um documento HTML, todos os documentos CSS vinculados podem ser editados em tempo real. O ícone vai mudar de cinza para ouro quando Brackets estabelecer uma conexão com o seu navegador. Agora, coloque o cursor sobre o tag acima e use `Cmd/Ctrl + E` para abrir as regras CSS definidas. Tente mudar o tamanho da borda de 10px para 20px ou alterar a cor de fundo de "transparent" para "hotpink". Se você tem Brackets e seu navegador rodando lado a lado, você vai ver as alterações refletidas instantaneamente no seu navegador. Legal, certo?`

Atualmente, Brackets suporta Visualização ao Vivo (Live Preview) apenas para CSS. Iremos adicionar suporte à Visualização ao Vivo (Live Preview) para HTML e JavaScript em uma versão futura. Visualizações ao vivo atualmente só são possíveis com Google Chrome. Nós queremos trazer esta funcionalidade para todos os principais navegadores, e estamos ansiosos para trabalhar com os fornecedores.

## Envolva-se

Brackets é um projeto open-source. Desenvolvedores web de todo o mundo estão a contribuir para criar um editor de código melhor. Diga-nos o que você pensa, partilhe as suas ideias ou contribua diretamente para o projeto.

- Brackets.io
- Blog da Equipe Brackets
- Brackets no GitHub
- Brackets Wiki
- Mailing List Desenvolvedores Brackets
- @Brackets no Twitter
- Fale com os desenvolvedores no canal IRC #brackets no Freenode