MVVM (Model-View-ViewModel) হল একটি জনপ্রিয় ডিজাইন প্যাটার্ন যা বিশেষভাবে .NET MAUI, Xamarin, এবং অন্যান্য UI ভিত্তিক অ্যাপ্লিকেশন ডেভেলপমেন্টে ব্যবহৃত হয়। এটি অ্যাপ্লিকেশনের UI এবং লজিকের মধ্যে পরিষ্কারভাবে পার্থক্য করে, এবং অ্যাপ্লিকেশন উন্নয়নকে আরও পরিষ্কার, মডুলার এবং মেইনটেনেবল করে।
MVVM প্যাটার্ন তিনটি প্রধান উপাদান নিয়ে কাজ করে:
public class User
{
public string Name { get; set; }
public string Email { get; set; }
}
public class UserViewModel : INotifyPropertyChanged
{
private string _userName;
private string _userEmail;
public event PropertyChangedEventHandler PropertyChanged;
public string UserName
{
get => _userName;
set
{
_userName = value;
OnPropertyChanged();
}
}
public string UserEmail
{
get => _userEmail;
set
{
_userEmail = value;
OnPropertyChanged();
}
}
public ICommand LoadUserDataCommand { get; }
public UserViewModel()
{
LoadUserDataCommand = new Command(LoadUserData);
}
private void LoadUserData()
{
// Load data from model or API
UserName = "John Doe";
UserEmail = "john.doe@example.com";
}
protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null)
{
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
}
}
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
x:Class="MauiApp.MainPage">
<StackLayout>
<Label Text="User Information" FontSize="24" HorizontalOptions="Center" />
<Label Text="{Binding UserName}" FontSize="18" />
<Label Text="{Binding UserEmail}" FontSize="18" />
<Button Text="Load User Data"
Command="{Binding LoadUserDataCommand}" />
</StackLayout>
</ContentPage>
public partial class MainPage : ContentPage
{
public MainPage()
{
InitializeComponent();
BindingContext = new UserViewModel();
}
}
MVVM ডিজাইন প্যাটার্নের মাধ্যমে .NET MAUI অ্যাপ্লিকেশন গুলির UI এবং ব্যবসায়িক লজিক পৃথক করা যায়, যা কোডের রক্ষণাবেক্ষণ, টেস্টিং, এবং পুনঃব্যবহারযোগ্যতা বাড়ায়। এই প্যাটার্নে Model, View, এবং ViewModel সঠিকভাবে একে অপরের সাথে ইন্টারঅ্যাক্ট করে, যাতে অ্যাপ্লিকেশন আরও ক্লিন এবং মডুলার হয়।
MVVM (Model-View-ViewModel) হল একটি সফটওয়্যার আর্কিটেকচার প্যাটার্ন, যা প্রধানত UI (User Interface) ভিত্তিক অ্যাপ্লিকেশন তৈরি করতে ব্যবহৃত হয়। এটি অ্যাপ্লিকেশনের UI এবং লজিক এর মধ্যে একটি স্পষ্ট পার্থক্য সৃষ্টি করে এবং সেগুলিকে আলাদা করে কাজ করতে সহায়ক। MVVM প্যাটার্নটি বিশেষভাবে .NET MAUI, WPF, Xamarin, UWP এবং অন্যান্য UI ফ্রেমওয়ার্কে জনপ্রিয়।
MVVM তে তিনটি প্রধান উপাদান থাকে:
ধরা যাক, আমাদের একটি Person মডেল আছে এবং আমরা এটি View তে প্রদর্শন করতে চাই।
Model:
public class Person
{
public string Name { get; set; }
public int Age { get; set; }
}
ViewModel:
public class PersonViewModel
{
public Person CurrentPerson { get; set; }
public PersonViewModel()
{
CurrentPerson = new Person { Name = "John Doe", Age = 30 };
}
}
XAML (View):
<Label Text="{Binding CurrentPerson.Name}" />
<Label Text="{Binding CurrentPerson.Age}" />
Code-behind:
public partial class MainPage : ContentPage
{
public MainPage()
{
InitializeComponent();
BindingContext = new PersonViewModel();
}
}
MVVM (Model-View-ViewModel) একটি জনপ্রিয় ডিজাইন প্যাটার্ন যা .NET MAUI এবং অন্যান্য UI ভিত্তিক অ্যাপ্লিকেশনের উন্নয়নে ব্যবহৃত হয়। এটি মূলত UI (ব্যবহারকারীর ইন্টারফেস) এবং ব্যাকএন্ড লজিক (ডেটা এবং ব্যবসায়িক লজিক) এর মধ্যে পরিষ্কার আলাদা করার জন্য ডিজাইন করা হয়েছে। MVVM প্যাটার্নে তিনটি মূল উপাদান থাকে:
এই তিনটি উপাদান একে অপরের সাথে যোগাযোগ করে, কিন্তু তাদের কাজ এবং দায়িত্বের ক্ষেত্র আলাদা থাকে।
Model হল অ্যাপ্লিকেশনের ডেটা এবং ব্যবসায়িক লজিক। এটি সমস্ত ডেটা বা ডেটার সংজ্ঞা, নিয়ম এবং এপ্লিকেশনের শর্তাবলী ধারণ করে। Model এর প্রধান কাজ হল ডেটা সংরক্ষণ এবং ডেটা সম্পর্কিত কাজ করা, যেমন: ডেটা সংগ্রহ করা, আপডেট করা বা ভ্যালিডেশন করা।
public class Person
{
public string Name { get; set; }
public int Age { get; set; }
}
এখানে, Person একটি Model যা ডেটা ধারণ করে, যেমন Name এবং Age।
View হল ব্যবহারকারীর ইন্টারফেস (UI), যা ব্যবহারকারীকে ডেটা দেখায় এবং ব্যবহারকারীর ইন্টারঅ্যাকশন গ্রহণ করে। এটি মূলত UI কন্ট্রোল (যেমন: Label, Button, Entry) থেকে গঠিত। View এর মূল কাজ হল দেখানো এবং ইন্টারঅ্যাক্ট করা; তবে এতে কোনো ব্যবসায়িক লজিক বা ডেটা প্রক্রিয়াকরণের কাজ থাকে না।
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
x:Class="MyApp.MainPage">
<Label Text="{Binding Name}" />
<Button Text="Change Name" Command="{Binding ChangeNameCommand}" />
</ContentPage>
এখানে, Label এবং Button হল View উপাদান যা ViewModel এর সাথে data binding এর মাধ্যমে যুক্ত।
ViewModel হল Model এবং View এর মধ্যে একটি মধ্যস্থতাকারী উপাদান। এটি Model থেকে ডেটা সংগ্রহ করে এবং View এর জন্য উপস্থাপনযোগ্য রূপে রূপান্তরিত করে। ViewModel ব্যবহারকারীর ইন্টারঅ্যাকশন এবং ডেটা চেঞ্জ এর জন্য ইভেন্ট এবং কমান্ড সরবরাহ করে।
public class MainPageViewModel : INotifyPropertyChanged
{
private string _name;
public string Name
{
get => _name;
set
{
_name = value;
OnPropertyChanged();
}
}
public ICommand ChangeNameCommand { get; }
public MainPageViewModel()
{
ChangeNameCommand = new Command(ChangeName);
}
private void ChangeName()
{
Name = "John Smith";
}
public event PropertyChangedEventHandler PropertyChanged;
protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = "")
{
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
}
}
এখানে, ViewModel Name প্রপার্টি এবং ChangeNameCommand কমান্ডের মাধ্যমে View কে ডেটা এবং ইন্টারঅ্যাকশন সরবরাহ করছে।
Person ক্লাস)।Label, Button যা ব্যবহারকারীকে দেখানো হয় এবং ইন্টারঅ্যাকশন নেওয়া হয়।MVVM প্যাটার্ন ব্যবহার করলে:
এভাবে, MVVM অ্যাপ্লিকেশন ডেভেলপমেন্টকে পরিষ্কার, মডুলার এবং পুনঃব্যবহারযোগ্য করে তোলে।
Dependency Injection (DI) এবং MVVM Toolkit দুটি গুরুত্বপূর্ণ ধারণা যা .NET MAUI এবং Xamarin.Forms সহ অন্যান্য .NET অ্যাপ্লিকেশন উন্নয়ন ব্যবস্থায় ব্যবহৃত হয়। এগুলি বিশেষভাবে MVVM (Model-View-ViewModel) আর্কিটেকচারের উন্নয়ন প্রক্রিয়ায় সাহায্য করে এবং অ্যাপ্লিকেশন ডিজাইনকে আরও সিস্টেম্যাটিক ও মডুলার করে তোলে।
Dependency Injection (DI) একটি ডিজাইন প্যাটার্ন যা অবজেক্ট বা ক্লাসের মধ্যে নির্ভরশীলতা (dependencies) ইনজেক্ট করার জন্য ব্যবহৃত হয়, যাতে কোডের পুনঃব্যবহারযোগ্যতা, পরীক্ষাযোগ্যতা এবং রক্ষণাবেক্ষণযোগ্যতা বৃদ্ধি পায়।
ব্যবহার:
উদাহরণ:
public interface ILoggingService
{
void Log(string message);
}
public class ConsoleLoggingService : ILoggingService
{
public void Log(string message)
{
Console.WriteLine(message);
}
}
using Microsoft.Extensions.DependencyInjection;
public class App : Application
{
public App()
{
var services = new ServiceCollection();
services.AddSingleton<ILoggingService, ConsoleLoggingService>(); // DI Setup
var serviceProvider = services.BuildServiceProvider();
var loggingService = serviceProvider.GetRequiredService<ILoggingService>();
loggingService.Log("Hello, Dependency Injection!");
MainPage = new MainPage();
}
}
এখানে, আমরা ILoggingService এবং তার ConsoleLoggingService বাস্তবায়নটি তৈরি করেছি। App ক্লাসে, আমরা DI কন্টেইনারের মাধ্যমে ILoggingService কে ইনজেক্ট করেছি এবং তার পরে আমরা তা ব্যবহার করে একটি বার্তা লগ করেছি।
MVVM (Model-View-ViewModel) একটি আর্কিটেকচারাল প্যাটার্ন যা অ্যাপ্লিকেশনের ইউআই এবং লজিকের মধ্যে এক ধরনের বিচ্ছেদ বজায় রাখে। MVVM Toolkit হল একটি টুলকিট যা MVVM প্যাটার্নের বাস্তবায়নকে সহজ এবং দ্রুত করে তোলে।
MVVM প্যাটার্নে:
MVVM Toolkit ডেভেলপারদের জন্য একটি শক্তিশালী টুল সেট প্রদান করে যা INotifyPropertyChanged, ObservableCollection, এবং অন্যান্য MVVM সেন্ট্রাল উপাদানগুলির সঙ্গে একযোগে কাজ করতে সহায়ক।
ব্যবহার:
1. Install MVVM Toolkit (NuGet Package):
আপনি MVVM Toolkit প্যাকেজটি NuGet থেকে ইনস্টল করতে পারেন:
Install-Package CommunityToolkit.Mvvm
2. ViewModel তৈরি করা:
MVVM Toolkit এ আপনি সাধারণত ObservableObject বা ObservableObjectBase ক্লাসকে ব্যবহার করে সহজে প্রপার্টি পরিবর্তন এবং ডেটা-বাইন্ডিং পরিচালনা করতে পারেন।
using CommunityToolkit.Mvvm.ComponentModel;
public class MainPageViewModel : ObservableObject
{
private string name;
public string Name
{
get => name;
set => SetProperty(ref name, value);
}
public MainPageViewModel()
{
Name = "Hello, .NET MAUI!";
}
}
এখানে, ObservableObject ক্লাসটি INotifyPropertyChanged এর কার্যকারিতা সরবরাহ করে। SetProperty মেথডটি প্রপার্টির পরিবর্তন ট্র্যাক করতে ব্যবহৃত হয়, যা UI-তে ডেটা আপডেট করে।
3. View (XAML) এবং ViewModel এর মধ্যে ডেটা-বাইন্ডিং:
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
x:Class="MauiApp.MainPage">
<Label Text="{Binding Name}"
VerticalOptions="CenterAndExpand"
HorizontalOptions="CenterAndExpand" />
</ContentPage>
এখানে, Label এর Text প্রপার্টি ViewModel এর Name প্রপার্টির সাথে বাইন্ড করা হয়েছে। যখন Name পরিবর্তিত হবে, UI অটোমেটিকভাবে সেই পরিবর্তন প্রতিফলিত করবে।
4. Dependency Injection এবং ViewModel সংযোগ:
public class App : Application
{
public App()
{
var services = new ServiceCollection();
services.AddSingleton<MainPageViewModel>(); // Inject ViewModel
var serviceProvider = services.BuildServiceProvider();
var mainPageViewModel = serviceProvider.GetRequiredService<MainPageViewModel>();
MainPage = new MainPage
{
BindingContext = mainPageViewModel // Set ViewModel to the View
};
}
}
এখানে, MainPageViewModel কে DI কন্টেইনারের মাধ্যমে MainPage এর BindingContext হিসেবে ইনজেক্ট করা হয়েছে, যাতে Name প্রপার্টি UI-তে প্রদর্শিত হতে পারে।
MVVM (Model-View-ViewModel) এবং Clean Architecture দুটি জনপ্রিয় আর্কিটেকচার প্যাটার্ন, যা একসাথে ব্যবহার করলে একটি সহজ, সুসংগঠিত এবং পরিস্কার কোডবেস তৈরি করতে সাহায্য করে। .NET MAUI অ্যাপ্লিকেশনে এই দুটি প্যাটার্ন ব্যবহার করে একটি শক্তিশালী এবং বর্ধনশীল অ্যাপ্লিকেশন তৈরি করা যায়।
Clean Architecture হল একটি সফটওয়্যার আর্কিটেকচার কৌশল যা অ্যাপ্লিকেশনের বিভিন্ন অংশকে আলাদা করে, যেমনঃ ডোমেইন লজিক, ডেটা অ্যাক্সেস, UI, ইত্যাদি, যাতে কোড রক্ষণাবেক্ষণ এবং পরবর্তী সময়ে এক্সটেনশন সহজ হয়।
এই টিউটোরিয়ালে MVVM এবং Clean Architecture ব্যবহার করে .NET MAUI অ্যাপ্লিকেশনে একটি সুন্দর আর্কিটেকচার তৈরি করার ধাপগুলি তুলে ধরা হবে।
Clean Architecture প্রাথমিকভাবে ৪টি স্তরে বিভক্ত:
এখানে, MVVM প্যাটার্নটি Interface Adapters স্তরে ব্যবহার করা হয়, যেখানে ViewModel ডোমেইন থেকে ডাটা নিয়ে ইউআই (View) এর মধ্যে পার্স করা হয়।
MVVM প্যাটার্নের তিনটি প্রধান উপাদান:
এখন, Clean Architecture অনুসারে MVVM প্যাটার্নটি .NET MAUI অ্যাপ্লিকেশনে প্রয়োগ করতে নিচের স্তরগুলো তৈরি করতে হবে:
এটি প্রস্তাবিত প্রকল্পের কাঠামো, যেখানে প্রতিটি স্তর পরিষ্কারভাবে আলাদা করা হয়েছে:
- Core (Entities, Use Cases)
- Models
- Interfaces
- Services
- Application (Use Cases)
- ViewModels
- Commands
- Services
- Infrastructure (Frameworks, Data Access)
- Data
- API
- Repositories
- UI (Interface Adapters)
- Views
- Resources
- Pages
এখানে আপনি আপনার অ্যাপ্লিকেশনের ডোমেইন মডেল তৈরি করবেন। এগুলি অ্যাপ্লিকেশনের ব্যাসিক ডাটা স্ট্রাকচারগুলির প্রতিনিধিত্ব করে। উদাহরণস্বরূপ:
public class User
{
public string Name { get; set; }
public string Email { get; set; }
}
Use Cases অ্যাপ্লিকেশনের ব্যবসায়িক লজিক বা ইউজারের কার্যকলাপগুলির প্রতিনিধিত্ব করে। প্রতিটি ইউজার ইন্টারঅ্যাকশনের জন্য একটি UseCase তৈরি করা হয়। উদাহরণস্বরূপ, একটি ইউজারের তথ্য নেওয়ার জন্য:
public class GetUserDataUseCase
{
private readonly IUserRepository _userRepository;
public GetUserDataUseCase(IUserRepository userRepository)
{
_userRepository = userRepository;
}
public User Execute()
{
return _userRepository.GetUserData();
}
}
এখন, ViewModel তৈরি করা হবে যা Use Case এর মাধ্যমে ডেটা এবং লজিক View এর মধ্যে সঠিকভাবে ব্যাখ্যা করবে।
public class UserViewModel : INotifyPropertyChanged
{
private readonly GetUserDataUseCase _getUserDataUseCase;
private User _user;
public User User
{
get => _user;
set
{
_user = value;
OnPropertyChanged(nameof(User));
}
}
public UserViewModel(GetUserDataUseCase getUserDataUseCase)
{
_getUserDataUseCase = getUserDataUseCase;
}
public void LoadUserData()
{
User = _getUserDataUseCase.Execute();
}
public event PropertyChangedEventHandler PropertyChanged;
private void OnPropertyChanged(string propertyName)
{
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
}
}
এখন XAML পেজ তৈরি করা হবে যেখানে ViewModel এর মাধ্যমে ডেটা এবং ইউজারের ইন্টারঅ্যাকশন পরিচালিত হবে।
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:YourAppNamespace"
x:Class="YourAppNamespace.UserPage">
<Label Text="{Binding User.Name}" />
<Label Text="{Binding User.Email}" />
<Button Text="Load Data" Command="{Binding LoadUserCommand}" />
</ContentPage>
এখানে, User.Name এবং User.Email ViewModel থেকে ব্যাখ্যা করা হবে এবং LoadUserCommand কমান্ডের মাধ্যমে ইউজার ডেটা লোড করা হবে।
ডিপেনডেন্সি ইনজেকশনের মাধ্যমে ViewModel, UseCase এবং Repository এর মধ্যে যোগাযোগ স্থাপন করা হবে। এটি App.xaml.cs-এ করতে হবে:
public partial class App : Application
{
public App()
{
InitializeComponent();
// Dependency Injection
var container = new Container();
container.Register<IUserRepository, UserRepository>();
container.Register<GetUserDataUseCase>();
container.Register<UserViewModel>();
var viewModel = container.Resolve<UserViewModel>();
MainPage = new UserPage
{
BindingContext = viewModel
};
}
}
MVVM এবং Clean Architecture এর মাধ্যমে .NET MAUI অ্যাপ্লিকেশন তৈরি করা একটি শক্তিশালী এবং পরিস্কার আর্কিটেকচার প্রদান করে, যা কোড পুনঃব্যবহারযোগ্যতা, পরীক্ষণ, এবং রক্ষণাবেক্ষণকে সহজ করে তোলে। এখানে:
এই আর্কিটেকচারটি অ্যাপ্লিকেশনকে আরও স্কেলেবল, মডুলার এবং ভবিষ্যত পরিবর্তন সমর্থনযোগ্য করে তোলে।
Read more
or
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
