Dapper를 사용하여 Blazor CRUD 애플리케이션 구축 방법
깔끔했어
Dapper는 간단한 개체 매퍼입니다.NET는 속도에 있어서 마이크로 ORM의 왕이라는 칭호를 가지고 있다. 왜냐하면 원시 ADO를 사용하는 것과 거의 빠르기 때문이다.NET 데이터 판독기.NuGet 패키지로 사용할 수 있습니다.ORM(객체 관계 맵)은 데이터베이스와 프로그래밍 언어를 매핑합니다.
Dapper는 데이터베이스에 독립적입니다.그것은 데이터베이스에 특정한 실현을 포함하지 않는다.자신의 SQL 쿼리를 작성하려는 사람이 선택한 것이라고 할 수 있습니다.IDbConnection 인터페이스를 확장하는 방법으로만 사용자가 데이터베이스에서 CRUD 작업을 조회하고 실행할 수 있도록 도와줍니다.
Dapper는 생산 중Stack Overflow에 사용되고 있습니다.
데이터베이스 만들기
먼저 BugTracker라는 데이터베이스와 Bugs라는 테이블을 만들어 Bugs 목록을 저장합니다.구체적인 절차는 다음과 같습니다.
Create Table Bugs(
Id BigInt Identity(1,1) Primary Key Not Null,
Summary Varchar(400) Not Null,
BugPriority Varchar(100) Not Null,
Assignee Varchar(100),
BugStatus Varchar(100) Not Null)
오류 테이블Blazor 서버측 어플리케이션 생성
Visual Studio 2019를 열고 새 프로젝트 작성을 선택하고 Blazor 애플리케이션을 선택한 다음 다음을 클릭합니다.
다음 창에서 항목 이름을 제공하고 '만들기' 를 누르십시오.이 예에서 나는 Dapper를 사용했다.CRUD는 Blazor 프로젝트의 이름입니다.
이제 Blazor 서버 응용 프로그램 프로젝트 템플릿을 선택한 다음 '만들기' 를 누르면 Blazor 서버 쪽 응용 프로그램을 만들 수 있습니다.
Dapper 패키지 추가 및 모델 클래스 생성
Dapper를 사용하고 Blazor 애플리케이션의 데이터베이스에 액세스하여 CRUD 작업을 수행하려면 몇 개의 NuGet 패키지를 설치해야 합니다.Package Manager 콘솔에서 다음 명령을 실행하여 필요한 NuGet 패키지를 설치합니다.
패키지 Dapper 버전 2.0.35 설치: Blazor 애플리케이션에서 Dapper를 사용할 수 있습니다.
Microsoft 패키지를 설치합니다.데이터SqlClient-Version 2.0.1: SqlConnection, SqlCommand 등 데이터베이스 액세스 클래스를 제공합니다.MS SQL Server에 대한 데이터 제공 프로그램도 제공합니다.
모델류의 구조데이터 액세스 레이어 생성
데이터 접근층을 만들기 전에 appsettings에 데이터베이스 연결 문자열을 설정해야 합니다.다음 화면 캡처와 같이 json 파일입니다.
데이터베이스 연결 문자열 설정이제 Data 폴더를 마우스 오른쪽 버튼으로 클릭하고 Class를 선택하여 새 클래스를 만듭니다.나는 그것을 BugDataAccessLayer라고 명명했다.대테러 엘리트.현재 이 클래스의 코드를 다음 코드로 바꿉니다. Bugs 테이블에서 CRUD 작업을 처리하는 코드가 포함되어 있습니다.
public class BugDataAccessLayer
{
public IConfiguration Configuration;
private const string BUGTRACKER_DATABASE = "BugTrackerDatabase";
private const string SELECT_BUG = "select * from bugs";
public BugDataAccessLayer(IConfiguration configuration)
{
Configuration = configuration; //Inject configuration to access Connection string from appsettings.json.
}
public async Task<List<Bug>> GetBugsAsync()
{
using (IDbConnection db = new SqlConnection(Configuration.GetConnectionString(BUGTRACKER_DATABASE)))
{
db.Open();
IEnumerable<Bug> result = await db.QueryAsync<Bug>(SELECT_BUG);
return result.ToList();
}
}
public async Task<int> GetBugCountAsync()
{
using (IDbConnection db = new SqlConnection(Configuration.GetConnectionString(BUGTRACKER_DATABASE)))
{
db.Open();
int result = await db.ExecuteScalarAsync<int>("select count(*) from bugs");
return result;
}
}
public async Task AddBugAsync(Bug bug)
{
using (IDbConnection db = new SqlConnection(Configuration.GetConnectionString(BUGTRACKER_DATABASE)))
{
db.Open();
await db.ExecuteAsync("insert into bugs (Summary, BugPriority, Assignee, BugStatus) values (@Summary, @BugPriority, @Assignee, @BugStatus)", bug);
}
}
public async Task UpdateBugAsync(Bug bug)
{
using (IDbConnection db = new SqlConnection(Configuration.GetConnectionString(BUGTRACKER_DATABASE)))
{
db.Open();
await db.ExecuteAsync("update bugs set Summary=@Summary, BugPriority=@BugPriority, Assignee=@Assignee, BugStatus=@BugStatus where id=@Id", bug);
}
}
public async Task RemoveBugAsync(int bugid)
{
using (IDbConnection db = new SqlConnection(Configuration.GetConnectionString(BUGTRACKER_DATABASE)))
{
db.Open();
await db.ExecuteAsync("delete from bugs Where id=@BugId", new { BugId = bugid });
}
}
}
GetBugsasync 메서드는 선택 작업을 수행하고 bugs 테이블에서 bugs 목록을 반환합니다.
AddBugAsync 메서드는 Bugs 테이블에 새 버그를 삽입합니다.
UpdateBugAsync 메서드는 테이블에서 지정된 버그 객체를 업데이트합니다.
RemoveBugAsync 메서드는 ID를 통해 지정된 오류를 제거합니다.
BugDataAccessLayer 등록Syncfusion Blazor 구성 요소 추가
Syncfusion Blazor 구성 요소를 응용 프로그램에 추가하려면 Package Manager 콘솔에서 다음 명령을 실행합니다.
|
Install-Package Syncfusion.Blazor -Version 18.3.0.50 |Syncfusion Blazor 패키지가 종속 섹션에 성공적으로 추가되면 가져오기를 엽니다.razor 파일과 다음 이름 공간을 추가합니다. 이 프로그램에서 Syncfusion Blazor 구성 요소를 사용하는 데 필요합니다.
@using Syncfusion.Blazor
@using Syncfusion.Blazor.Grids
@using Syncfusion.Blazor.Data
using Syncfusion.Blazor;
namespace Dapper.CRUD
{
public class Startup
{
public Startup(IConfiguration configuration)
{
Configuration = configuration;
}
public IConfiguration Configuration { get; }
// This method gets called by the runtime. Use this method to add services to the container.
// For more information on how to configure your application, visit https://go.microsoft.com/fwlink/?LinkID=398940
public void ConfigureServices(IServiceCollection services)
{
services.AddRazorPages();
services.AddServerSideBlazor();
services.AddSingleton<WeatherForecastService>();
services.AddScoped<BugDataAccessLayer>();
services.AddSyncfusionBlazor();
}
. . . . . .
}
}
<link href="_content/Syncfusion.Blazor/styles/bootstrap4.css" rel="stylesheet" />
사용자 정의 데이터 어댑터 만들기
DataGrid의 뚜렷한 특징은 SfDataManager 구성 요소를 사용하여 유연한 데이터 귀속 기능을 실현하는 것이다.데이터 요청과 응답을 처리하기 위해 데이터 소스와 DataGrid 사이의 인터페이스를 충당합니다.DataManager는 ODAta 서비스, 웹 API 등의 데이터 소스와 상호 작용하는 다양한 내장 데이터 어댑터를 제공합니다.만약 제공된 내장 어댑터가 우리의 요구에 부합되지 않는다면, 우리는 간단하게 우리의 사용자 정의 어댑터를 사용하여 수동으로 데이터 조작을 처리할 수 있다.
Bug 테이블을 Syncfusion Blazor 데이터 격자에 바인딩하기 위해 custom data binding feature 를 사용합니다.
사용자 정의 어댑터를 만들 때는 다음 사항을 고려해야 합니다.
public class BugDataAdaptor: DataAdaptor
{
private BugDataAccessLayer _dataLayer;
public BugDataAdaptor(BugDataAccessLayer bugDataAccessLayer)
{
_dataLayer = bugDataAccessLayer;
}
public override async Task<object> ReadAsync(DataManagerRequest dataManagerRequest, string key = null)
{
List<Bug> bugs = await _dataLayer.GetBugsAsync();
int count = await _dataLayer.GetBugCountAsync();
return dataManagerRequest.RequiresCounts ? new DataResult() { Result = bugs, Count = count } : count;
}
public override async Task<object> InsertAsync(DataManager dataManager, object data, string key)
{
await _dataLayer.AddBugAsync(data as Bug);
return data;
}
public override async Task<object> UpdateAsync(DataManager dataManager, object data, string keyField, string key)
{
await _dataLayer.UpdateBugAsync(data as Bug);
return data;
}
public override async Task<object> RemoveAsync(DataManager dataManager, object primaryKeyValue, string keyField, string key)
{
await _dataLayer.RemoveBugAsync(Convert.ToInt32(primaryKeyValue));
return primaryKeyValue;
}
}
Syncfusion Blazor DataGrid 구성 요소 추가
Syncfusion Blazor 구성 요소를 사용하도록 애플리케이션이 구성된 경우 색인에는 다음 DataGrid 구성 요소 코드가 포함됩니다.면도기 페이지.
@using Dapper.CRUD.Data
<SfGrid TValue="Bug" Toolbar="@(new List<string>() { "Add", "Edit", "Delete", "Update", "Cancel" })">
<SfDataManager AdaptorInstance="typeof(BugDataAdaptor)" Adaptor="Adaptors.CustomAdaptor"></SfDataManager>
<GridEditSettings AllowAdding="true" AllowEditing="true" AllowDeleting="true"></GridEditSettings>
<GridColumns>
<GridColumn Field="@nameof(Bug.Id)" IsPrimaryKey="true" Visible="false"></GridColumn>
<GridColumn Field="@nameof(Bug.Summary)" Width="100"></GridColumn>
<GridColumn Field="@nameof(Bug.BugPriority)" HeaderText="Priority" Width="100"></GridColumn>
<GridColumn Field="@nameof(Bug.Assignee)" Width="100"></GridColumn>
<GridColumn Field="@nameof(Bug.BugStatus)" HeaderText="Status" Width="100"></GridColumn>
</GridColumns>
</SfGrid>
행 생성
Blazor 응용 프로그램에서 새 행을 만들려면 도구 모음 추가 버튼을 클릭합니다.새 기록 편집 폼은 아래 화면 캡처와 유사합니다.
새 행 작성에 대한 상세 정보 제공업데이트 도구 모음 버튼을 클릭하면 BugDataAdapter의 InsertAsync 메서드가 호출되어 Bug 테이블에 레코드가 삽입됩니다.격자에 성공적으로 삽입된 기록은 아래 화면 캡처와 유사합니다.
새 행이 있는 오류 테이블한 줄 업데이트
Blazor 응용 프로그램에서 행을 편집하려면 행을 선택하고 편집 도구 모음 버튼을 클릭합니다.폼을 편집하면 아래 화면 캡처와 유사합니다.
기존 행의 값 업데이트여기서 상태 필드의 값을 시작 안 함에서 진행 중으로 업데이트합니다.업데이트 도구 모음 버튼을 클릭하면 BugDataAdapter의 UpdateSync 메서드가 호출되어 Bug 테이블의 레코드가 업데이트됩니다.우리는 현재 이미 기록을 성공적으로 갱신했다.현재 격자는 아래의 화면 캡처와 유사합니다.
한 행 삭제
Blazor 응용 프로그램에서 행을 삭제하려면 행을 선택하고 삭제 도구 모음 버튼을 클릭합니다.Delete 버튼을 클릭하면 BugDataAdapter의 RemoveAsync 메서드를 호출하여 Bug 테이블에서 레코드를 제거합니다.
리소스
자세한 내용은 Blazor DataGrid CRUD application using Dapper demo를 참조하십시오.
결론
이 블로그에서는 SyncfusionBlazor DataGrid 구성 요소를 포함하여 Blazor 서버측 어플리케이션을 만드는 과정을 학습하고 Dapper ORM을 사용하여 CRUD 작업을 수행합니다.
만약 무슨 문제가 있으면 아래의 평론 부분에서 우리에게 알려 주십시오.저희support forums, Direct-Trac 또는 feedback portal를 통해서도 저희에게 연락하실 수 있습니다.우리는 언제든지 기꺼이 당신을 돕겠습니다!
만약 당신이 이 박문을 좋아한다면, 우리는 당신도 다음과 같은 문장을 좋아할 것이라고 생각합니다.
[블로그]
[블로그]
[블로그]
Blazor Succinctly [전자책]
Blazor WebAssembly Succinctly [전자책]
Reference
이 문제에 관하여(Dapper를 사용하여 Blazor CRUD 애플리케이션 구축 방법), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://dev.to/syncfusion/how-to-build-a-blazor-crud-application-with-dapper-3m44텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
좋은 웹페이지 즐겨찾기
