Getting started with Azure Functions using VS Code: Zero to Deploy

Celý článek

This article was co-authored byPeter Ekene Eze. He’s a freelance developer evangelist and concatenate.io conference volunteer.

Azure Functions is a serverless compute service that enables you to run code on demand without having to explicitly provision or manage infrastructure. In this tutorial, we are going to get you started on Azure Functions from the bare minimum. We’ll walk you through the installation processes with Visual Studio Code, create your first Function App and finally deploying that app to Azure.

Prerequisites First off, you’ll need an Azure account, Azure account. You will also need to have Visual Studio Code installed along with Node.js and npm, the Node.js package manager. To enable local debugging, you also need to install the Azure Functions Core Tools. For the scope of this tutorial, we only require that you have VSCode, Node and Npm installed — we’ll walk you through the rest.

Creating an Azure account This is very much the first step. To create an Azure account, go to the Azure registration page and create a free account.

Click on the Start Free button to register for a free account or buy now if you want a paid plan with extended features. Next, you’ll be required to provide your Microsoft account details to sign up. If you don’t have one, you’ll have the option to create one:

Supply all your details and finish the signup process.

Install Azure Functions extension Next up, let’s install the Azure Functions extension in VSCode. You can follow the official Azure getting started guide or simply open Visual studio code, click on the Extensions icon on the left pane and type Azure in the extensions search bar:

Click install to install the extension. Once the installation is completed, you’ll see the Azure Functions logo appear at the Activity bar in VSCode:

We have successfully created an Azure account and installed the Azure Functions extension in VSCode. Now when you click the Azure Functions logo in the activity bar, it will open the Azure Functions explorer where you will be prompted to sign in with your Azure account or create a new one:

Click Sign in to Azure, this will generate an access code for you in VSCode and prompt you to launch your default browser to the Azure authentication page where you’ll be required to supply the code:

Paste the access code generated from VSCode into the code bar here and wait for this success message:

Once you get this, you have successfully signed in your Azure account to your VSCode. Go ahead and restart VSCode to apply the changes.

Install Azure Functions Core Tools Next, we install the OS-specific Azure Functions core tools globally to enable local debugging.

On macOS, install using Homebrew:

    $ brew tap azure/functions
    $ brew install azure-functions-core-tools

On Windows, install using npm:

    $ npm install -g azure-functions-core-tools@core

On Linux, follow the instructions in the Azure Functions Core Tools GitHub repository.

Once installed, open a Terminal/Powershell and run the func command to ensure that the installation was successful:

Awesome, we have everything set up appropriately. As a way of ensuring that all the prerequisites were installed and configured correctly, you should see your Azure email address in the Status Bar and your subscription in the Azure Functions explorer inside VSCode.

Create a new Function App Next, we create a new Function application using the Azure Functions extension. Click the Azure Functions logo in the Activity bar to open up the Azure Functions explorer. Then in the explorer, click the Create project icon:

Clicking the Create project icon will prompt you to select a folder to store your Function App. For the purpose of this tutorial, create an empty folder on the Desktop and select it.

Once you’ve chosen a project folder, you’ll be prompted to select a preferred language for your Function App

For the scope of this project, select JavaScript and press Enter. This will create the project in the selected folder and prompt you to select a window to open the project.

Open the app in the current window and create a new function with the Create function icon on the Azure Function explorer.

You’ll be prompted to select a project folder to save the Function App. Select the directory you currently have open — it's the default option, so press Enter to proceed. Next, you’ll be required to select a Function template, you’ll have a wide range of options to choose from; however, we’ll concentrate on the HTTP Trigger template for now.

So select the HTTP Trigger template and press Enter to proceed. Then accept the default function name HTTPTriggerJS and select the anonymous authentication.

This is very much the last step in creating the Function App. When it is done, the project will be created and you’ll get the index.js file displayed:

Now our function app is created!! Let’s run it locally.

Run Function App To run the app, open the debugger in VSCode by clicking the debug icon in the Activity bar. It’ll open the debug explorer where you can click the green play button to start the app:

This will build the app and generate the local URL for your Function. Simply Ctrl + Click on it to open it up in the browser. You should be able to see the app in the browser like so:

The default HTTP template parses a name query parameter to customize the response, add ?name=<yourname> to the URL in your browser to see the response output correctly:

Now that we’ve got our App working and running locally, let’s deploy it to Azure Functions.

Deploy to Azure Functions To deploy the App to Azure functions, open the Azure Functions explorer and click the Deploy to Function App arrow. This will prompt you to Select Function App. Press Create New Function App and press Enter to proceed.

Next, you will be required to select a unique name for the new Function App. Type a unique name of your choice and press Enter to proceed.

Next, you’ll be prompted to Select a resource group. At this point, you don’t have any, so click on Create new resource group.

Enter your preferred resource group name and proceed. Now you will be required to Select a storage account for your app. At this point, you won’t have any existing storage account, so click on Create new storage account.

Now enter a name for the new storage account.

Next, you will be required to select your location for new resources. Select a location in a region near you or near other services you may need to access and press Enter to proceed.

Once you’ve selected your nearest region, it’ll take a little while to set up your configurations and deploy your application. At the end of the process, you should get a success message like this:

The process will provide a deployed URL for your application. Open the Output tab on the Terminal pane in VSCode to see the URL:

Browse the website Now when you Ctrl+click on the URL, you’ll get your function app live on the browser

Conclusion Congratulations!! You have now:

• Installed Azure Functions Extension
• Created an Azure Functions App and Function
• Deployed your app successfully to Azure