Apidog

Plataforma Colaborativa All-in-one para Desenvolvimento de API

Design de API

Documentação de API

Depuração de API

Mock de API

Testes Automatizados de API

Vamos aproveitar o VSCode! Instalação e operações básicas para iniciantes.

Miguel Oliveira

Miguel Oliveira

Updated on dezembro 6, 2024

VSCode (Visual Studio Code) é um editor de código leve e de alta funcionalidade, amplamente utilizado por muitos desenvolvedores de forma gratuita. Neste artigo, explicaremos de maneira simples e clara desde a instalação do VSCode até o uso básico, voltado para iniciantes.

Visual Studio Code

O que é o VSCode?

O VSCode é um editor de código gratuito desenvolvido pela Microsoft, compatível com muitas linguagens de programação. O editor em si é muito leve e rápido, com alta capacidade de personalização. Além disso, ao adicionar extensões, é possível aprimorar ainda mais suas funcionalidades, adaptando-se a várias tarefas de desenvolvimento.

💡
Antes de começar, se você está procurando maneiras de simplificar o desenvolvimento de APIs, confira o Apidog gratuitamente! O Apidog oferece uma interface intuitiva que se integra perfeitamente ao seu fluxo de trabalho existente, facilitando a gestão de APIs como nunca antes. 👇👇👇👇👇
button
Cliente Apidog

Método de Instalação

Instalação no Mac

1. Acesse o site oficial

Primeiro, acesse o site oficial do VSCode.

Download do Visual Studio Code

2. Download

Clique em "Mac" para baixar o instalador.

Download do Visual Studio Code

3. Extraia o arquivo zip

Extraia o arquivo zip que você baixou.

Extraindo o arquivo zip

4. Abra o VSCode

Dê um duplo clique no ícone do VSCode extraído para abrir o aplicativo.

Abrindo o VSCode

Instalação no Windows

1. Acesse o site oficial

Para a versão do Windows, acesse também o site oficial do VSCode.

Download do Visual Studio Code

2. Download

Clique em "Windows" para baixar o instalador.

Download do Visual Studio Code
button

3. Concorde com o contrato de licença

Inicie o instalador, revise o conteúdo do contrato de licença, marque "Concordo" e clique em Avançar.

Revisando o conteúdo do contrato de licença

4. Defina o local de instalação

Defina a pasta de instalação. Se não houver uma escolha específica, prossiga com as configurações padrão.

Definindo a pasta de instalação

5. Configuração do menu Iniciar

Após a instalação, configure a adição do VSCode ao menu Iniciar.

Configurando a adição do VSCode ao menu Iniciar

6. Escolha tarefas adicionais

Escolha opções como adicionar "Abrir com o Code" ao menu de contexto.

Selecionando opções

7. Inicie o VSCode

Após a instalação, clique no ícone para iniciar o aplicativo.

Iniciando o aplicativo

※ Neste momento, uma notificação para instalar o pacote de idiomas aparecerá no canto inferior direito, então selecione "Instalar e reiniciar".

Passos para a tradução para o português

O processo para traduzir o VSCode para o português é simples. Vamos realizar a tradução usando o método a seguir.

Instalação do pacote de idiomas

  1. Selecione "Extensões" na barra de atividades à esquerda.
Selecionando 'Extensões'

2. Digite "Portuguese" e selecione "Pacote de Idiomas em Português para Visual Studio Code".

Selecionando 'Install' para a tradução

Reinicie

Após a instalação, reinicie o VSCode para que a exibição em português entre em vigor.

Mudando para a exibição em português

Nomes e funções de cada parte

A interface do VSCode possui várias partes importantes. Compreender cada função tornará o uso mais fácil.

Barra de Título

(No MacOS) A barra na parte superior da janela exibe o menu para operações básicas do aplicativo. Esta barra de título exibe o nome do arquivo e mais quatro ícones de atalho abaixo.

  • Alternar a barra lateral primária (⌘B)
  • Alternar o painel (⌘J)
  • Alternar a barra lateral secundária (⌥⌘B)
  • Personalizar layout
Barra de Título

Barra de Atividades

(No MacOS) A barra que aparece na parte esquerda, permitindo o acesso ao explorador de arquivos, extensões, busca e outras funções.

No estado inicial, as seguintes funções são dispostas de cima para baixo:

  • Explorador (⇧⌘E)
  • Busca (⇧⌘F)
  • Controle de Versão (^⇧G)
  • Executar e Depurar (⇧⌘D)
  • Extensões (⇧⌘X)
  • Conta
  • Gerenciamento
