新人SEくんの日常

新人エンジニアが大好きなesports、音楽、プログラミングなどなど、いろんなこと書いてきます

【C#】入力チェックを実装する

前提

  • Vsual Studio 2017がインストールされていること

本記事でやること

  1. ModelState.IsValidでModelを検証する
  2. エラーメッセージを作成する

ModelState.IsValidでModelを検証する

Modelを作成する

まず下記のようなModel[UserInfo]を作成します。
C#

public class UserInfo
{
    public string id { get; set; }

    public string password { get; set; }

    public string name { get; set; }

    public string mailAddress { get; set; }

    public IList<Skill> skillList { get; set; }

}
public class Skill
{

    public string skillName { get; set; }

    public string experience { get; set; }

}

属性を付ける

次に各項目に属性をつけます。
この項目は「半角英数字のみ許可する」とか「必須項目とする」とか。
下記を参考に属性を付けてみました。
qiita.com

C#

public class UserInfo
{

    [DisplayName("ID")]
    [Required(ErrorMessage = "IDは必須です")]
    public string Id { get; set; }

    [DisplayName("パスワード")]
    [Required(ErrorMessage = "パスワードは必須です")]
    public string Password { get; set; }

    [DisplayName("名前")]
    [Required(ErrorMessage = "名前は必須です")]
    public string Name { get; set; }

    [DisplayName("メールアドレス")]
    [EmailAddress(ErrorMessage = "メールアドレスの形式で入力してください")]
    [Required(ErrorMessage = "メールアドレスは必須です")]
    public string MailAddress { get; set; }

    [DisplayName("スキルリスト")]
    public IList<Skill> SkillList { get; set; }

}

public class Skill
{

    [DisplayName("スキル名")]
    [Required(ErrorMessage = "スキル名は必須です")]
    public string SkillName { get; set; }

    [DisplayName("経験年数")]
    [Required(ErrorMessage = "経験年数は必須です")]
    [MaxLength(3)]
    [MinLength(1)]
    [RegularExpression(@"[0-9]+", ErrorMessage = "半角数字のみ入力できます")]
    public string Experience { get; set; }

}

Modelを検証する

Modelの検証には、ModelState.IsValidメソッドを使用します。
こんな感じに。

C#

public IHttpActionResult Post([FromBody]UserInfo reqParam)
{

    string RESULT_OK = "0";
    string RESULT_NG = "1";

    ResultInfo result = new ResultInfo();
    result.result = RESULT_OK;

    // リクエストパラメータを検証
    if (!ModelState.IsValid)
    {
        result.result = RESULT_NG;
        return Json(result);
    }

    return Json(result);
}


リクエストパラメータの「Id」を空にしてリクエストを送ってみます↓

動作確認
IDは必須なので、RESULT_NG("result" : "1")で返却されました。

このままでもエラーなのは分かりますが、
どんなエラー内容なのかがクライアントに伝わりません。
クライアントがどんなエラーなのか分かりやすくするために、
適当なエラーメッセージを返してあげます。

エラーメッセージを作成する

エラー情報用Modelを作成する

以下のようにエラー情報用のModelと処理結果用のModelを作成しました。

C#

public class ResultInfo
{
    public string result { get; set; }
    public IList<ErrorInfo> errorInfoList { get; set; } = new List<ErrorInfo>();
}
public class ErrorInfo
{
    public string errorId { get; set; }
    public string errorMessage { get; set; }
}

エラーメッセージを作成する

リクエストパラメータ内のエラー項目の値を取得し、
クライアントへ返却するエラーメッセージを作成します。

※Controllerにこういった処理を書くのは適切ではないと思いますが、
検証のため一旦ここに書いてあります。
「入力値チェックってここに書くといいと思うよ!」っていうのがあれば、
コメントいただけると嬉しいです!

C#

