　Azure Functionsを使用するとサーバーレス環境でコードを実行できますが、
開発にあたり規模が大きくなるとポータル内だけでやるのは限界がありますよね。

　今回Windows10の端末でVisual Studio Codeを使い用意した関数を、Azure Functionsへデプロイ・実行する方法を記載します。もちろんMacでもVS Codeで同じことができます。

[ 全体の流れ ]

1.端末に必要なものをインストール
(Visual Studio Code,npm,Azure Functions Core Tools)
↓
2.Local Projectを作成
(関数も作成。今回はデフォルトのものを使用します。)
↓
3.Azure Functionsへデプロイ。関数実行。

1.端末に必要なものをインストール

まずVisual Studio Codeをインストールします。
https://code.visualstudio.com/

次にNode.jsをインストールします。
https://nodejs.org/en/download/

そしてコマンドプロンプトを開き、以下実行しAzure Functions Core Toolsをインストールします。

npm install -g azure-functions-core-tools

Macの場合はHomebrewでインストールします (MSのドキュメントより)。
https://docs.microsoft.com/ja-jp/azure/azure-functions/functions-run-local

ブラウザで以下指定すると、

vscode:extension/ms-azuretools.vscode-azurefunctions

VS CodeのAzure Functions拡張機能を開くことができます。

「インストール」を選択します。

VS Codeを再起動しAzureアイコンをクリックしてサインインしておきます。

2.Local Projectを作成

　端末内にFunctions開発用の任意のフォルダを作成しておきます。僕は「y-araki-project」というフォルダを作りました。

次にVS Code上でF1キーを押し、Azure Functions: Create new project... を検索して選択します。そして作成したフォルダを選択します。

関数で使用する言語を選択します。今回はJavascriptにしました。

テンプレートを選択します。今回はHttpTriggerにしました。

関数名を入力します。今回はそのままHttpTriggerでEnterを押します。

ここではとりあえずFunctionを選択します。

　するとLocal Projectが作成され、デフォルトのソースコードが表示されます。
今回既にy-araki-test01という関数アプリをAzureコンソール上で作成しているため、それも左上に表示されています。

3.Azure Functionsへデプロイ。関数実行。

　再びF1キーを押し、Azure Functions: Deploy to function app... を選択します。
既に作成した関数アプリのy-araki-test01を選択します。
「+ Create New Function App in Azure」でリソースグループなど選択していけば、
ここで関数アプリを作成することもできます。

デプロイするのに上書きOKか聞かれるので「Deploy」をクリックします。

デプロイが実行されます。下部TerminalにExecuting task～などと表示されます。

完了するとAzureで作成した関数アプリ側にHttpTriggerが表示されています。

　HttpTriggerを右クリックし「Copy Function URL」を選択します。すると HTTPトリガーのURLがコピーされます。
テキストに貼り付けてみると以下のようになっています。

 http://<functionappname>.azurewebsites.net/api/<functionname>?code=<function_key>

僕の場合このようになっています。

https://y-araki-test01.azurewebsites.net/api/HttpTrigger&code=xxxxxxxxxxxxxxxxxxxxx

このURLに以下のようにクエリ文字列 ?name=araki を追加してから、関数を呼び出てみます(?name=の右の部分は何でもよいです)。

https://y-araki-test01.azurewebsites.net/api/HttpTrigger?name=araki&code=<function_key>

ブラウザで表示させてみると、

Hello araki

と表示されると思います。

　Visual Studio Codeを使用して、HTTPによってトリガーされる単純な関数を実行しました。
Local Projectのコードを編集し、再度デプロイすれば内容も変更できます。
VS Codeを使えばコードの管理もしやすくデバッグ機能など簡単に実行できます。

参考

Visual Studio Code を使用した初めての関数の作成