Rychlý start: Vývoj s využitím Node.js v Kubernetes pomocí Azure Dev mezeryQuickstart: Develop with Node.js on Kubernetes using Azure Dev Spaces

V tomto průvodci se naučíte:In this guide, you will learn how to:

  • Nastavit Azure Dev Spaces se spravovaným clusterem Kubernetes v AzureSet up Azure Dev Spaces with a managed Kubernetes cluster in Azure.
  • Iterativní vývoj kódu v kontejnerech pomocí Visual Studio Code a příkazový řádek.Iteratively develop code in containers using Visual Studio Code and the command line.
  • Ladění kódu v prostoru dev z Visual Studio Code.Debug the code in your dev space from Visual Studio Code.

PožadavkyPrerequisites

Vytvoření clusteru Azure Kubernetes ServiceCreate an Azure Kubernetes Service cluster

Je potřeba vytvořit v clusteru AKS podporované oblasti.You need to create an AKS cluster in a supported region. Následujících příkazů vytvořte skupinu prostředků s názvem MyResourceGroup a cluster AKS volá MyAKS.The below commands create a resource group called MyResourceGroup and an AKS cluster called MyAKS.

az group create --name MyResourceGroup --location eastus
az aks create -g MyResourceGroup -n MyAKS --location eastus --node-vm-size Standard_DS2_v2 --node-count 1 --disable-rbac --generate-ssh-keys

Povolit Azure Dev mezery ve vašem clusteru AKSEnable Azure Dev Spaces on your AKS cluster

Použití use-dev-spaces příkazu povolit prostory vývoj ve vašem clusteru AKS a postupujte podle zobrazených výzev.Use the use-dev-spaces command to enable Dev Spaces on your AKS cluster and follow the prompts. Následující příkaz povolí vývoj mezery na MyAKS cluster v MyResourceGroup seskupovat a vytvoří výchozí dev místa.The below command enables Dev Spaces on the MyAKS cluster in the MyResourceGroup group and creates a default dev space.

$ az aks use-dev-spaces -g MyResourceGroup -n MyAKS

'An Azure Dev Spaces Controller' will be created that targets resource 'MyAKS' in resource group 'MyResourceGroup'. Continue? (y/N): y

Creating and selecting Azure Dev Spaces Controller 'MyAKS' in resource group 'MyResourceGroup' that targets resource 'MyAKS' in resource group 'MyResourceGroup'...2m 24s

Select a dev space or Kubernetes namespace to use as a dev space.
 [1] default
Type a number or a new name: 1

Kubernetes namespace 'default' will be configured as a dev space. This will enable Azure Dev Spaces instrumentation for new workloads in the namespace. Continue? (Y/n): Y

Configuring and selecting dev space 'default'...3s

Managed Kubernetes cluster 'MyAKS' in resource group 'MyResourceGroup' is ready for development in dev space 'default'. Type `azds prep` to prepare a source directory for use with Azure Dev Spaces and `azds up` to run.

Získat kód ukázkové aplikaceGet sample application code

V tomto článku budete používat Azure Dev prostory ukázkovou aplikaci demonstruje použití Azure Dev mezery.In this article, you use the Azure Dev Spaces sample application to demonstrate using Azure Dev Spaces.

Klonování aplikace z Githubu a přejděte do dev prostorů/ukázky/nodejs/získávání spustit/webfrontend adresáře:Clone the application from GitHub and navigate into the dev-spaces/samples/nodejs/getting-started/webfrontend directory:

git clone https://github.com/Azure/dev-spaces
cd dev-spaces/samples/nodejs/getting-started/webfrontend

Příprava aplikacePrepare the application

Generovat graf prostředků Dockeru a Helm pro spuštění aplikace v Kubernetes pomocí azds prep příkaz:Generate the Docker and Helm chart assets for running the application in Kubernetes using the azds prep command:

azds prep --public

Je třeba spustit prep příkaz dev prostorů/ukázky/nodejs/získávání spustit/webfrontend adresáře se správně Generovat graf prostředků Dockeru a Helm.You must run the prep command from the dev-spaces/samples/nodejs/getting-started/webfrontend directory to correctly generate the Docker and Helm chart assets.

Sestavení a spuštění kódu v KubernetesBuild and run code in Kubernetes

Sestavte a spusťte váš kód v AKS pomocí azds up příkaz:Build and run your code in AKS using the azds up command:

$ azds up
Using dev space 'default' with target 'MyAKS'
Synchronizing files...2s
Installing Helm chart...2s
Waiting for container image build...2m 25s
Building container image...
Step 1/8 : FROM node
Step 2/8 : ENV PORT 80
Step 3/8 : EXPOSE 80
Step 4/8 : WORKDIR /app
Step 5/8 : COPY package.json .
Step 6/8 : RUN npm install
Step 7/8 : COPY . .
Step 8/8 : CMD ["npm", "start"]
Built container image in 6m 17s
Waiting for container...13s
Service 'webfrontend' port 'http' is available at http://webfrontend.1234567890abcdef1234.eus.azds.io/
Service 'webfrontend' port 80 (http) is available at http://localhost:54256
...

