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.

Pré-requisitosPrerequisites

  • Você precisa ter o Visual Studio instalado e a carga de trabalho de desenvolvimento de Node.js.You must have Visual Studio installed and the Node.js development workload.

    Se você ainda não instalou o Visual Studio 2019, vá para a página de downloads do Visual Studio   para instalá-lo gratuitamente.If you haven't already installed Visual Studio 2019, go to the Visual Studio downloads page to install it for free.

    Se você ainda não instalou o Visual Studio 2017, vá para a página de 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.

    Se você precisar instalar a carga de trabalho, mas já tiver o Visual Studio, vá para ferramentas > obter ferramentas e recursos..., que abre o instalador do Visual Studio.If you need to install the workload but already have Visual Studio, go to Tools > Get Tools and Features..., which opens the Visual Studio Installer. 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

  • Você precisa ter o runtime do Node.js instalado.You must have the Node.js runtime installed.

    Se você não o tiver instalado, recomendamos que instale a versão LTS do site Node.js para obter a melhor compatibilidade com estruturas e bibliotecas externas.If you don't have it installed, we recommend you install the LTS version from the Node.js website for best compatibility with outside frameworks and libraries. Node.js é compilado para arquiteturas de 32 bits e 64 bits.Node.js is built for 32-bit and 64-bit architectures. As ferramentas de Node.js no Visual Studio, incluídas na carga de trabalho do Node.js, dão suporte a ambas as versões.The Node.js tools in Visual Studio, included in the Node.js workload, support both versions. Apenas um é necessário e o instalador do Node.js dá suporte apenas a uma instalação de cada vez.Only one is required and the Node.js installer only supports one being installed at a time.

    Em geral, o Visual Studio detecta automaticamente o runtime 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 Propriedades (depois de criar um projeto, clique com o botão direito do mouse no nó do projeto, escolha Propriedadese defina o Node.exe caminho).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, choose Properties, and set the Node.exe path). Você pode usar uma instalação global do Node.js ou pode especificar o caminho para um intérprete local em cada um de seus projetos de Node.js.You can use a global installation of Node.js or you can specify the path to a local interpreter in each of your Node.js projects.

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 runtime 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.

    Para obter mais informações, consulte os pré-requisitos.For more information, see the prerequisites.

  2. Abra o Visual Studio.Open Visual Studio.

  3. Criar um novo projeto.Create a new project.

    Pressione Esc para fechar a janela de início.Press Esc to close the start window. Digite Ctrl + Q para abrir a caixa de pesquisa, digite Node.js e, em seguida, escolha Criar novo projeto de Aplicativo Web Node.js em Branco (JavaScript).Type Ctrl + Q to open the search box, type Node.js, then choose Create new Blank Node.js Web application project (JavaScript). Na caixa de diálogo que aparece, escolha Criar.In the dialog box that appears, choose Create.

    Na barra de menus superior, escolha arquivo > novo > projeto.From the top menu bar, choose File > New > Project. No painel esquerdo da caixa de diálogo Novo Projeto, expanda JavaScript e escolha Node.js.In the left pane of the New Project dialog box, 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 não vir o modelo de projeto Aplicativo Web Node.js em Branco, instale a carga de trabalho de desenvolvimento de Node.js.If you don't see the Blank Node.js Web application project template, you must add the Node.js development workload. Confira instruções detalhadas nos Pré-requisitos.For detailed instructions, see the Prerequisites.

    O Visual Studio cria a nova solução e abre o projeto.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, esse 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. Se você quiser instalar pacotes NPM ou comandos de Node.js em 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 leva você para a definição da createServer função 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 debug > 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