Início rápido: usar o Visual Studio para criar seu primeiro aplicativo Node.jsQuickstart: Use Visual Studio to create your first Node.js app

Nesta introdução de 5 a 10 minutos do IDE (ambiente de desenvolvimento integrado) do Visual Studio, você criará um aplicativo Web Node.js simples.In this 5-10 minute introduction to the Visual Studio integrated development environment (IDE), you'll create a simple Node.js web application. Se você ainda não tiver instalado o Visual Studio 2017, acesse a página Downloads do Visual Studio para instalá-lo gratuitamente.If you haven't already installed Visual Studio 2017, go to the Visual Studio downloads page to install it for free.

Criar um projetoCreate a project

Primeiro, você criará um projeto de aplicativo Web Node.js.First, you'll create an Node.js web application project.

  1. Se não tiver o tempo de execução do Node.js instalado, instale a versão LTS do site do Node.js.If you don't have the Node.js runtime already installed, install the LTS version from the Node.js website.

    Em geral, o Visual Studio detecta automaticamente o tempo de execução do Node.js instalado.In general, Visual Studio automatically detects the installed Node.js runtime. Se ele não detectar um tempo de execução instalado, você poderá configurar seu projeto para fazer referência ao tempo de execução instalado na página de propriedades (depois de criar um projeto, clique com botão direito do mouse no nó do projeto e escolha Propriedades).If it does not detect an installed runtime, you can configure your project to reference the installed runtime in the properties page (after you create a project, right-click the project node and choose Properties).

  2. Abra o Visual Studio 2017.Open Visual Studio 2017.

  3. Na barra de menus superior, escolha Arquivo > Novo > Projeto.From the top menu bar, choose File > New > Project.

  4. Na caixa de diálogo Novo Projeto, no painel esquerdo, expanda JavaScript e escolha Node.js.In the New Project dialog box, in the left pane, expand JavaScript, then choose Node.js. No painel central, escolha Aplicativo Web Node.js em branco e, em seguida, escolha OK.In the middle pane, choose Blank Node.js Web application, then choose OK.

    Se você não vir o modelo de projeto do Aplicativo Web Node.js em branco, clique no link Abrir Instalador do Visual Studio no painel esquerdo da caixa de diálogo Novo Projeto.If you don't see the Blank Node.js Web application project template, click the Open Visual Studio Installer link in the left pane of the New Project dialog box. O Instalador do Visual Studio é iniciado.The Visual Studio Installer launches. Escolha a carga de trabalho Desenvolvimento de Node.js e, em seguida, selecione Modificar.Choose the Node.js development workload, then choose Modify.

    Carga de trabalho Node.js no instalador do VS

    Depois que você escolher o modelo Aplicativo Web Node.js em Branco e clicar em OK, o Visual Studio criará a solução e abrirá o projeto.After you choose the Blank Node.js Web Application template and click OK, Visual Studio creates and the new solution and opens the project. server.js é aberto no editor no painel esquerdo.server.js opens in the editor in the left pane.

Explorar o IDEExplore the IDE

  1. Observe o Gerenciador de Soluções no painel direito.Take a look at Solution Explorer in the right pane.

    Gerenciador de Soluções

    • O seu projeto está realçado em negrito, usando o nome que você forneceu na caixa de diálogo Novo Projeto.Highlighted in bold is your project, using the name you gave in the New Project dialog box. No disco, este projeto é representado por um arquivo .njsproj na pasta do projeto.On disk, this project is represented by a .njsproj file in your project folder.

    • No nível superior está uma solução que, por padrão, tem o mesmo nome que o projeto.At the top level is a solution, which by default has the same name as your project. Uma solução, representada por um arquivo .sln no disco, é um contêiner para um ou mais projetos relacionados.A solution, represented by a .sln file on disk, is a container for one or more related projects.

    • O nó de npm mostra os pacotes npm instalados.The npm node shows any installed npm packages. Você pode clicar com o botão direito do mouse no nó de npm para pesquisar e instalar pacotes de npm usando uma caixa de diálogo.You can right-click the npm node to search for and install npm packages using a dialog box.

  2. Caso deseje instalar pacotes npm ou comandos do Node.js por meio de um prompt de comando, clique com o botão direito do mouse no nó do projeto e escolha Abrir Prompt de Comando Aqui.If you want to install npm packages or Node.js commands from a command prompt, right-click the project node and choose Open Command Prompt Here.

    Prompt de comando do Node.js

  3. No arquivo server.js no editor (painel esquerdo), escolha http.createServer e pressione F12 ou escolha Ir para Definição no menu de contexto (acessado com o clique do botão direito do mouse).In the server.js file in the editor (left pane), choose http.createServer and then press F12 or choose Go To Definition from the context (right-click) menu. Esse comando acessará a definição da função createServer em index.d.ts.This command takes you to the definition of the createServer function in index.d.ts.

    Menu de contexto de Ir para Definição

  4. Volte para server.js, coloque o cursor no final da cadeia de caracteres nesta linha de código, res.end('Hello World\n'); e modifique-a para que fique assim:Got back to server.js, then put your cursor at the end of the string in this line of code, res.end('Hello World\n');, and modify it so that it looks like this:

    res.end('Hello World\n' + res.connection.

    Quando você digita connection., o IntelliSense fornece opções para completar automaticamente a entrada de código.Where you type connection., IntelliSense provides options to auto-complete the code entry.

    Preenchimento automático do IntelliSense

  5. Escolha localPorte, em seguida, digite ); para completar a instrução para que ela fique assim:Choose localPort, and then type ); to complete the statement so that it looks like this:

    res.end('Hello World\n' + res.connection.localPort);

Executar o aplicativoRun the application

  1. Pressione Ctrl+F5 (ou Depurar > Iniciar sem Depuração) para executar o aplicativo.Press Ctrl+F5 (or Debug > Start Without Debugging) to run the application. O aplicativo é aberto em um navegador.The app opens in a browser.

  2. Na janela do navegador, você verá “Olá, Mundo”, além do número da porta local.In the browser window, you will see "Hello World" plus the local port number.

  3. Feche o navegador da Web.Close the web browser.

Parabéns por concluir este Início Rápido! Nele, você se familiarizou com o IDE do Visual Studio e o Node.js.Congratulations on completing this Quickstart in which you got started with the Visual Studio IDE and Node.js. Caso deseje se aprofundar mais nas funcionalidades, continue com um tutorial na seção Tutoriais do sumário.If you'd like to delve deeper into its capabilities, continue with a tutorial in the Tutorials section of the table of contents.

Próximas etapasNext steps