public IHttpActionResult Post([FromBody]UserInfo reqParam)
{
    // 処理結果(初期値としてOKを設定)
    ResultInfo result = new ResultInfo();
    result.result = RESULT_OK;

    // 入力値エラーがあった場合
    if (!ModelState.IsValid)
    {
        foreach (string key in ModelState.Keys)
        {
            if (ModelState[key].Errors.Count > 0)
            {
                string[] keys = key.Split('.');
                object value = reqParam;
                string inputKey = "";
                string inputValue = "";

                for (int i = 1; i < keys.Length; ++i)
                {
                    // エラーがあった項目の値を取得する
                    value = getValue(value, keys[i]);
                    inputValue = (value == null ? "" : value.ToString());
                    inputKey = keys[i];
                }

                foreach (ModelError modelErr in ModelState[key].Errors)
                {
                    // エラーメッセージを作成
                    string message = modelErr.ErrorMessage;
                    ErrorInfo errorInfo = new ErrorInfo();
                    errorInfo.errorId = "E001";
                    errorInfo.errorMessage = modelErr.ErrorMessage + " 入力値:「" + inputValue + "」";
                    result.errorInfoList.Add(errorInfo);
                }
            }
        }
        return Json(result);
    }

    return Json(result);
}

↑のControllerの中で使うメソッド「getValue()」
入力値取得用のメソッドを作成しました。
正規表現でList型か判定し、キー項目に対応する値を取得します。
C#

/// <summary>
/// オブジェクト内から指定されたKEYに対応したVALUEを取得する。
/// </summary>
/// <param name="obj">オブジェクト</param>
/// <param name="key">キー</param>
static public object getValue(object obj, string key)
{
    // オブジェクトの型を取得
    Type type = obj.GetType();

    // key項目がListか判定
    Match matche = Regex.Match(key, "^(.*?)\\[(\\d)\\]");
    if (matche.Success)
    {
        // Listの場合
        PropertyInfo property = type.GetProperty(matche.Groups[1].Value);
        IList list = property.GetValue(obj, null) as IList;
        return list[int.Parse(matche.Groups[2].Value)];
    }
    else
    {
        // Listでない場合
        PropertyInfo property = type.GetProperty(key);
        return property.GetValue(obj, null);
    }
}

動作確認

以下の画像の通りリクエストパラメータを設定し、
リクエストを投げます。
動作確認_エラーメッセージ出力

想定したエラーメッセージが出力されました。

【Microsoft Azure】WebAPI を API App で作ってみよう③ ~アプリを API App へデプロイする~

前提条件

  • API Appを作成している
  • Microsoft Azureアカウントを持っている
  • ※持っていない方はこちらを参考にお作りください ymdrkun.hateblo.jp

本記事でやること

Azure API App へアプリをデプロイする

Visual Studioからアプリをデプロイします。

  1. デプロイするプロジェクトを右クリックする
  2. [発行]をクリックする
  3. [既存のものを選択]にチェック
  4. [発行]をクリックする
  5. 作成したAPI Appを選択する
  6. [OK]を押す

発行

発行詳細

発行先選択

WinSCPでデプロイされているか確認してみると、無事されていました。
いつもは、WinSCPを使用してビルドしたファイルを手動でデプロイしていましたが、
Visual Studioからできるのを知って驚きました。笑

デプロイ後

Postmanを使って動作確認をする

では、早速Postmanを使い動作確認をしてみましょう。

Postman で動作確認

無事、値が返ってきました。
Web API作成~API App作成~APIデプロイ~動作確認までが5分かかりません!笑
早すぎて驚きました。
これで自宅でも現場と同じ環境をすぐ作れて、
お勉強が捗ります!!

終わりに

現場でやっていること、学んだことは記事に残しておこうと思いアップしました。
皆さんのお力になれれば幸いです。
何か間違い等ありましたらご指摘をお願いします!
以上です!

【Microsoft Azure】WebAPI を API App で作ってみよう② ~Azure API App を作成する~

前提条件

  • Microsoft Azureアカウントを持っている
  • ※持っていない方はこちらを参考にお作りください ymdrkun.hateblo.jp

本記事でやること

Azure API App を作成

