One place for hosting & domains

      formatar

      Como formatar um código com o Prettier no Visual Studio Code


      Introdução

      Formatar código de maneira consistente é um desafio, mas ferramentas de desenvolvimento modernas tornam possível manter automaticamente uma consistência em toda a base de código da sua equipe.

      Neste artigo, você irá configurar o Prettier para formatar automaticamente seu código no Visual Studio Code, também conhecido como VS Code.

      Para fins de demonstração, aqui está um código de amostra que você irá formatar:

      const name = "James";
      
      const person ={first: name
      }
      
      console.log(person);
      
      const sayHelloLinting = (fName) => {
      console.log(`Hello linting, ${fName}`)
      }
      
      sayHelloLinting('James');
      

      Se estiver familiarizado com a formatação de código, irá notar alguns erros:

      • Uma mistura de aspas simples e duplas.
      • A primeira propriedade de persons deve estar em sua própria linha.
      • A declaração de console dentro da função deve estar recuada.
      • Você pode gostar ou não dos parênteses opcionais em torno do parâmetro da função de seta.

      Pré-requisitos

      Para acompanhar este tutorial, será necessário baixar e instalar o Visual Studio Code.

      Para trabalhar com o Prettier no Visual Studio Code, será necessário instalar a extensão. Para fazer isso, procure por Prettier - Code Formatter no painel de extensão do VS Code. Caso esteja instalando-o pela primeira vez, verá um botão install ao invés de uninstall mostrado aqui:

      Leia-me da extensão Prettier

      Passo 1 — Usando o comando de formatação de documento

      Com a extensão Prettier instalada, implante-a agora para formatar o seu código. Para começar, vamos explorar o uso do comando Format Document. Esse comando tornará seu código mais consistente com espaçamento formatado, quebra automática de linha e aspas.

      Para abrir a paleta do comando, utilize COMMAND + SHIFT + P no macOS ou CTRL + SHIFT + P no Windows.

      Na paleta do comando, procure por format e então escolha Format Document.

      Paleta de comando aberta com os resultados para format

      Em seguida, você pode ser solicitado a escolher qual formato deve ser usado. Para fazer isso, clique no botão Configure:

      Prompt para selecionar um formatador padrão

      Em seguinda, escolha Prettier – Code Formatter.

      Selecionando o Prettier

      Nota: caso não veja um prompt para selecionar um formato padrão, altere manualmente isso em suas Settings. Defina Editor: Default Formatter como ebsenp.prettier-vscode.

      Seu código agora está formatado com espaçamento, quebra automática de linha e aspas consistentes:

      const name="James";
      
      const person = { first: name };
      
      console.log(person);
      
      const sayHelloLinting = (fname) => {
        console.log(`Hello linting, ${fName}`);
      }
      
      sayHelloLinting('James');
      

      Isso também funciona em arquivos CSS. Você pode transformar algo com recuo, chaves, novas linhas e pontos-e-vírgulas inconsistentes em um código bem formatado. Por exemplo:

      body {color: red;
      }
      h1 {
        color: purple;
      font-size: 24px
      }
      

      Será reformatado como:

      body {
        color: red;
      }
      h1 {
        color: purple;
        font-size: 24px;
      }
      

      Agora que explorado esse comando, vamos ver como isso pode ser implementado para ser executado automaticamente.

      Passo 2 — Formatando o código ao salvar

      Até aqui, foi necessário executar um comando manualmente para formatar seu código. De forma a automatizar esse processo, é possível escolher uma configuração no VS Code para que seus arquivos sejam formatados automaticamente quando forem salvados. Isso também garante que o código não seja verificado no controle de versão que não está formatado.

      Para alterar essa configuração, pressione COMMAND + , no macOS ou CTRL + , no Windows para abrir o menu Settings. Quando o menu abrir, procure por Editor: Format On Save e certifique-se de que essa opção esteja marcada:

      Opção Editor: Format On Save marcada

      Quando isso estiver definido, você pode escrever seu código como sempre e ele será formatado automaticamente quando você salvar o arquivo.

      Passo 3 — Alterando as configurações do Prettier

      O Prettier faz muitas coisas por você no modo padrão, mas também é possível personalizar suas configurações.

      Abra o menu Settings. Em seguida, procure por Prettier. Isso irá trazer todas as configurações que você pode alterar:

      Definições de configuração para o Prettier

      Aqui estão algumas das configurações mais comuns:

      • Single Quote – escolha entre aspas simples e duplas.
      • Semi – escolha se devem ser incluídos pontos-e-vírgulas no final das linhas.
      • Tab Width – especifique quantos espaços você deseja que um tab insira.

      O ponto negativo de usar o menu de configurações embutido no VS Code é que ele não garante uma consistência entre todos os desenvolvedores de sua equipe.

      Passo 4 — Criando um arquivo de configuração do Prettier

      Se você alterar as configurações em seu VS Code, outra pessoa pode acabar tendo uma configuração totalmente diferente em sua máquina. Para estabelecer uma formatação consistente entre toda a sua equipe, crie um arquivo de configuração para o seu projeto.

      Crie um novo arquivo chamado .prettierrc.extension com uma das seguintes extensões:

      Aqui está um exemplo de um arquivo de configuração simples utilizando o JSON:

      {
        "trailingComma": "es5",
        "tabWidth": 4,
        "semi": false,
        "singleQuote": true
      }
      

      Para mais detalhes sobre os arquivos de configuração, confira os Docs do Prettier. Depois de criar um desses arquivos e verificá-lo em seu projeto, você é capaz de garantir que todos os membros da sua equipe irão seguir as mesmas regras de formatação.

      Conclusão

      Ter um código consistente é considerado uma boa prática. É especialmente benéfico ao trabalhar em um projeto com vários colaboradores. Concordar com um conjunto de configuração ajuda com a legibilidade e a compreensão do código. Dessa fora, mais tempo pode ser dedicado resolvendo problemas técnicos desafiadores ao invés de lutando contra problemas como o recuo no código.

      O Prettier garante uma consistência em sua formatação de código e torna o processo automático.



      Source link

      Como formatar strings no Go


      Como as strings são muitas vezes feitas de texto escrito, existem muitos casos em que queremos ter um maior controle sobre a aparência das strings a fim de as torná mais legíveis para humanos, usando pontuação, quebras de linha e recuos.

      Neste tutorial, vamos revisaremos algumas das maneiras que podemos trabalhar com strings em Go para garantir que todo o texto de saída seja formatado corretamente.

      Literais de string

      Vamos primeiro ver a diferença entre uma literal de string e um valor de string. Uma literal de string é o que vemos no código fonte de um programa de computador, incluindo os sinais de aspas. Um valor de string é o que vemos quando chamamos a função fmt.Println e executamos o programa.

      No programa “Hello, World!”, o literal de string é "Hello, World!", ao passo que o valor de string é Hello, World!, sem as aspas. O valor de string é o que vemos como o resultado em uma janela do terminal quando executamos um programa em Go.

      Alguns valores de string, porém, podem ter que incluir aspas, como quando citamos uma fonte. Como as literais de string e os valores de string não são equivalentes, é frequentemente necessário adicionar uma formatação adicional às literais de string para garantir que os valores de string sejam exibidos da maneira que queremos.

      Aspas

      Como podemos usar o sinal de crase ( ` ) ou aspas duplas (") no Go, é fácil incluí-las em uma string usando aspas duplas dentro de uma string entre sinais de crase:

      `Sammy says, "Hello!"`
      

      Alternativamente, para usar o sinal de crase, você pode colocar a string entre aspas duplas:

      "Sammy likes the `fmt` package for formatting strings.."
      

      Pela maneira como combinamos os sinais de crase e as aspas duplas, podemos controlar a exibição das aspas e dos sinais de crase dentro de nossas strings.

      É importante lembrar que o uso dos sinais de crase no Go cria uma literal de string raw e o uso das aspas duplas cria uma literal de string interpreted. Para aprender mais sobre a diferença entre elas, leia o tutorial Introdução ao trabalho com strings em Go.

      Caracteres de escape

      Outra maneira de formatar as strings é usar um caractere de escape. Os caracteres de escape são usados para dizer ao código que o caractere seguinte tem um significado especial. Todos os caracteres de escape começam com a tecla de barra invertida (), combinada com outro caractere dentro de uma string para formatar determinada string de uma certa maneira.

      A seguir, apresentamos uma lista de vários dos caracteres de escape comuns:

      Caractere de escape Como ele formata
      Barra invertida
      Aspas duplas
      n Quebra de linha
      t Tabulação (recuo horizontal)

      Vamos usar um caractere de escape para adicionar aspas ao exemplo das aspas acima. Porém, desta vez, usaremos aspas duplas para indicar a string:

      fmt.Println("Sammy says, "Hello!"")
      

      Output

      Sammy says, "Hello!"

      Ao usar o caractere de escape ", conseguimos usar usar uma string entre aspas duplas que inclui um texto citado entre aspas duplas.

      Podemos usar o caractere de escape n para quebrar linhas sem ter que pressionar a tecla Enter ou “return”:

      fmt.Println("This stringnspans multiplenlines.")
      

      Output

      This string spans multiple lines.

      Também podemos combinar caracteres de escape. Vamos imprimir uma string de várias linhas e incluir o espaçamento da tabulação em uma lista de itens, por exemplo:

      fmt.Println("1.tSharkn2.tShrimpn10.tSquid")
      

      Output

      1. Shark 2. Shrimp 10. Squid

      O recuo horizontal fornecido com o caractere de escape t garante o alinhamento dentro da segunda coluna, no exemplo anterior, tornando o resultado extremamente legível para humanos.

      Os caracteres de escape são usados para adicionar outra formatação às strings que possam ser difíceis ou impossíveis de se alcançar. Sem os caracteres de escape, você não poderia construir a string Sammy says, "I like to use the `fmt` package".

      Múltiplas linhas

      Imprimir strings em várias linhas pode tornar o texto mais legível para humanos. Com várias linhas, as strings podem ser agrupadas em texto claros e organizadas, formatadas como uma carta ou usadas para manter as quebras de linha de um poema ou de letras de música.

      Ao criar strings que abarquem várias linhas, usamos os sinais de crase para delimitar essas strings. Tenha em mente que, embora isso irá preservar as novas linhas abertas, também criará uma nova literal de string raw.

      `
      This string is on
      multiple lines
      within three single
      quotes on either side.
      `
      

      Se imprimir esse texto, notará que foi inserida uma linha (com a tecla Enter) no início e outra no final:

      Output

      This string is on multiple lines within three single quotes on either side.

      Para evitar isso, você precisa colocar a primeira linha imediatamente após o sinal de crase e encerrar a última linha também com um sinal de crase.

      `This string is on
      multiple lines
      within three single
      quotes on either side.`
      

      Se precisar criar uma literal de string interpretada, isso pode ser feito com aspas duplas e o operador +, mas será necessário inserir suas próprias quebras de linha.

      "This string is onn" +
      "multiple linesn" +
      "within three singlen" +
      "quotes on either side."
      

      Embora os sinais de crase facilitem a impressão e a leitura de textos longos, se você precisar de uma literal de string interpretada, será necessário usar aspas duplas.

      Literais de string bruta

      E se não quisermos uma formatação especial dentro de nossas strings? Por exemplo, podemos precisar comparar ou avaliar as strings do código do computador que usem a barra invertida propositadamente; desse modo, não vamos querer que o Go a utilize como um caractere de escape.

      Uma literal de string bruta diz ao Go para ignorar toda a formatação dentro de uma string, incluindo os caracteres de escape.

      Criamos uma string bruta usando sinais de crase ao redor da string:

      fmt.Println(`Sammy says,"The balloon's color is red."`)
      

      Output

      Sammy says,"The balloon's color is red."

      Ao construir uma string bruta, usando sinais de crase ao redor de determinada string, podemos reter as barras invertidas e outros caracteres usados como caracteres de escape.

      Conclusão

      Este tutorial analisou várias maneiras de formatar o texto no Go através do trabalho com strings. Ao usar técnicas como a de caracteres de escape ou de strings brutas, podemos garantir que as strings do nosso programa serão renderizadas corretamente na tela para que o usuário final consiga ler facilmente todo o texto de saída.



      Source link