Barra de Atividades

Barra Lateral Primária

(No MacOS) A barra lateral para gerenciar os arquivos abertos no editor.

Barra Lateral Primária

Barra Lateral Secundária

(No MacOS) Área que exibe as propriedades e outras informações detalhadas dos arquivos abertos.

Barra Lateral Secundária

Editor

(No MacOS) O local onde você realmente insere o código. Esta é a área principal de trabalho no VSCode.

Editor

Painel

(No MacOS) Área que exibe detalhes do arquivo, terminal e outros.

  • Problemas
  • Saída
  • Console de Depuração
  • Terminal
Painel

Barra de Status

(No MacOS) A barra exibida na parte inferior da tela, mostrando as seguintes informações da esquerda para a direita:

  • Nome do ramo Git
  • Botão de publicação no GitHub
  • Status de problemas
  • Posição do cursor
  • Número de recuo definido
  • Código de caracteres
  • Código de nova linha
  • Linguagem de programação
  • Feedback
Barra de Status

Uso Básico

Aqui, apresentaremos as operações básicas para dominar o VSCode.

※ Neste guia, estamos usando a versão "Insiders", o que pode resultar em algumas diferenças em relação à versão estável.

Abrir uma pasta

Selecione "Abrir pasta" no menu "Arquivo" e escolha a pasta do projeto em que está trabalhando.

Selecionando 'Abrir pasta'

Criar um arquivo

Clique no botão "Novo Arquivo" no canto superior esquerdo para criar um novo arquivo.

Criando um arquivo

Usar a funcionalidade Emmet

Emmet é uma funcionalidade que permite escrever código HTML e CSS de forma fácil. Por exemplo, ao digitar ! e pressionar a tecla Tab, a estrutura básica do HTML será automaticamente expandida.

Usando a funcionalidade Emmet

Salvar um arquivo

Os arquivos criados podem ser facilmente salvos usando Ctrl + S (Windows) ou Cmd⌘ + S (Mac).

Salvando um arquivo

Como o Apidog melhora o fluxo de trabalho

Falamos sobre a instalação do VSCode, configuração e operações básicas, mas é importante mencionar como ferramentas como Apidog complementam o fluxo de trabalho ao lidar com APIs. O Apidog oferece uma interface amigável que torna o desenvolvimento e a gestão de APIs muito mais fáceis. Com o Apidog, você pode projetar, testar e documentar APIs, tornando o processo de desenvolvimento mais suave e eficiente.

Site oficial do Apidog

Por que escolher o Apidog?

O Apidog é uma plataforma completa para projetar, depurar, desenvolver, simular e testar APIs. Aqui estão seus principais pontos:

  • 1. Design e depuração de APIs: O Apidog oferece um poderoso editor visual que permite aos usuários projetarem e depurarem APIs. Você pode descrever e depurar APIs usando JSON Schema.
  • 2. Testes automatizados: Gera automaticamente casos de teste a partir das especificações da API e oferece asserções visuais e validação de resposta incorporadas. Também é possível realizar testes automatizados integrando-se a sistemas CI/CD.
  • 3. Geração de documentação: Gera automaticamente uma documentação de API bonita que pode ser publicada em domínios personalizados ou compartilhada entre a equipe.
  • 4. Dados simulados: Com o motor de simulação local e na nuvem, você pode gerar dados simulados razoáveis com base em nomes de campo e especificações, sem necessidade de escrever scripts.
  • 5. Colaboração em equipe: Suporta recursos de ramificação, permitindo alterações e testes independentes sem afetar o ramo principal, sendo adequado para desenvolvimento ágil.
  • 6. Integração e expansão: Integrado a plugins do IDEA, permitindo que desenvolvedores de backend gerem diretamente especificações de API a partir do Javadoc, extraindo dados de bancos de dados para uso em requisições e pré-processamento.
  • 7. Compatibilidade: Suporta protocolos como HTTP, REST, GraphQL e SOAP, e também pode executar scripts do Postman.

Baixe o Apidog gratuitamente e veja como ele pode melhorar seu fluxo de trabalho, especialmente quando usado em conjunto com um editor de código como o VSCode.

button

Resumo

O VSCode é um editor de código simples, fácil de usar e altamente funcional. Iniciantes podem começar a utilizá-lo rapidamente, e ele pode otimizar uma variedade de tarefas, desde a gestão de projetos até a edição de código e personalização através de extensões. Após dominar a instalação e o uso básico, experimente realmente e aprenda ainda mais!