Create Your First Azure Function with Visual Studio Code

Step 1: Prerequisites

Before you begin, ensure you have the following installed:

• Visual Studio Code
• Azure Functions Core Tools (version 3.x or later)
• .NET SDK (if developing in C#) or Node.js (if developing in JavaScript/TypeScript)
• Azure Functions extension for Visual Studio Code

You will also need an Azure account (a free trial is available).

Step 2: Install the Azure Functions Extension

Open Visual Studio Code. Navigate to the Extensions view by clicking the Extensions icon in the Activity Bar on the side of the VS Code window (or press Ctrl+Shift+X). Search for "Azure Functions" and install the extension published by Microsoft.

Step 3: Create a New Project

1. Open the Command Palette (Ctrl+Shift+P or Cmd+Shift+P on Mac).

2. Type and select Azure Functions: Create New Project....

3. Choose a folder for your project. Click Select Folder.

4. Select your preferred language. For this example, let's choose C# or JavaScript.

5. Choose a template for your first function. Select HTTP trigger.

6. Provide a name for your function, e.g., HttpTriggerCSharp or HttpTriggerJS.

7. Choose an authorization level. For local development, Anonymous is often the easiest to start with.

Visual Studio Code will now create your project and generate the necessary files.

Step 4: Understand the Project Structure

Your new Azure Functions project will typically contain the following files:

• .gitignore: Specifies intentionally untracked files that Git should ignore.
• local.settings.json: Stores app settings and connection strings for local development.
• host.json: Configuration options that affect all functions in your function app.
• [YourFunctionName]/[YourFunctionName].cs (for C#) or [YourFunctionName]/index.js (for JavaScript): The code file for your function.
• [YourFunctionName]/function.json: Configuration file for your specific function (defines triggers and bindings).

The local.settings.json file is important for local testing and contains settings like:

{
  "IsEncrypted": false,
  "Values": {
    "AzureWebJobsStorage": "",
    "FUNCTIONS_WORKER_RUNTIME": "dotnet" 
    // or "node" for JavaScript/TypeScript
  }
}

Step 5: Run Your Function Locally

1. Press F5 or go to the Run and Debug view (Ctrl+Shift+D) and click the "Run and Debug" button.

2. Visual Studio Code will build your project and start the Azure Functions host. You should see output in the Debug Console indicating that your function is running.

3. The output will include the local URL for your HTTP trigger. It typically looks like http://localhost:7071/api/[YourFunctionName].

4. Open this URL in your web browser or use a tool like cURL or Postman to send a request. You should see a response, often a welcome message.

Step 6: Deploy to Azure

1. Sign in to your Azure account within Visual Studio Code using the Azure Functions extension. Click the "Sign in to Azure..." button in the Functions pane.

2. Right-click on your project folder in the Explorer view.

3. Select Deploy to Function App....

4. Select your Azure subscription.

5. Choose + Create new Function App in Azure.... You'll be prompted to enter a globally unique name for your Function App, select a runtime (matching your local project), and choose a region.

6. Visual Studio Code will create the Function App in Azure and then deploy your local project files to it.

7. Once deployment is complete, you can find the URL for your deployed function in the Azure Functions output pane or by browsing to your Function App in the Azure portal.

Deploy to Azure Now