728x90
MAUI(.NET Multi-platform App UI) 애플리케이션을 이용하여 MariaDB와 연동한 CRUD(Create, Read, Update, Delete) 기능을 구현할 수 있습니다. 이 가이드에서는 MAUI와 MariaDB를 사용하여 간단한 CRUD 애플리케이션을 만드는 방법을 설명합니다.
프로젝트 구성 및 준비
1. 개발 환경 설정
필수 설치 프로그램
- .NET SDK: .NET SDK 다운로드
- Visual Studio 2022: MAUI 개발을 위한 기본 IDE (최신 버전 사용 권장)
- MariaDB 서버: MariaDB 다운로드 및 설치
- MySQL Workbench 또는 DBeaver: 데이터베이스 관리 도구 (선택 사항)
데이터베이스 설정
MariaDB 서버 실행
MariaDB 설치 후, 서버를 실행합니다. 일반적으로 시스템에 설치되어 있는 MariaDB 서비스를 시작하면 됩니다.
sudo systemctl start mariadbMariaDB에 접속
터미널에서 MariaDB에 접속합니다.
mysql -u root -p데이터베이스 및 테이블 생성
다음 SQL 명령을 사용하여 데이터베이스와 테이블을 생성합니다.
CREATE DATABASE SampleDB; USE SampleDB; CREATE TABLE Products ( Id INT AUTO_INCREMENT PRIMARY KEY, Name VARCHAR(100) NOT NULL, Price DECIMAL(10, 2) NOT NULL, Quantity INT NOT NULL );
2. MAUI 프로젝트 생성
Visual Studio 2022를 사용하여 MAUI 애플리케이션을 생성하고 데이터베이스에 연결합니다.
프로젝트 생성
Visual Studio 2022를 엽니다.
새 프로젝트 생성을 클릭합니다.
.NET MAUI App (MAUI) 템플릿을 선택하고 프로젝트 이름을
MauiSampleApp으로 지정합니다.프로젝트 생성 위치를 설정하고 만들기 버튼을 클릭합니다.
NuGet 패키지 설치
프로젝트를 생성한 후, MariaDB와 연결하기 위해 MySQL 데이터베이스 드라이버 패키지를 설치해야 합니다.
솔루션 탐색기에서 프로젝트를 마우스 오른쪽 버튼으로 클릭하고 NuGet 패키지 관리를 선택합니다.
찾기 탭에서 다음 패키지를 검색하여 설치합니다:
MySql.DataDapper
Dapper는 경량 ORM으로, SQL 질의문을 직접 작성하여 데이터베이스와 상호작용할 수 있습니다.
3. 데이터베이스 연결 및 모델 생성
MariaDB와의 연결을 위해 모델 클래스 및 데이터베이스 액세스 레이어를 설정합니다.
데이터베이스 연결 문자열
MauiSampleApp 프로젝트의 솔루션 탐색기에서 App.xaml.cs 또는 Settings.cs 파일을 수정하여 연결 문자열을 설정합니다. 일반적으로, 연결 문자열은 별도의 설정 파일에 저장하지만, 간단한 예제를 위해 코드에 직접 포함시킵니다.
public static class DatabaseConfig
{
public const string ConnectionString = "Server=localhost;Database=SampleDB;User=root;Password=your_password;";
}
참고:
your_password를 MariaDB root 사용자의 실제 비밀번호로 변경하세요.
모델 클래스 생성
Models 폴더에 Product.cs 파일을 생성하고 다음 코드를 추가합니다.
using System.ComponentModel.DataAnnotations;
namespace MauiSampleApp.Models
{
public class Product
{
public int Id { get; set; }
[Required]
[StringLength(100)]
public string Name { get; set; }
[Range(0.01, 10000)]
public decimal Price { get; set; }
[Range(1, 1000)]
public int Quantity { get; set; }
}
}데이터베이스 액세스 클래스 생성
Services 폴더에 ProductService.cs 파일을 생성하고 데이터베이스 액세스 코드를 추가합니다.
using System.Collections.Generic;
using System.Data;
using Systehttp://m.Threading.Tasks;
using Dapper;
using MySql.Data.MySqlClient;
using MauiSampleApp.Models;
namespace MauiSampleApp.Services
{
public class ProductService
{
private readonly string _connectionString;
public ProductService(string connectionString)
{
_connectionString = connectionString;
}
public IDbConnection Connection => new MySqlConnection(_connectionString);
public async Task<IEnumerable<Product>> GetAllProductsAsync()
{
using (var conn = Connection)
{
return await conn.QueryAsync<Product>("SELECT * FROM Products");
}
}
public async Task<Product> GetProductByIdAsync(int id)
{
using (var conn = Connection)
{
return await conn.QueryFirstOrDefaultAsync<Product>("SELECT * FROM Products WHERE Id = @Id", new { Id = id });
}
}
public async Task<int> AddProductAsync(Product product)
{
using (var conn = Connection)
{
var sql = "INSERT INTO Products (Name, Price, Quantity) VALUES (@Name, @Price, @Quantity)";
return await conn.ExecuteAsync(sql, product);
}
}
public async Task<int> UpdateProductAsync(Product product)
{
using (var conn = Connection)
{
var sql = "UPDATE Products SET Name = @Name, Price = @Price, Quantity = @Quantity WHERE Id = @Id";
return await conn.ExecuteAsync(sql, product);
}
}
public async Task<int> DeleteProductAsync(int id)
{
using (var conn = Connection)
{
var sql = "DELETE FROM Products WHERE Id = @Id";
return await conn.ExecuteAsync(sql, new { Id = id });
}
}
}
}4. MAUI UI 구현
이제 UI를 구현하여 CRUD 기능을 제공하는 페이지를 만들겠습니다.
MainPage.xaml
MainPage.xaml 파일을 열고 다음 코드를 추가합니다. 이 파일은 간단한 CRUD 인터페이스를 제공합니다.
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:local="clr-namespace:MauiSampleApp"
x:Class="MauiSampleApp.MainPage">
<ContentPage.BindingContext>
<local:MainViewModel />
</ContentPage.BindingContext>
<VerticalStackLayout Padding="10">
<Label Text="Products" FontSize="24" HorizontalOptions="Center" />
<CollectionView ItemsSource="{Binding Products}" SelectionMode="Single" SelectionChanged="OnSelectionChanged">
<CollectionView.ItemTemplate>
<DataTemplate>
<StackLayout Orientation="Horizontal" Padding="10">
<Label Text="{Binding Name}" FontSize="18" />
<Label Text="{Binding Price, StringFormat='Price: {0:C}'}" Margin="10,0,0,0" />
<Label Text="{Binding Quantity, StringFormat='Qty: {0}'}" Margin="10,0,0,0" />
</StackLayout>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
<StackLayout Orientation="Vertical" Padding="10">
<Entry Placeholder="Name" Text="{Binding NewProduct.Name}" />
<Entry Placeholder="Price" Text="{Binding NewProduct.Price}" Keyboard="Numeric" />
<Entry Placeholder="Quantity" Text="{Binding NewProduct.Quantity}" Keyboard="Numeric" />
<Button Text="Add Product" Command="{Binding AddProductCommand}" />
<Button Text="Update Product" Command="{Binding UpdateProductCommand}" IsEnabled="{Binding IsProductSelected}" />
<Button Text="Delete Product" Command="{Binding DeleteProductCommand}" IsEnabled="{Binding IsProductSelected}" />
</StackLayout>
</VerticalStackLayout>
</ContentPage>MainPage.xaml.cs
MainPage.xaml.cs 파일에 데이터 바인딩 및 명령 처리를 위한 코드를 추가합니다.
using MauiSampleApp.ViewModels;
namespace MauiSampleApp
{
public partial class MainPage : ContentPage
{
public MainPage()
{
InitializeComponent();
}
private void OnSelectionChanged(object sender, SelectionChangedEventArgs e)
{
var viewModel = (MainViewModel)BindingContext;
viewModel.SelectedProduct = (Product)e.CurrentSelection.FirstOrDefault();
}
}
}ViewModel 생성
ViewModels 폴더에 MainViewModel.cs 파일을 생성하고 다음 코드를 추가합니다.
using System.Collections.ObjectModel;
using System.ComponentModel;
using System.Runtime.CompilerServices;
using Systehttp://m.Windows.Input;
using MauiSampleApp.Models;
using MauiSampleApp.Services;
using Microsoft.Maui.Controls;
namespace MauiSampleApp.ViewModels
{
public class MainViewModel : INotifyPropertyChanged
{
private readonly ProductService _productService;
private Product _selectedProduct;
private bool _isProductSelected;
public ObservableCollection<Product> Products { get; set; }
public Product NewProduct { get; set; }
public Product SelectedProduct
{
get => _selectedProduct;
set
{
_selectedProduct = value;
OnPropertyChanged();
IsProductSelected = _selectedProduct != null;
}
}
public bool IsProductSelected
{
get => _isProductSelected;
set
{
_isProductSelected = value;
OnPropertyChanged();
}
}
public ICommand AddProductCommand { get; }
public ICommand UpdateProductCommand { get; }
public ICommand DeleteProductCommand { get; }
public event PropertyChangedEventHandler PropertyChanged;
public MainViewModel()
{
_productService = new ProductService(DatabaseConfig.ConnectionString);
Products = new ObservableCollection<Product>();
NewProduct = new Product();
LoadProducts();
AddProductCommand = new Command(async () => await AddProduct());
UpdateProductCommand = new Command(async () => await UpdateProduct(), () => IsProductSelected);
DeleteProductCommand = new Command(async () => await DeleteProduct(), () => IsProductSelected);
}
private async void LoadProducts()
{
var products = await _productService.GetAllProductsAsync();
foreach (var product in products)
{
Products.Add(product);
}
}
private async Task AddProduct()
{
await _productService.AddProductAsync(NewProduct);
Products.Clear();
LoadProducts();
NewProduct = new Product();
OnPropertyChanged(nameof(NewProduct));
}
private async Task UpdateProduct()
{
await _productService.UpdateProductAsync(SelectedProduct);
Products.Clear();
LoadProducts();
}
private async Task DeleteProduct()
{
await _productService.DeleteProductAsync(SelectedProduct.Id);
Products.Clear();
LoadProducts();
}
protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null)
{
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
}
}
}5. 애플리케이션 실행 및 테스트
애플리케이션 실행
Visual Studio에서 디버그 버튼을 클릭하여 애플리케이션을 실행합니다. Android 에뮬레이터 또는 Windows Machine을 선택할 수 있습니다.
CRUD 기능 테스트
- 제품 목록을 확인하고 추가, 수정, 삭제 기능을 테스트합니다.
- 제품의 이름, 가격, 수량을 입력한 후 Add Product 버튼을 클릭하여 새 제품을 추가합니다.
- 목록에서 제품을 선택한 후 Update Product 버튼을 클릭하여 제품 정보를 수정합니다.
- 목록에서 제품을 선택한 후 Delete Product 버튼을 클릭하여 제품을 삭제합니다.
요약
이 예제에서는 MAUI와 MariaDB를 사용하여 간단한 CRUD 애플리케이션을 만드는 방법을 설명했습니다. MAUI를 사용하여 Android, Windows, iOS 및 macOS와 같은 여러 플랫폼에서 실행할 수 있는 단일 코드베이스 애플리케이션을 쉽게 개발할 수 있습니다.
추가 참고 자료
더 궁금한 점이 있거나 추가적인 도움이 필요하시면 언제든지 문의해 주세요!
728x90
반응형
'Software > C#' 카테고리의 다른 글
| MAUI 시작하기 - Barcode (0) | 2024.07.28 |
|---|---|
| MAUI 시작하기 - QRcode (0) | 2024.07.28 |
| C# 시작하기 - MAUI 소개 (0) | 2024.07.28 |
| ASP.NET 시작하기 - 템플릿 엔진 (0) | 2024.07.28 |
| ASP.NET 시작하기 - Razor (0) | 2024.07.28 |