ASP.NET MVCプロジェクトの設定と機能実装ガイド

##    はじめに

  __<font color="blue">　【C#】</font>のWebアプリケーションのフレームワークである__ __<font color="blue">　【ASP.NET Cor MVC】</font>の機能実装手順+αを確認。__

-------------------------

  詳細は以下をご参考

https://qiita.com/nano357/items/d8564fe79c600127eb45


-------------------------

ASP.NET MVCプロジェクトにおけるデータベース接続設定、ビューの作成、ルーティング設定、JavaScriptの読み込み手順などについて。

  ## 1. 接続文字列の設定

  #### 1.1 YourConnectionString

```xml
<connectionStrings>
    <add name="YourConnectionString" connectionString="Server=your_server;Database=your_database;User Id=your_user;Password=your_password;" providerName="System.Data.SqlClient" />
</connectionStrings>
```
解説:
●Server=your_server;
　: 接続先のデータベースサーバーの名前またはIPアドレスを指定しています。
 　 外部にあるデータベースサーバーに接続するために、
    your_serverの部分は具体的なサーバーのホスト名やIPアドレスに置き換えます。

●Database=your_database;
　: 使用するデータベースの名前を指定しています。
 　 your_databaseは接続先のデータベース名に置き換えます。

●User Id=your_user;Password=your_password;
　: データベースに接続するためのユーザーIDとパスワードを
 　 明示的に指定しています。
 　 your_userとyour_passwordの部分はデータベースに
 　 接続する際の認証情報に置き換えます。


ポイント:

●この接続文字列は、SQL Server 認証を使用しています。
　ユーザー名とパスワードを明示的に指定しているため、
　データベースにアクセスするための個別の資格情報が必要です。


  ## 2. ビューの修正

  #### 2.1 SumDatasコントローラーのIndexビュー修正

取得したデータを表示するために、sumDataListを表示するコードを追加します。

手順
　1. 新しいフォルダ作成:
     Viewsフォルダ内にSumDatasフォルダを作成。

　2. ビュー作成:
     SumDatasフォルダを右クリックし、「追加」→「ビュー」を選択し、
     Indexという名前のビューを作成。

```csharp
@model IEnumerable<RegistryManagementSystem.Models.SumData>

<h2>計算結果一覧</h2>

<table class="table">
    <thead>
        <tr>
            <th>ID</th>
            <th>数値</th>
            <th>結果</th>
            <th>作成日</th>
            <th>更新日</th>
        </tr>
    </thead>
    <tbody>
        @foreach (var item in Model)
        {
            <tr>
                <td>@item.Id</td>
                <td>@item.Number</td>
                <td>@item.Result</td>
                <td>@item.CreatedDate.ToShortDateString()</td>
                <td>@item.UpdatedDate.ToShortDateString()</td>
            </tr>
        }
    </tbody>
</table>
````


  ## 3. フォームの作成

  #### 3.1 Frm/Index.cshtml の作成
配置場所: Viewsフォルダ内にFrmフォルダを作成し、その中にIndex.cshtmlを配置します。
```html
@{
    ViewData["Title"] = "日付入力";
}

<div class="text-center">
    <h1 class="display-4">日付を入力してください</h1>

    <form action="/Frm/Submit" method="post">
        <div class="form-group">
            <label for="dateInput">日付:</label>
            <input type="date" id="dateInput" name="dateInput" class="form-control" required />
        </div>
        <button type="submit" class="btn btn-primary">送信</button>
    </form>

    @if (!string.IsNullOrEmpty(ViewBag.Message))
    {
        <p class="text-danger">@ViewBag.Message</p>
    }
</div>
````


  ## 4. プロジェクトの設定とスクリプトの読み込み手順

  #### 4.1 Global.asax と Global.asax.cs の反映
プロジェクトのルートにGlobal.asaxファイルを追加し、次の内容を追加します。

```csharp
using System.Web.Mvc;
using System.Web.Routing;

public class MvcApplication : System.Web.HttpApplication
{
    protected void Application_Start()
    {
        RouteConfig.RegisterRoutes(RouteTable.Routes);
    }
}
````


  #### 4.2 Web.config の設定
プロジェクトのルートにGlobal.asaxファイルを追加し、次の内容を追加します。

```csharp
using System.Web.Mvc;
using System.Web.Routing;

public class MvcApplication : System.Web.HttpApplication
{
    protected void Application_Start()
    {
        RouteConfig.RegisterRoutes(RouteTable.Routes);
    }
}
````
解説:
●Data Source=.;
　: SQL Serverの場所を示しています。ピリオド（.）は、
  　ローカルホスト、つまり現在のマシンを指します。