Azure Portalを開き以下の手順でAPI Appを作成する

  1. [リソースの追加]をクリックする
  2. [Web]を選択する
  3. [API App]を選択する
  4. 任意のアプリ名を入力する
  5. 任意のサブスクリプションを選択する
  6. 任意のリソースグループを選択する
  7. 任意のAppServiceプランを選択する
  8. [Application Insights]を無効にする
    (有効でもいいですが、今回は特に使用することはないので無効としています。)
  9. ※Application Insightsを有効にすると、アプリのパフォーマンスを監視できます。
    (例えば、アプリの応答速度やレスポンスの状態を確認したりできます)
  10. [作成]をクリックする
Azure API App作成手順

API Appの作成が完了すると以下の画面が表示されます。
[リソースへ移動]をクリックすると、作成したAPI Appの設定画面へ遷移します。

リソース作成完了

作成したAPI App への接続情報を取得する

Azure Portalを開き、左側のメニューから[App Service]→[作成したアプリ名]で作成したアプリへ移動できます。

  1. [AppService]をクリックする
  2. 作成したアプリを選択する
  3. [発行プロファイルの取得]をクリックする

発行プロファイルの取得

アプリ名.PublishSettingsというファイルがダウンロードされると思います。
その中に記載されている接続情報でアプリへ接続します。
次回は、作成したAPI App へアプリのデプロイをやっていきたいと思います。

続きはこちら↓
www.ymdrkun.work

【Microsoft Azure】WebAPI を API App で作ってみよう① ~ASP.NET Web API を作成する~

前提条件

本記事でやること

ASP.NET Web API を作成

ASP.NET Web APIプロジェクトを作成する

Visual Studioを起動し[ファイル]→[新規作成]→[プロジェクト]を選択する。
開かれたダイアログで以下の通り選択・入力し、「OK」ボタンを 押下する。

  1. 左側の「Web」を選択
  2. 右側で「ASP.NET Web アプリケーション(.NET Framework)」を選択
  3. 名前に「SampleWebApi」と入力
  4. 「OK」ボタンを押下

プロジェクト作成画面

テンプレート選択画面

Controllerを追加する

ソリューションエクスプローラーの[Controller]を右クリックし、
[追加]→[新しい項目]を選択する。

  1. [Web]→[Web API]→[Web API コントローラークラス]を選択
  2. 名前に「UserController.cs」と入力
  3. 「追加」ボタンを押下

Controller追加