Zobrazí se tato služba spuštěna po otevření veřejnou adresu URL, které se zobrazí ve výstupu azds up příkazu.You can see the service running by opening the public URL, which is displayed in the output from the azds up command. V tomto příkladu je veřejnou adresu URL http://webfrontend.1234567890abcdef1234.eus.azds.io/ .In this example, the public URL is http://webfrontend.1234567890abcdef1234.eus.azds.io/.

Chcete-li zrušit azds up příkazu Ctrl + c, služba bude pokračovat ve službě AKS a veřejná adresa URL bude stále dostupný.If you stop the azds up command using Ctrl+c, the service will continue to run in AKS, and the public URL will remain available.

Aktualizace kóduUpdate code

Pokud chcete nasadit aktualizovanou verzi vaší služby, můžete aktualizovat všechny soubory ve vašem projektu a znovu spustit azds up příkazu.To deploy an updated version of your service, you can update any file in your project and rerun the azds up command. Příklad:For example:

  1. Pokud azds up je pořád spuštěný, stiskněte klávesu Ctrl + c.If azds up is still running, press Ctrl+c.

  2. Aktualizace řádek 10 server.js na:Update line 10 in server.js to:

        res.send('Hello from webfrontend in Azure');
    
  3. Uložte provedené změny.Save your changes.

  4. Znovu spustit azds up příkaz:Rerun the azds up command:

    $ azds up
    Using dev space 'default' with target 'MyAKS'
    Synchronizing files...1s
    Installing Helm chart...3s
    Waiting for container image build...
    ...    
    
  5. Přejděte na spuštěnou službu a sledujte změny.Navigate to your running service and observe your changes.

  6. Stisknutím klávesy Ctrl + c Zastavit azds up příkazu.Press Ctrl+c to stop the azds up command.

Inicializovat kód pro ladění v Kubernetes se službou Visual Studio CodeInitialize code for debugging in Kubernetes with Visual Studio Code

Otevřít Visual Studio Code, klikněte na tlačítko souboru pak otevřít... , přejděte dev prostorů/ukázky/nodejs/získávání spustit/webfrontend adresář a klikněte na tlačítko otevřít.Open Visual Studio Code, click File then Open..., navigate to the dev-spaces/samples/nodejs/getting-started/webfrontend directory, and click Open.

Teď máte webfrontend projekt otevřít ve Visual Studio Code, který je ve stejné službě jste spustili pomocí azds up příkazu.You now have the webfrontend project open in Visual Studio Code, which is the same service you ran using the azds up command. Chcete-li ladit tuto službu ve službě AKS pomocí Visual Studio Code, na rozdíl od použití azds up přímo, je nutné připravit tento projekt používat Visual Studio Code pro komunikaci s prostorem vývoj.To debug this service in AKS using Visual Studio Code, as opposed to using azds up directly, you need to prepare this project to use Visual Studio Code to communicate with your dev space.

Ve Visual Studio Code otevřete paletu příkazů, klikněte na tlačítko zobrazení pak paletu příkazů.To open the Command Palette in Visual Studio Code, click View then Command Palette. Začněte psát Azure Dev Spaces a klikněte na Azure Dev Spaces: Prepare configuration files for Azure Dev Spaces.Begin typing Azure Dev Spaces and click on Azure Dev Spaces: Prepare configuration files for Azure Dev Spaces.

Tento příkaz připraví projektu pro spuštění v Azure Dev prostory přímo z Visual Studio Code.This command prepares your project to run in Azure Dev Spaces directly from Visual Studio Code. Zároveň se vygeneruje .vscode adresáře s laděním konfigurace v kořenovém adresáři vašeho projektu.It also generates a .vscode directory with debugging configuration at the root of your project.

Sestavení a spuštění kódu z Visual Studio Code v KubernetesBuild and run code in Kubernetes from Visual Studio Code

Klikněte na ladění na levé straně a klikněte na ikonu spuštění serveru (AZDS) v horní části.Click on the Debug icon on the left and click Launch Server (AZDS) at the top.

Tento příkaz vytvoří a spustí vaši službu v Azure Dev mezery v režimu ladění.This command builds and runs your service in Azure Dev Spaces in debugging mode. Terminálu v dolní části okna se zobrazí výstup sestavení a adresy URL pro vaši službu s Azure Dev prostory.The Terminal window at the bottom shows the build output and URLs for your service running Azure Dev Spaces. Ladění konzoly zobrazuje výstup protokolu.The Debug Console shows the log output.

Poznámka

