Quantcast
Channel: C#タグが付けられた新着記事 - Qiita
Viewing all articles
Browse latest Browse all 9318

【C#入門】初学者がASP.NETでWebアプリを作る:第1回

$
0
0

概要

転職してC#で開発することになったものの、C#は触ったことがないので、練習として簡単にWebアプリを作っていきたいと思います。
やってみた結果、こうやったらできたよ、ではなく、やりながらやったことをそのまま書いていきたいと思います。
(最後まで読むと成長過程がわかる…きっと。)

作るもの

・給与管理アプリケーション
会社が従業員の給与を管理するものではなく、従業員が自分の給与を管理するアプリを作っていきます。
毎月の給与や賞与の明細を登録、蓄積していきます。
データを見るところは、明細を確認するだけはアプリの機能として実装して、グラフとかで見えたらいいなと思うので、そこはBIツールを使う予定。
アプリの機能としては、下記3機能を持たせます。
1.アカウント管理
2.給与・賞与データ登録
3.給与・賞与データ参照

使うもの

・Visual Studio 2019
 Community版を使います。
・ASP.NET Core
・Entity Framework
 PostgreSQLを使うのでNpgsqlを使います。
・IdentityASP.NET Core(アカウント認証はこれを使うとできるって聞いたけどほんとに使うか不明)
・PostgreSQL(あえてSQL Serverは使わない挑戦)

プロジェクトを作る

Visual Studio 2019を起動し、新しいプロジェクトの作成
image.png

ASP.NET Core Web アプリケーションを選択、次へ
image.png

適当に入力して作成
image.png

Web アプリケーション(モデルビューコントローラー)を選択し作成
(認証のところを変更しておくかどうか迷ったけど一旦スルー、まずは登録機能だけ作り上げて、アカウント管理機能は後で作る。)
image.png

プロジェクトの作成完了。

Npgsqlを導入する

プロジェクトを右クリックして、NuGetパッケージの管理を開き、
Npgsqlを検索、インストール
image.png

なんか聞かれるのでOK
image.png

エラーが出なければ完了。

Modelを作る

参考文献:https://qiita.com/Kei18/items/1a9b936216bd2458ec08
まずはSalaryモデルを作っていきます。
ソリューションエクスプローラのModelsフォルダを右クリック→追加→新しい項目を選択、
クラスを選択して名前を記入し追加
image.png

下記のようなクラスにしました。

Salary.cs
usingSystem;usingSystem.Collections.Generic;usingSystem.Linq;usingSystem.Threading.Tasks;namespaceSalaryManagementSystem.Models{publicclassSalary{// 受給者publicstringBeneficiary{get;set;}// タイプ(給与、賞与)publicstringPaymentType{get;set;}// 支給日publicDateTimePaymentDate{get;set;}// 支給額publicdecimalPaymentAmount{get;set;}// 交通費publicdecimalTravelExpence{get;set;}// 健康保険料publicdecimalHealthInsurancePremium{get;set;}// 厚生年金料publicdecimalWelfarePension{get;set;}// 雇用保険料publicdecimalEmploymentInsurancePremium{get;set;}// 所得税publicdecimalIncomeTax{get;set;}// 住民税publicdecimalResidentTax{get;set;}// 総支給publicdecimalTotalPaymentAmount{get;set;}// 時間外手当publicdecimalOvertimeAllowance{get;set;}// 深夜手当publicdecimalMidnightAllowance{get;set;}// 休日手当publicdecimalHolidayAllowance{get;set;}// 備考publicstringRemarks{get;set;}// 登録日時publicDateTimeRegisterDate{get;set;}// 登録ユーザIDpublicstringRegisterUser{get;set;}// 更新日時publicDateTimeUpdateDate{get;set;}// 更新ユーザIDpublicstringUpdateUser{get;set;}}}

スキャフォールディング機能を使用するため、一度ビルドしておく。

Controllerを作る

ソリューションエクスプローラのControllersを右クリック→追加→新規スキャフォールディングアイテムを選択
Entity Frameworkを使用した、ビューがあるMVCコントローラーを選択し追加
image.png
下記のように設定し追加
image.png
エラーになった
image.png
どうやらIdという項目(自動的に主キーにする項目)がないといけないらしいので追加した。
エラー解消!

Salary.cs
usingSystem;usingSystem.Collections.Generic;usingSystem.Linq;usingSystem.Threading.Tasks;namespaceSalaryManagementSystem.Models{publicclassSalary{// IDpublicintId{get;set;}// 受給者publicstringBeneficiary{get;set;}// タイプ(給与、賞与)publicstringPaymentType{get;set;}// 支給日publicDateTimePaymentDate{get;set;}// 支給額publicdecimalPaymentAmount{get;set;}// 交通費publicdecimalTravelExpence{get;set;}// 健康保険料publicdecimalHealthInsurancePremium{get;set;}// 厚生年金料publicdecimalWelfarePension{get;set;}// 雇用保険料publicdecimalEmploymentInsurancePremium{get;set;}// 所得税publicdecimalIncomeTax{get;set;}// 住民税publicdecimalResidentTax{get;set;}// 総支給publicdecimalTotalPaymentAmount{get;set;}// 時間外手当publicdecimalOvertimeAllowance{get;set;}// 深夜手当publicdecimalMidnightAllowance{get;set;}// 休日手当publicdecimalHolidayAllowance{get;set;}// 備考publicstringRemarks{get;set;}// 登録日時publicDateTimeRegisterDate{get;set;}// 登録ユーザIDpublicstringRegisterUser{get;set;}// 更新日時publicDateTimeUpdateDate{get;set;}// 更新ユーザIDpublicstringUpdateUser{get;set;}}}

とりあえず実行してみる

画面上部のIIS Expressボタンを押下
証明書がどうとか聞かれるがOK的な方を選ぶ
自動的に開いたページのURL末尾に/Salariesを追加して開くと…エラー。
DBにアクセスできない的なエラー。そりゃDB作ってないからな。。。
image.png

まとめ

・プロジェクトを作成した
・Modelクラスを作成した
・Controllerはスキャフォールディングで作成したがうまくいってない???

次回予告

次回はスキャフォールディングでうまくいかなかった調査と、CRUDの作りこみをしていきます。


Viewing all articles
Browse latest Browse all 9318

Latest Images

Trending Articles