以下のようなコードが自動生成されます。

    public class UserController : ApiController
    {
        // GET api/<controller>
        public IEnumerable<string> Get()
        {
            return new string[] { "value1", "value2" };
        }

デバッグで動作確認を行う

[F5]キーを押しデバッグを開始する。
エラー画面が表示されますが特に気にしなくて構いません。
(ルートパスに対しての処理を作成していないためエラーが出ている。)

エラー画面

Postmanを使用し、リクエストを投げる。
以下のようにJSON形式のレスポンスが返ってくると思います。

Postmanで動作確認

参考

nuitsさんを参考にさせていただいておりますm(_ _)m
www.nuits.jp

終わりに

次は、AzureでAPI Appを作成します!
こちら↓
ymdrkun.hateblo.jp

【ココナラ】新人エンジニア(2年目)が自分のスキルを売ってみた

はじめに

現場に配属されてから約1年が経ち、
1年前の自分くらいスキルレベルの人たちの手助け + お小遣い稼ぎをするために、
ココナラでスキルを出品してみました!

ココナラとは?

簡単に言うと、「自分のスキルを売ることが出来るサービス」です。
ココナラの商品は、その人の得意なこと(お絵かき、プログラミング、競馬予想、占いなどなど)です。

ランサーズやクラウドワークス⇨「こんなスキル持った人求めてます!」
ココナラ⇨「こんなスキル持ってます!」

ココナラで売ることのできるもの

なんでも売れます!笑
出品者の中には、「あなたの愚痴聞きます! 100円/分」とか「お誕生日プレゼント選びます!」などなど
いろんなものが売っています。

今回私が売ったもの

今回は今まで勉強してきたプログラミングのスキルを売り始めました!
主にプログラミング初学者を対象とし、
「コード書いてみたけど動かない・・・」
「画面にこんな動きをつけたい!」
といった悩みを解決し、少しでも皆さんのお力になれたらと思っています。
(お小遣いが欲しい・・・⇦こっちがメイン笑)

初心者歓迎!プログラミングをお手伝いします プログラミングを始めてみたけど、思ったように動かない時に!

終わりに

また後日状況をアップします〜!

【テスト】配属後初めてしっかりテストコードを書いている

はじめに

約4ヶ月の新人研修が終わった後、
アジャイル開発チームへ配属されました。(現在配属後から約1年経ちました)
いきなり開発させてもらえて、毎日楽しく過ごしています。

新しい機能を実装するのは好きなのですが、
テストケースを作ったり、テストの実施が嫌いでした。。
テストなんか動作確認レベルで済ませて、
どんどん機能を実装していきたい!!
って思っていました。

そんな時に新規案件(API開発)で単体レベルのテストは自動化しよう!という方針になり、
配属後初めて単体テストのコードを書くことになりました。
その中で感じたことをメモにしておきたいと思います。

単体テストとは(おさらい)

プログラムを構成する部品(関数、メソッド単位)が正しく動作することを確認するテストのことを指す。

単体テストの利点

  • 各部品を結合する前にテストを行うことで、各部品に埋め込まれた不具合を早期発見できるので、プログラムの不具合修正にかかるコストを削減できる。
  • 単体テストのコードを残しておくことで、機能改修の際にテストコードを再利用できることもある。

単体テストをどうやるか

単体テストをするためのプログラムを作成し、
プログラム上で動作検証をしていくのが一般的かと思います。
(新人研修では、JUnitを使いました。JUnit ⇨ Javaプログラムの単体テストを行うためのツール)
今回私たちのチームでは、MSTestを使用することになりました。
qiita.com

カバレッジを計測するのにAxoCoverも導入しました。
無料です!インターネットへ接続できればすぐ落とせます!
www.nuits.jp

手動で単体テストも行えますが、
テストケースを書いて、実施してエビデンス残して、、、とかやるよりコード書いちゃった方が楽だと思います。
機能拡張もなく、再利用することのないと分かっているものは、
わざわざテスト作らなくてもいいと思います。

所感

  • 動作確認にかかる時間がめっちゃ短くなった!(ボタンポチっだけで単体テストケースを全て実施できる。
  • テストコードを作成してコミットすることで、どういう観点の確認をしているかチーム内に共有できる!(テストコードもレビュー対象なので、足りない観点教えてもらえる!
  • テストコードしっかり書かなくては!という雰囲気ができてきた。(最新ソースに日次でテストを実行しており(自動化)、テストに失敗するとチーム全員に通知される。
  • テスト成功になると気持ちいいいい!(無駄に一旦流したくなる、、笑
  • 「テスト」って言葉だけで、嫌になっていたけど、めんどくさいなら自動化すればいいじゃんって思うようになってきた。

今後の課題

  • スタブを作るのが大変。(テストコード作成よりスタブ作成に時間かかってる。swagger-codegenとか使ってみようかな。。

日々精進!

【テスト】テストケースを作成する時に

はじめに

必要なテストを洗い出す時にあると便利そうなサイトとかのメモです。

どんなテストがあるか

Qiitaの記事で素晴らしい記事があった
qiita.com
テスト方針を決める際にこれらのテスト種別を参考にして
必要なテスト、不要なテスト(その理由も)を分けるとよいかも。

テスト観点を蓄積してゆく

アジャイル開発をしていると各スプリント毎に様々な機能の開発をやらせてもらえる。
がしかし、テスト観点が乏しいため作成するテストケースの質が鼻くそレベル。。
せめて、チーム内にテスト観点表みたいなものがあればいいのに。。。
⇨このアプリでは、こんなバグが以前起こったので、改修した際はここも確認してください。とかのメモとかも

というか絶対必要だと思い、日々テスト観点を蓄積していっています。
ある程度人に見せられるレベルになったらQiitaとかにあげてみようと思います。