স্বাগতম! আজকের এই লেকচারে আমরা ASP.NET Core Razor View-তে Conditional Rendering বা শর্তসাপেক্ষে কনটেন্ট দেখানোর জন্য Razor If (@if)-এর ব্যবহার শিখব। শুরুতেই চলুন পুরো লেকচারের একটি সংক্ষিপ্ত সামারি দেখে নিই, যা পরবর্তীতে রিভিশন দিতে সাহায্য করবে।
📝 লেকচার সামারি (Quick Revision List)
- Conditional Rendering: View-তে কোনো নির্দিষ্ট HTML কনটেন্ট বা C-sharp কোড তখনই রান করবে, যখন তার কন্ডিশন true হবে।
- Syntax: সাধারণ C-sharp if স্টেটমেন্টের আগে একটি @ (At symbol) বসিয়ে এটি লিখতে হয়। যেমন: @if (condition) { … }।
- Nullable Types: ডাটাবেস বা লজিক অনুযায়ী কোনো ভ্যালু খালি (Null) থাকতে পারে। এর জন্য Model-এ ? ব্যবহার করে প্রপার্টিকে Nullable করা হয় (যেমন: DateTime?)।
- Else / Else If: C-sharp-এর মতো Razor-এও @if-এর সাথে else if এবং else ব্লক ব্যবহার করা যায়।
- Real-world Use Cases: ইউজারের লগিন স্ট্যাটাস চেক করে Login/Logout বাটন দেখানো, অথবা সার্চ রেজাল্ট না পেলে “No results found” মেসেজ দেখানো ইত্যাদি কাজে এটি ব্যবহৃত হয়।
- Debugging: Controller-এর পাশাপাশি .cshtml (Razor View) ফাইলে Breakpoint বসিয়ে কোডের Execution Flow চেক করা যায়।
📖 Comprehensive Breakdown (বিস্তারিত বিশ্লেষণ)
১. Razor @if Statement-এর প্রয়োজনীয়তা (Importance: 10/10)
কেন এটি ব্যবহার করব (The “Why”): বাস্তব প্রোজেক্টে আমরা সব ডাটা সব সময় ইউজারকে দেখাতে চাই না। ধরুন, ইউজার সিস্টেমে লগিন করা থাকলে তাকে “Logout” বাটন দেখাবেন, আর লগিন না থাকলে “Login” বাটন দেখাবেন। এ ধরনের ডায়নামিক ডিসিশন নেওয়ার জন্যই View-এর ভেতর @if ব্যবহার করা হয়।
২. Model Class-এ Nullable Type-এর ব্যবহার (Importance: 8/10)
লেকচারের উদাহরণ অনুযায়ী, একজন ইউজারের DateOfBirth (জন্মতারিখ) নাও থাকতে পারে (অর্থাৎ Null হতে পারে)। এই পরিস্থিতি হ্যান্ডেল করার জন্য Model ক্লাসে পরিবর্তন আনতে হবে। Code Implementation:
public class Person
{
public string Name { get; set; }
// DateTime-এর পর '?' দেওয়ার মানে হলো এই প্রপার্টিতে Null ভ্যালু রাখা যাবে
public DateTime? DateOfBirth { get; set; }
}
৩. View-এর ভেতরে Condition চেক করা (@if এবং else) (Importance: 10/10)
যদি DateOfBirth null হয়, তবে বয়স (Age) ক্যালকুলেট করলে Error আসবে। তাই আমরা @if দিয়ে আগে চেক করে নেব যে, ভ্যালুটি আছে কিনা। Code Implementation:
@using MyApp.Models
@{
Person person = new Person()
{
Name = "Hasib",
DateOfBirth = null // ইচ্ছা করেই Null সেট করা হলো টেস্ট করার জন্য
};
}
<!-- Razor if block শুরু -->
@if (person.DateOfBirth.HasValue)
{
// DateOfBirth যদি Null না হয় (True), তবে এই C-sharp কোড এবং HTML এক্সিকিউট হবে
TimeSpan timeSpan = DateTime.Now - person.DateOfBirth.Value;
double age = Math.Round(timeSpan.TotalDays / 365.25);
<h2>You are @age years old.</h2>
}
else
{
// যদি DateOfBirth Null হয় (False), তবে এই HTML এক্সিকিউট হবে
<h2>Date of birth is unknown.</h2>
}
কীভাবে কাজ করে: Server-side-এ C-sharp কোড এক্সিকিউট হওয়ার সময় কন্ডিশন চেক করা হয়। কন্ডিশন True হলে শুধুমাত্র প্রথম ব্লকের HTML তৈরি হয়ে Browser-এ যায়। False হলে শুধুমাত্র else ব্লকের HTML Browser-এ যায়।
৪. Debugging in Razor Views (Importance: 7/10)
লেকচারার দেখিয়েছেন যে, শুধু Controller নয়, আপনি চাইলে View (.cshtml) ফাইলের কোড ব্লকেও Breakpoint বসাতে পারেন।
- Visual Studio Shortcut: যে লাইনে ব্রেকপয়েন্ট বসাতে চান, সেখানে কার্সর রেখে কীবোর্ডের F9 চাপুন।
- এরপর অ্যাপটি Debug মোডে রান করলে দেখতে পাবেন কীভাবে Controller থেকে View-তে রিকুয়েস্ট আসে এবং লাইন-বাই-লাইন কীভাবে @if কন্ডিশন চেক হয়।
৫. Real-world Scenarios for @if (Importance: 9/10)
লেকচারে আরও কিছু বাস্তব উদাহরণ দেওয়া হয়েছে যেখানে @if অত্যন্ত প্রয়োজনীয়:
- Authentication: @if(User.Identity.IsAuthenticated) হলে ইউজার প্রোফাইল দেখাবে, নাহলে লগিন পেজে রিডাইরেক্ট করার লিংক দেখাবে।
- Search Results: সার্চ করার পর আইটেমের কাউন্ট যদি শুন্যের চেয়ে বেশি হয় (@if(Model.SearchResults.Count > 0)), তবে একটি Table দেখাবে। else ব্লকে দেখাবে “No matching records found”।
🌟 Best Practices & .NET 10 Updates
১. Keep Complex Logic Out of Views (View-কে লজিক-ফ্রি রাখুন): লেকচারে View-এর ভেতরেই Age ক্যালকুলেট করার লজিক দেখানো হয়েছে, যা শুধুমাত্র শেখানোর উদ্দেশ্যে। রিয়েল-ওয়ার্ল্ড বা প্রোডাকশন গ্রেড অ্যাপ্লিকেশনে View-তে কখনোই ডাটা ম্যানিপুলেশন বা ক্যালকুলেশন করা উচিত নয়। Best Practice Example: সব ক্যালকুলেশন Controller বা Business Logic লেয়ারে করে ViewModel-এর মাধ্যমে একটি boolean বা সরাসরি রেজাল্ট View-তে পাঠানো উচিত। Step 1: ViewModel (C# 10+ Records or Classes)
// ViewModel
public class PersonViewModel
{
public string Name { get; set; }
public string DisplayAge { get; set; }
public bool HasAgeInformation { get; set; }
}
Step 2: Controller
public IActionResult Index()
{
var vm = new PersonViewModel { Name = "Hasib" };
// Controller-এই লজিক চেক করা হচ্ছে
if (/* date exists from DB */ false)
{
vm.HasAgeInformation = true;
vm.DisplayAge = "24 years old";
}
else
{
vm.HasAgeInformation = false;
vm.DisplayAge = "Date of birth is unknown.";
}
return View(vm);
}
Step 3: Razor View (.NET 10 approach) View হবে একদম ছিমছাম এবং ক্লিন:
@model PersonViewModel
@if (Model.HasAgeInformation)
{
<h2>You are @Model.DisplayAge</h2>
}
else
{
<h2 class="text-warning">@Model.DisplayAge</h2>
}
২. C# Pattern Matching in Razor (Modern C# feature): আধুনিক C# (C# 9/10/11) ব্যবহার করলে Null চেক করার জন্য .HasValue বা != null লেখার বদলে চমৎকার Pattern Matching ব্যবহার করতে পারেন, যা কোডকে আরও রিডেবল করে।
@* .NET 10 (C# 12+) Modern approach for checking nulls *@
@if (person.DateOfBirth is { } validDate)
{
@* এখানে 'validDate' হলো একটি Non-nullable DateTime ভেরিয়েবল *@
<p>Born in: @validDate.ToString("yyyy")</p>
}
else
{
<p>Birth year not provided.</p>
}