●Initial Catalog=MyDatabase;
　: 使用するデータベースの名前を指定します。
  　この例では「MyDatabase」というデータベースに接続します。

●Integrated Security=True;
　: Windows認証（統合セキュリティ）を使用してデータベースに接続します。
  　ユーザー名とパスワードを指定する代わりに、
  　Windowsのログイン資格情報を利用します。

●providerName="System.Data.SqlClient";
　: 使用するデータベースプロバイダを指定します。
  　この例では、SQL Serverに接続するための.NETの
  　クライアントライブラリ「System.Data.SqlClient」を使用しています。


  #### 4.3 App_Start フォルダの作成と初期設定
App_Startフォルダを作成し、RouteConfig.csを配置します。

```csharp
using System.Web.Mvc;
using System.Web.Routing;

public class RouteConfig
{
    public static void RegisterRoutes(RouteCollection routes)
    {
        routes.IgnoreRoute("{resource}.axd/{*pathInfo}");

        routes.MapRoute(
            name: "Default",
            url: "{controller}/{action}/{id}",
            defaults: new { controller = "Home", action = "Index", id = UrlParameter.Optional }
        );
    }
}
```

  #### 4.4 config フォルダの作成
configフォルダを作成し、設定ファイルを管理します。

●appSettings.config: アプリケーション固有の設定を記述。
●connection.config: データベース接続の設定を格納。


  #### 4.5 Scripts フォルダと JavaScript の読み込み
ScriptsフォルダにはJavaScriptファイルや外部ライブラリを配置します。

```html
@Scripts.Render("~/bundles/jquery")
<script src="~/Scripts/jquery-3.6.0.min.js"></script>
````


  #### 4.6 Views フォルダ
Viewsフォルダには、UIを構成するcshtmlファイルを配置します。


  #### 4.7 ViewBag と return View

ViewBagを使ってデータを渡す方法。
```csharp
ViewBag.Message = "Hello, World!";
return View();
````

ビューでの受け取り:
```html
<p>@ViewBag.Message</p>
````

  #### 4.8 スクリプトの設定と読み込み
jQueryなどを使用して、イベントリスナーを設定します。
```javascript
$('#btn-primary').on('click', function() {
    alert("Button clicked!");
});
````



  #### 4.9 三項演算子や as/is 演算子を使用したスクリプト
C# の演算子を使って型の確認やキャスト処理を行います。
```csharp


// CheckNullメソッドは、渡されたオブジェクトがnullかどうかをチェックします。
public string CheckNull(object obj)
{
/**  メソッド名は CheckNull で、引数として object 型の obj を受け取ります。**/
/**  戻り値は string 型です。**/
    

    /**  三項演算子 **/

    // objがnullでない場合は"true"を返し、nullの場合は"false"を返します。
    return obj != null ? "true" : "false";
    /**  条件による戻り値を決定します。 **/
}

/**  オブジェクトのキャスト **/
// objに100を代入します。これはint型の値ですが、object型として扱われます。
object obj = 100; 
// objをint?型にキャストします。objがint型であれば、numberにその値が代入され、
// そうでない場合はnullが代入されます。

/**  整数値 100 を object 型の変数 obj に代入します。
     この時点で、obj は整数型ですが、object 型として扱われます。 **/

int? number = obj as int?;
// numberが値を持っている場合はその値を文字列に変換し、
// そうでない場合は"null"と表示します。

/**  as 演算子を使って obj を 
     int?（nullable int）型にキャストします。 **/

/**  obj が int 型の場合、その値が number に代入され、
     そうでない場合は null が代入されます。 **/

Console.WriteLine(number.HasValue ? number.ToString() : "null");

/**  number が値を持っているかどうかを 
     HasValue プロパティで確認し、値があればその値を文字列として出力し、
     なければ "null" を出力します。 **/



// 別のオブジェクトを定義します。
object obj = 200; 

/**  新たに 200 を object 型の変数 obj に代入します。 **/



// objがint型であるかを確認します。
// is演算子を使って型の確認を行い、int型であれば条件はtrueになります。
if (obj is int == true)
{

/**  is 演算子を使って obj が int 型であるかを確認します。 **/

/**  型が一致すれば条件は true になり、以下のコードが実行されます。 **/


    // objがint型である場合に実行されるコードです。
    Console.WriteLine("objはint型です。"); 
    // コンソールにメッセージを表示します。

    /**  obj が int 型である場合、コンソールにメッセージを出力します。。 **/
}

````
● 型の確認やキャストを使うことで、
  C# ではオブジェクトの型に応じた処理を安全に行うことができます。