Mac と Visual Studio Code で ASP.NET

#目的
他の方々の投稿でもすでに Mac で ASP.NET 書いて動かしてみるというものは多くありますが、MS チュートリアル含めて、若干自分が困ったこともあったので、まとめてみました。

#参考
[.NET Core installation guide](https://www.microsoft.com/net/core#macos)
[.NET Core and Visual Studio Code](https://code.visualstudio.com/docs/runtimes/dotnet)
[Yo Code - Extension Generator](https://code.visualstudio.com/docs/tools/yocode)

#準備
## Visual Studio Code をインストール
https://code.visualstudio.com/ にアクセスして、ダウンロードしてインストールします。

## .NET Core をインストール
ターミナルを起動し、以下のようにコマンドを実行します。

```(bash)
brew update
brew install openssl
mkdir -p /usr/local/lib
ln -s /usr/local/opt/openssl/lib/libcrypto.1.0.0.dylib /usr/local/lib/
ln -s /usr/local/opt/openssl/lib/libssl.1.0.0.dylib /usr/local/lib/
```

上記作業を終了したのち、「Install .NET Core SDK」のところに `official installer` というリンクがあるので、そこからインストーラーをダウンロードして、SDK をインストールしておくと良いみたいです。

## C# extension を VS Code Marketplace で探してインストール
Visual Studio Code を起動したのち、`⌘+P`を押下して、以下のコマンドを実行します。

```
ext install csharp
```

そうすると、下図のような画面になるので、一番上のものをインストールします。MS のやつですね。
![スクリーンショット 2016-12-06 16.24.29.png](https://qiita-image-store.s3.amazonaws.com/0/107794/1b1c7d10-fae1-ce0c-71d9-fd1d1016a0be.png)

インストール完了したのち、再起動すると、C# IntelliSense が有効になります。



## Yeoman generator をインストール
ターミナルで以下のコマンドを実行します。

```
npm install -g yo grunt-cli generator-aspnet bower
```


# 新規プロジェクト作成する
ターミナルを起動したのち、任意のディレクトリに移動して、以下のコマンドを実行します。

```
yo aspnet
```

そうすると、ターミナルに以下のような文字が表示されます。

```
$ yo aspnet

     _-----_     ╭──────────────────────────╮
    |       |    │      Welcome to the      │
    |--(o)--|    │  marvellous ASP.NET Core │
   `---------´   │        generator!        │
    ( _´U`_ )    ╰──────────────────────────╯
    /___A___\   /
     |  ~  |     
   __'.___.'__   
 ´   `  |° ´ Y ` 

? What type of application do you want to create? (Use arrow keys)
❯ Empty Web Application 
  Empty Web Application (F#) 
  Console Application 
  Console Application (F#) 
  Web Application 
  Web Application Basic [without Membership and Authorization] 
  Web Application Basic [without Membership and Authorization] (F#) 
(Move up and down to reveal more choices)
```

とりあえず `Web Application` を上下矢印キーで選択したのち、`Enter` します。

次は UI のフレームワーク選択です。

```
$ yo aspnet

     _-----_     ╭──────────────────────────╮
    |       |    │      Welcome to the      │
    |--(o)--|    │  marvellous ASP.NET Core │
   `---------´   │        generator!        │
    ( _´U`_ )    ╰──────────────────────────╯
    /___A___\   /
     |  ~  |     
   __'.___.'__   
 ´   `  |° ´ Y ` 

? What type of application do you want to create? Web Application
? Which UI framework would you like to use? (Use arrow keys)
❯ Bootstrap (3.3.6) 
  Semantic UI (2.1.8) 
```

今回は `Bootstrap (3.3.6)` を選択してみました。

最後にプロジェクト名です。何も入力しなければ、既定の名前になります。

```
$ yo aspnet

     _-----_     ╭──────────────────────────╮
    |       |    │      Welcome to the      │
    |--(o)--|    │  marvellous ASP.NET Core │
   `---------´   │        generator!        │
    ( _´U`_ )    ╰──────────────────────────╯
    /___A___\   /
     |  ~  |     
   __'.___.'__   
 ´   `  |° ´ Y ` 

? What type of application do you want to create? Web Application
? Which UI framework would you like to use? Bootstrap (3.3.6)
? What's the name of your ASP.NET application? (WebApplication) 
```

あとは、ひたすら (と言っても、そんなに時間はかからないと思います) 待ちます。
完了したのち、最後の部分の内容の通りにコマンド実行 (下記参考) してみたいと思います。

```
Your project is now created, you can use the following commands to get going
    cd "WebApplication"
    dotnet restore
    dotnet build (optional, build will also happen when it's run)
    dotnet ef database update (to create the SQLite database for the project)
    dotnet run
``` 

`dotnet run` したのち、ブラウザで `http://localhost:5000` にアクセスしてみます。
そうすると、とりあえず、ASP.NET な Web ページが完成しました。
![スクリーンショット 2016-12-06 16.42.39.png](https://qiita-image-store.s3.amazonaws.com/0/107794/2a4602f0-08cf-e1bb-0f01-79ca90fbf5d6.png)


本職は SQL Server な感じなのですが、これをベースに、ちょっと Web アプリ作って勉強したいと思いました。