Pokud nevidíte žádné příkazy Azure Dev mezery v paletu příkazů, ujistěte se, že jste nainstalovali rozšíření Visual Studio Code pro Azure Dev prostory.If you don't see any Azure Dev Spaces commands in the Command Palette, make sure you have installed the Visual Studio Code extension for Azure Dev Spaces. Ověřte také, můžete otevřít dev prostorů/ukázky/nodejs/získávání spustit/webfrontend ve Visual Studio Code.Also verify you opened the dev-spaces/samples/nodejs/getting-started/webfrontend directory in Visual Studio Code.

Klikněte na tlačítko ladění pak Zastavit ladění zastavit ladicí program.Click Debug then Stop Debugging to stop the debugger.

Nastavení a použití zarážky pro laděníSetting and using breakpoints for debugging

Spusťte službu pomocí spuštění serveru (AZDS) .Start your service using Launch Server (AZDS).

Přejděte zpět na Explorer zobrazení kliknutím zobrazení pak Explorer.Navigate back to the Explorer view by clicking View then Explorer. Otevřít server.js a klikněte na tlačítko někde na řádku 10 umístěte kurzor existuje.Open server.js and click somewhere on line 10 to put your cursor there. Chcete-li nastavit zarážku přístupů F9 nebo klikněte na tlačítko ladění pak Přepnout zarážku.To set a breakpoint hit F9 or click Debug then Toggle Breakpoint.

Otevřete svou službu v prohlížeči a Všimněte si, že se nezobrazí žádná zpráva.Open your service in a browser and notice no message is displayed. Vraťte se do Visual Studio Code a podívejte se, že se zvýrazní řádek 10.Return to Visual Studio Code and observe line 10 is highlighted. Nastavit zarážku bylo pozastaveno služby na řádku 10.The breakpoint you set has paused the service at line 10. A to obnovit ji, stiskněte F5 nebo klikněte na tlačítko ladění pak pokračovat.To resume the service, hit F5 or click Debug then Continue. Vraťte se do prohlížeče a Všimněte si, že se teď zobrazí zpráva.Return to your browser and notice the message is now displayed.

Při spuštění služby v Kubernetes s připojen jiný ladicí program, máte plný přístup k ladění informace, jako je zásobník volání, místní proměnné a informace o výjimce.While running your service in Kubernetes with a debugger attached, you have full access to debug information such as the call stack, local variables, and exception information.

Odeberte zarážku vložením kurzor na řádku 10 server.js a stisknout F9.Remove the breakpoint by putting your cursor on line 10 in server.js and hitting F9.

Klikněte na tlačítko ladění pak Zastavit ladění zastavit ladicí program.Click Debug then Stop Debugging to stop the debugger.

Aktualizace kódu ze sady Visual Studio CodeUpdate code from Visual Studio Code

Změnit režim ladění tak připojit k serveru (AZDS) a spustit službu:Change the debug mode to Attach to a Server (AZDS) and start the service:

Tento příkaz vytvoří a spustí vaši službu v Azure Dev mezery.This command builds and runs your service in Azure Dev Spaces. Také začne nodemon zpracovat v kontejneru a bude k obrazci VS Code ho vaši službu.It also starts a nodemon process in your service's container and attaches VS Code to it. Nodemon procesu umožňuje automatické restartování, pokud jsou provedeny změny zdrojového kódu, umožní vývoj rychleji vnitřní smyčky, podobně jako vývoj v místním počítači.The nodemon process allows for automatic restarts when source code changes are made, enabling faster inner loop development similar to developing on your local machine.

Po spuštění služby, přejděte do něj pomocí prohlížeče a pracovat s ním.After the service starts, navigate to it using your browser and interact with it.

Zatímco je služba spuštěna, vraťte se do VS Code a aktualizaci řádku 10 v server.js.While the service is running, return to VS Code and update line 10 in server.js. Příklad:For example:

    res.send('Hello from webfrontend in Azure while debugging!');

Uložte soubor a vraťte se do služby v prohlížeči.Save the file and return to your service in a browser. Interakce se službou a Všimněte si, že se zobrazí aktualizovaná zpráva.Interact with the service and notice your updated message is displayed.

Při spouštění nodemon, proces Node se automaticky restartuje, jakmile jsou zjištěny žádné změny kódu.While running nodemon, the Node process is automatically restarted as soon as any code changes are detected. Tento proces automatické restartování je obdobou úpravy a restartování služby na místním počítači, poskytuje prostředí vývoje vnitřní smyčky.This automatic restart process is similar to the experience of editing and restarting your service on your local machine, providing an inner loop development experience.

Vyčištění prostředků AzureClean up your Azure resources

az group delete --name MyResourceGroup --yes --no-wait

Další postupNext steps

Zjistěte, jak prostory vývoj Azure vám pomůže vytvořit složitější aplikace napříč více kontejnery, a jak můžete zjednodušit spolupráce na vývoji práce s různými verzemi nebo větve kódu v různých oborech.Learn how Azure Dev Spaces helps you develop more complex applications across multiple containers, and how you can simplify collaborative development by working with different versions or branches of your code in different spaces.