ပထမဆုံးအနေနဲ့ ကျွန်တော်တို့ရဲ့ application က ချိတ်ဆက် အသုံးပြုမယ့် Database နဲ့ Table ကို ဆောက်ဖို့ လိုအပ်ပါတယ်။ SQL Server Management Studio (SSMS) ကိုသုံးပြီး အောက်က query ကို run ပြီး ဆောက်လိုက်ပါမယ်။
- 1. Create the Database
CREATE DATABASE DotNetTrainingBatch0Db;
GO
-- 2. Use the new Database
USE DotNetTrainingBatch0Db;
GO
-- 3. Create the Blogs table
CREATE TABLE [dbo].[Tbl_Blog]( [BlogId] [int] IDENTITY(1,1) NOT NULL, [BlogTitle] [varchar](255) NOT NULL, [BlogAuthor] [varchar](255) NOT NULL, [BlogContent] [varchar](max) NOT NULL, CONSTRAINT [PK_Tbl_Blog] PRIMARY KEY CLUSTERED
( [BlogId] ASC
)WITH (PAD_INDEX = OFF, STATISTICS_NORECOMPUTE = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS = ON, ALLOW_PAGE_LOCKS = ON, OPTIMIZE_FOR_SEQUENTIAL_KEY = OFF) ON [PRIMARY]
) ON [PRIMARY] TEXTIMAGE_ON [PRIMARY]
GONote: ဒီအဆင့်မှာ ကျွန်တော်တို့က Database မှာ table ကို အရင်ဆောက်တာဖြစ်တဲ့အတွက် ဒါကို Database-First Approach လို့ခေါ်တာ ဖြစ်ပါတယ်။
အခု Visual Studio မှာ Solution နဲ့ Project တွေကို ဆောက်ပါမယ်။
- Create a Blank Solution: Visual Studio ကိုဖွင့်ပြီး
Blank Solutionတစ်ခုကိုDotNetTrainingBatch0ဆိုတဲ့နာမည်နဲ့ ဆောက်ပါမယ်။ - Create the Database Project: Solution ပေါ်မှာ Right-click နှိပ်ပြီး
Add->New Project...ကိုရွေးပါ။Class LibraryကိုရွေးပြီးDotNetTrainingBatch0.Databaseဆိုတဲ့ နာမည်ပေးပါ။ ဒါက ကျွန်တော်တို့ရဲ့ Database နဲ့ သက်ဆိုင်တဲ့ C# Model တွေနဲ့ DbContext ကို ထားမယ့်နေရာပါ။ - Create the MVC Project: Solution ပေါ်မှာပဲ Right-click ထပ်နှိပ်ပြီး
Add->New Project...ကိုရွေးပါ။ASP.NET Core Web App (Model-View-Controller)ကိုရွေးပြီးDotNetTrainingBatch0.Mvcဆိုတဲ့ နာမည်ပေးပါ။
ဒီအဆင့်က Database-First ရဲ့ အဓိက အပိုင်းဖြစ်ပါတယ်။ ကျွန်တော်တို့ အပေါ်မှာဆောက်ခဲ့တဲ့ Tbl_Blog table ကနေ C# class တွေ (Models) နဲ့ Database ချိတ်ဆက်ဖို့ DbContext class ကို EF Core command သုံးပြီး အလိုအလျောက် generate လုပ်ပါမယ်။
-
Install NuGet Packages:
DotNetTrainingBatch0.Databaseproject မှာ အောက်က package တွေကို Install လုပ်ဖို့ လိုအပ်ပါတယ်။Microsoft.EntityFrameworkCore.SqlServerMicrosoft.EntityFrameworkCore.Tools
-
Run
dotnet efCLI Command:dotnet efcommand ကို အသုံးမပြုခင်မှာdotnet-eftool ကို ကိုယ့်စက်ထဲမှာ install လုပ်ထားဖို့ လိုအပ်ပါတယ်။ Command Prompt သို့မဟုတ် Terminal ကိုဖွင့်ပြီး အောက်က command ကို တစ်ကြိမ် run ပေးပါ။dotnet tool install --global dotnet-ef
ပြီးရင်၊ ကျွန်တော်တို့ရဲ့ Solution Folder (
DotNetTrainingBatch0folder) ထဲကို terminal ကနေ သွားပြီး အောက်က command ကို run ပါမယ်။dotnet ef dbcontext scaffold "Server=.;Database=DotNetTrainingBatch0Db;Trusted_Connection=True;TrustServerCertificate=True;" Microsoft.EntityFrameworkCore.SqlServer --project DotNetTrainingBatch0.Database -o Models --forceCommand Breakdown:
dotnet ef dbcontext scaffold: ဒါက Database ကနေ C# class တွေ generate လုပ်ဖို့အတွက်သုံးတဲ့ CLI command ပါ။"...": ဒါက Connection String ပါ။ ကိုယ့်စက်ရဲ့ setting အလိုက် ပြင်ဆင်ဖို့ လိုအပ်ပါတယ်။Microsoft.EntityFrameworkCore.SqlServer: ဒါက ကျွန်တော်တို့သုံးမယ့် Database Provider ပါ။-project DotNetTrainingBatch0.Database: ဒီ command ရဲ့ output file တွေကိုDotNetTrainingBatch0.Databaseproject ထဲမှာ ထည့်ဖို့ သတ်မှတ်ပေးတာပါ။o Models: Generate လုပ်လိုက်တဲ့ file တွေကိုModelsဆိုတဲ့ Folder အောက်မှာ ထားခိုင်းတာပါ။-force:ModelsFolder ထဲမှာ file အဟောင်းတွေရှိနေခဲ့ရင် အသစ်နဲ့ အစားထိုး overwrite လုပ်သွားဖို့အတွက် သုံးပါတယ်။
ပြီးရင် ကျွန်တော်တို့ရဲ့
DotNetTrainingBatch0.Databaseproject ထဲမှာModelsFolder အသစ်နဲ့ အထဲမှာDotNetTrainingBatch0DbContext.csနဲ့TblBlog.csဆိုပြီး file နှစ်ခု ရောက်လာတာကို တွေ့ရမှာပါ။
အခု ကျွန်တော်တို့ရဲ့ DbContext ကို MVC project ကနေ အလွယ်တကူ ခေါ်သုံးလို့ရအောင် Program.cs မှာ service တစ်ခုအနေနဲ့ မှတ်ပုံတင် (Register) လုပ်ပါမယ်။
-
Add Project Reference:
DotNetTrainingBatch0.Mvcproject ကDotNetTrainingBatch0.Databaseproject ကို သိဖို့အတွက် reference ထည့်ဖို့ လိုအပ်ပါတယ်။ -
Register DbContext:
DotNetTrainingBatch0.Mvcproject ရဲ့Program.csfile ကိုဖွင့်ပြီး အောက်က code ကိုbuilder.Services.AddControllersWithViews();ရဲ့ အပေါ်မှာ ထည့်ရေးပါမယ်။// Add using statements at the top of Program.cs using Microsoft.EntityFrameworkCore; using DotNetTrainingBatch0.Database.Models; // ... other code // This line registers the DbContext builder.Services.AddDbContext<DotNetTrainingBatch0DbContext>(options => { string connectionString = builder.Configuration.GetConnectionString("DbConnection"); options.UseSqlServer(connectionString); }, ServiceLifetime.Transient, ServiceLifetime.Transient); builder.Services.AddControllersWithViews();
-
Add Connection String:
appsettings.jsonfile ထဲမှာ အောက်က connection string ကို ထည့်ပေးပါ။"ConnectionStrings": { "DbConnection": "Server=.;Database=DotNetTrainingBatch0Db;User ID=sa;Password=sasa@123;TrustServerCertificate=True;" }
အခု ကျွန်တော်တို့ရဲ့ Blog တွေကို စီမံခန့်ခွဲဖို့ Controller နဲ့ View တွေကို ဆောက်ပါမယ်။
-
Create BlogController:
DotNetTrainingBatch0.Mvcproject ရဲ့ControllersFolder ပေါ်မှာ Right-click နှိပ်ပြီးAdd->Controller...ကိုရွေးပါ။MVC Controller - Emptyကို ရွေးပြီးBlogController.csဆိုတဲ့ နာမည်ပေးပါ။ -
Inject DbContext: Controller ထဲမှာ
DbContextကို သုံးနိုင်ဖို့ constructor injection ကို အောက်ကလို ရေးပြပါမယ်။// Add these using statements at the top using DotNetTrainingBatch0.Database.Models; using Microsoft.EntityFrameworkCore; public class BlogController : Controller { private readonly DotNetTrainingBatch0DbContext _db; public BlogController(DotNetTrainingBatch0DbContext db) { _db = db; } // CRUD actions will go here... }
Blog စာရင်းကိုပြမယ့် Index page ကို အရင်ဆောက်ပါမယ်။
-
Index Action:
BlogControllerထဲမှာ အောက်ကIndexmethod ကို ရေးပါမယ်။public async Task<IActionResult> Index() { var blogs = await _db.TblBlogs .AsNoTracking() // Improves performance for read-only queries .OrderByDescending(x => x.BlogId) .ToListAsync(); return View(blogs); }
-
Index View:
Indexmethod နာမည်ပေါ်မှာ Right-click နှိပ်ပြီးAdd View...->Razor View - Emptyကို ရွေးပါ။Index.cshtmlဆိုတဲ့ view file တစ်ခု ဆောက်ပြီး အောက်က code တွေကို ရေးပြပါမယ်။@model List<TblBlog> <h1>Blog List</h1> <a href="/blog/create" class="btn btn-success">New Blog</a> <table class="table table-striped"> <thead> <tr> <th>ID</th> <th>Title</th> <th>Author</th> <th>Actions</th> </tr> </thead> <tbody> @foreach(var item in Model) { <tr> <td>@item.BlogId</td> <td>@item.BlogTitle</td> <td>@item.BlogAuthor</td> <td> <a href="/blog/edit/@item.BlogId" class="btn btn-warning btn-sm">Edit</a> <a href="/blog/delete/@item.BlogId" class="btn btn-danger btn-sm">Delete</a> </td> </tr> } </tbody> </table>
Blog အသစ်ဖန်တီးဖို့ Page ကို ဆောက်ပါမယ်။
-
Create Actions:
BlogControllerထဲမှာ အောက်က methods နှစ်ခုကို ထပ်ထည့်ပါမယ်။ တစ်ခုက form ကိုပြဖို့ (GET) နဲ့ နောက်တစ်ခုက form ကပို့လိုက်တဲ့ Data ကို သိမ်းဖို့ (POST) ပါ။// Shows the create form [HttpGet] public IActionResult Create() { return View(); } // Saves the new blog data [HttpPost] public async Task<IActionResult> Save(TblBlog blog) { await _db.TblBlogs.AddAsync(blog); await _db.SaveChangesAsync(); return RedirectToAction("Index"); }
-
Create View:
Views/BlogFolder အောက်မှာCreate.cshtmlဆိုတဲ့ file အသစ်ဆောက်ပြီး အောက်က code ကို ရေးပြပါမယ်။<form action="/blog/save" method="post"> <div class="mb-3"> <label class="form-label">Title</label> <input type="text" class="form-control" name="BlogTitle"> </div> <div class="mb-3"> <label class="form-label">Author</label> <input type="text" class="form-control" name="BlogAuthor"> </div> <div class="mb-3"> <label class="form-label">Content</label> <textarea class="form-control" name="BlogContent" rows="3"></textarea> </div> <button type="submit" class="btn btn-primary">Save</button> </form>
ရှိပြီးသား Blog ကို ပြင်ဆင်ဖို့ Page ဆောက်ပါမယ်။
-
Edit/Update Actions:
BlogControllerထဲမှာ အောက်က methods နှစ်ခုကို ထပ်ထည့်ပါမယ်။ တစ်ခုက Data အဟောင်းကို form မှာပြဖို့ (GET) နဲ့ နောက်တစ်ခုက ပြင်လိုက်တဲ့ Data အသစ်ကို သိမ်းဖို့ (POST) ပါ။// Shows the blog to be edited [HttpGet] public async Task<IActionResult> Edit(int id) { var blog = await _db.TblBlogs.FirstOrDefaultAsync(x => x.BlogId == id); if (blog is null) { return RedirectToAction("Index"); } return View(blog); } // Updates the blog data [HttpPost] public async Task<IActionResult> Update(int id, TblBlog blog) { var item = await _db.TblBlogs.FirstOrDefaultAsync(x => x.BlogId == id); if (item is null) { return RedirectToAction("Index"); } item.BlogTitle = blog.BlogTitle; item.BlogAuthor = blog.BlogAuthor; item.BlogContent = blog.BlogContent; await _db.SaveChangesAsync(); return RedirectToAction("Index"); }
-
Edit View:
Views/BlogFolder အောက်မှာEdit.cshtmlfile ဆောက်ပြီး အောက်က code ကို ရေးပြပါမယ်။@model TblBlog <form action="/blog/update/@Model.BlogId" method="post"> <div class="mb-3"> <label class="form-label">Title</label> <input type="text" class="form-control" name="BlogTitle" value="@Model.BlogTitle"> </div> <div class="mb-3"> <label class="form-label">Author</label> <input type="text" class="form-control" name="BlogAuthor" value="@Model.BlogAuthor"> </div> <div class="mb-3"> <label class="form-label">Content</label> <textarea class="form-control" name="BlogContent" rows="3">@Model.BlogContent</textarea> </div> <button type="submit" class="btn btn-primary">Update</button> </form>
Blog ကို ဖျက်ဖို့အတွက် Action ဆောက်ပါမယ်။
-
Delete Action:
BlogControllerမှာ အောက်က method ကို ရေးပါမယ်။[HttpGet] public async Task<IActionResult> Delete(int id) { var item = await _db.TblBlogs.FirstOrDefaultAsync(x => x.BlogId == id); if (item is null) { return RedirectToAction("Index"); } _db.TblBlogs.Remove(item); await _db.SaveChangesAsync(); return RedirectToAction("Index"); }
Note: Index.cshtml မှာ Delete button ကို ကျွန်တော်တို့ ထည့်ပြီးသားဖြစ်တဲ့အတွက် ဒီ action ကို တိုက်ရိုက်ခေါ်သုံးနိုင်မှာ ဖြစ်ပါတယ်။
နောက်ဆုံးအနေနဲ့ ကျွန်တော်တို့ရဲ့ Blog page ကို အလွယ်တကူ သွားလို့ရအောင် Navigation Bar မှာ link ထည့်ပါမယ်။ Views/Shared/_Layout.cshtml file ကို ဖွင့်ပြီး <ul> tag ထဲမှာ အောက်က <li> element ကို ထည့်ပေးပါ။
<li class="nav-item">
<a class="nav-link text-dark" asp-area="" asp-controller="Blog" asp-action="Index">Blog</a>
</li>ပြီးရင်တော့ Project ကို Run ပြီး စမ်းသပ်ကြည့်နိုင်ပါပြီ။ Blog CRUD အားလုံး အလုပ်လုပ်တာကို တွေ့ရမှာဖြစ်ပါတယ်။