initial commit

This commit is contained in:
2026-07-21 10:12:35 +07:00
commit 72a9b3fea1
101 changed files with 7740 additions and 0 deletions
+448
View File
@@ -0,0 +1,448 @@
<!DOCTYPE html>
<html lang="en" itemscope itemtype="https://schema.org/Product">
<head>
<script async src="https://www.googletagmanager.com/gtag/js?id=G-G9G5HP50VK"></script>
<script>window.dataLayer=window.dataLayer||[];function gtag(){dataLayer.push(arguments);}gtag('js',new Date());gtag('config','G-G9G5HP50VK');</script>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<title>Blazor HRM Multi-Tenant — SaaS HRM with Multi-Tenancy .NET 10 Source Code | Indotalent</title>
<meta name="description" content="Complete SaaS HRM with Multi-Tenancy source code built with .NET 10, Blazor Server, MudBlazor, and Vertical Slice Architecture. Tenant isolation, employee management, leave tracking, payroll reports. $21 instant download." />
<meta name="keywords" content="Blazor HRM Multi-Tenant, SaaS HRM, Multi-Tenant HRM, .NET 10, Blazor Server, MudBlazor, Vertical Slice Architecture, HRM source code, ASP.NET Core SaaS" />
<meta name="robots" content="index,follow" />
<link rel="canonical" href="https://www.indotalent.com/products/blazor-hrm-multitenant.html" />
<meta property="og:title" content="Blazor HRM Multi-Tenant — SaaS HRM with Multi-Tenancy .NET 10 Source Code | Indotalent" />
<meta property="og:description" content="Complete SaaS HRM source code with multi-tenancy. .NET 10, Blazor Server, MudBlazor, VSA. Employee, leave, payroll. $21." />
<meta property="og:type" content="product" />
<meta property="og:url" content="https://www.indotalent.com/products/blazor-hrm-multitenant.html" />
<meta property="og:image" content="https://www.indotalent.com/img/hrm-multi-tenant-saas-01.png" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="Blazor HRM Multi-Tenant — .NET 10 SaaS HRM with Multi-Tenancy Source Code" />
<meta name="twitter:description" content="Complete SaaS HRM source code with multi-tenancy. Blazor Server, MudBlazor, VSA. $21 instant download." />
<meta name="twitter:image" content="https://www.indotalent.com/img/hrm-multi-tenant-saas-01.png" />
<link rel="icon" type="image/x-icon" href="../favicon.ico" />
<script src="https://cdn.tailwindcss.com"></script>
<script defer src="https://cdn.jsdelivr.net/npm/alpinejs@3.x.x/dist/cdn.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.5/gsap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.5/ScrollTrigger.min.js"></script>
<script src="https://assets.lemonsqueezy.com/lemon.js" defer></script>
<script>tailwind.config={theme:{extend:{colors:{brand:{50:"#fff7ed",100:"#ffedd5",200:"#fed7aa",300:"#fdba74",400:"#fb923c",500:"#f97316",600:"#ea580c",700:"#c2410c",800:"#9a3412",900:"#7c2d12"}},fontFamily:{sans:["Inter","system-ui","sans-serif"]}}}}</script>
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "SoftwareApplication",
"name": "Blazor HRM Multi-Tenant",
"applicationCategory": "BusinessApplication",
"operatingSystem": "Windows, Linux, macOS",
"description": "Multi-tenant SaaS HRM application built with .NET 10 Blazor Server, Vertical Slice Architecture, and MudBlazor. Complete source code with tenant isolation, employee management, leave tracking, and payroll reporting.",
"url": "https://www.indotalent.com/products/blazor-hrm-multitenant.html"il": "2027-12-31" },
"aggregateRating": { "@type": "AggregateRating", "ratingValue": "4.8", "reviewCount": "150" }
}
</script>
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "BreadcrumbList",
"itemListElement": [
{ "@type": "ListItem", "position": 1, "name": "Home", "item": "https://www.indotalent.com/" },
{ "@type": "ListItem", "position": 2, "name": "Products", "item": "https://www.indotalent.com/#products" },
{ "@type": "ListItem", "position": 3, "name": "Blazor HRM Multi-Tenant", "item": "https://www.indotalent.com/products/blazor-hrm-multitenant.html" }
]
}
</script>
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "FAQPage",
"mainEntity": [
{
"@type": "Question",
"name": "What features does Blazor HRM Multi-Tenant include?",
"acceptedAnswer": { "@type": "Answer", "text": "Blazor HRM Multi-Tenant includes multi-tenant employee management, department and designation management, leave tracking with approval workflows, attendance tracking, payroll reporting, dashboard with workforce KPIs, tenant isolation via EF Core global query filters, and full audit trail. All built with .NET 10, Blazor Server, MudBlazor, and VSA." }
},
{
"@type": "Question",
"name": "Does Blazor HRM Multi-Tenant include REST API?",
"acceptedAnswer": { "@type": "Answer", "text": "Yes! Blazor HRM Multi-Tenant exposes a complete REST Web API built with ASP.NET Core Minimal APIs with Swagger/OpenAPI documentation, JWT authentication, and proper HTTP status codes for all tenant-scoped employee, leave, attendance, and payroll operations." }
},
{
"@type": "Question",
"name": "Can I customize Blazor HRM Multi-Tenant for my clients?",
"acceptedAnswer": { "@type": "Answer", "text": "Absolutely. You receive the complete, unrestricted C# source code. Rebrand, add custom fields, modify leave policies, integrate payroll, and deploy as your own SaaS HRM platform. Each client project requires a separate $21 license." }
},
{
"@type": "Question",
"name": "What database does Blazor HRM Multi-Tenant use?",
"acceptedAnswer": { "@type": "Answer", "text": "SQL Server is fully tested and ready with EF Core migrations and seed data. PostgreSQL support is scaffolded in the codebase but not yet fully tested. Switch between databases by changing connection string and provider in Program.cs." }
},
{
"@type": "Question",
"name": "Does it include authentication and user roles?",
"acceptedAnswer": { "@type": "Answer", "text": "Yes. Blazor HRM Multi-Tenant includes ASP.NET Core Identity with JWT + cookie dual authentication, role-based access control (Admin, Manager, User), and policy-based authorization. Both the Blazor UI and REST API are protected." }
}
]
}
</script>
<style>[x-cloak]{display:none!important}html{scroll-behavior:smooth}.nav-blur{backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.gradient-text{background:linear-gradient(135deg,#f97316,#ea580c);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.btn-primary{display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#f97316,#ea580c);color:#fff;font-weight:600;border-radius:12px;padding:12px 24px;transition:all 0.2s;box-shadow:0 4px 14px -4px rgba(249,115,22,0.35);text-decoration:none}.btn-primary:hover{transform:translateY(-1px);box-shadow:0 8px 20px -4px rgba(249,115,22,0.45)}.btn-secondary{display:inline-flex;align-items:center;justify-content:center;background:#fff;color:#374151;font-weight:600;border-radius:12px;padding:12px 24px;border:1px solid #e5e7eb;transition:all 0.2s;text-decoration:none}.btn-secondary:hover{border-color:#f97316;color:#f97316}.btn-buy{display:inline-flex;align-items:center;gap:8px;background:#f97316;color:#fff!important;font-weight:700;font-size:1.125rem;border-radius:14px;padding:16px 36px;transition:all 0.25s;box-shadow:0 6px 24px -6px rgba(249,115,22,0.45);text-decoration:none;animation:pulse-glow 2s infinite}@keyframes pulse-glow{0%,100%{box-shadow:0 6px 24px -6px rgba(249,115,22,0.45)}50%{box-shadow:0 8px 32px -4px rgba(249,115,22,0.65)}}.btn-buy:hover{background:#ea580c;transform:translateY(-2px);box-shadow:0 12px 32px -8px rgba(249,115,22,0.55);animation:none}.product-card{transition:all 0.3s ease}.product-card:hover{transform:translateY(-4px);box-shadow:0 16px 32px -8px rgba(249,115,22,0.12)}.toc-link{transition:all 0.2s}.toc-link:hover{color:#f97316}.toc-link.active{color:#f97316;font-weight:600}</style>
</head>
<body class="bg-white text-gray-900 antialiased">
<nav class="fixed top-0 left-0 right-0 z-50 nav-blur bg-white/85 border-b border-gray-200/60">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="flex items-center justify-between h-16">
<a href="../index.html" class="flex items-center gap-2.5"><img src="../img/logo-indotalent-dark.svg" alt="Indotalent" class="h-8 w-auto" /></a>
<div class="hidden lg:flex items-center gap-6">
<a href="../index.html#products" class="text-sm font-medium text-gray-600 hover:text-brand-500">Products</a>
<a href="../index.html#features" class="text-sm font-medium text-gray-600 hover:text-brand-500">Features</a>
<a href="../index.html#pricing" class="text-sm font-medium text-gray-600 hover:text-brand-500">Pricing</a>
<a href="../blog.html" class="text-sm font-medium text-gray-600 hover:text-brand-500">Blog</a>
</div>
<a href="../index.html#products" class="btn-primary text-sm py-2.5 px-5">All Products</a>
</div>
</div>
</nav>
<section class="pt-24 pb-12 lg:pt-32 lg:pb-20">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="flex flex-col lg:flex-row gap-10 items-center">
<div class="flex-1 text-center lg:text-left">
<div class="inline-flex items-center gap-1.5 bg-purple-50 border border-purple-200 rounded-full px-3.5 py-1 mb-5">
<span class="text-purple-700 text-xs font-medium tracking-wide">SaaS &middot; Multi-Tenant &middot; .NET 10 &middot; Blazor Server &middot; VSA</span>
</div>
<h1 class="text-3xl sm:text-4xl lg:text-5xl font-extrabold text-gray-900 mb-4 tracking-tight">Blazor <span class="gradient-text">HRM Multi-Tenant</span></h1>
<p class="text-lg text-gray-500 mb-3 max-w-xl">SaaS HRM with Multi-Tenancy — Complete Source Code</p>
<p class="text-sm text-gray-400 mb-6 max-w-xl">A production-ready multi-tenant SaaS HRM application to manage workforce across multiple organizations from a single deployment. Built with .NET 10, ASP.NET Core, Blazor Server, MudBlazor, and Vertical Slice Architecture. Complete tenant isolation with EF Core global query filters.</p>
<div class="flex items-center justify-center lg:justify-start gap-4 mb-8">
<div><span class="text-3xl font-extrabold text-gray-900">$21</span> <span class="text-lg text-gray-400 line-through ml-2">$49</span></div>
<span class="text-xs bg-emerald-50 text-emerald-700 border border-emerald-200 rounded-full px-3 py-1 font-medium">Instant Download</span>
</div>
<div class="flex flex-wrap gap-3 justify-center lg:justify-start">
<a href="https://code.indotalent.com/checkout/buy/5a35e0ec-b88f-4176-a6ac-3e02201a5288?embed=1&logo=0&desc=0" class="lemonsqueezy-button btn-buy"><svg class="w-5 h-5" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 3h2l.4 2M7 13h10l4-8H5.4M7 13L5.4 5M7 13l-2.293 2.293c-.63.63-.184 1.707.707 1.707H17m0 0a2 2 0 100 4 2 2 0 000-4zm-8 2a2 2 0 100 4 2 2 0 000-4z"/></svg>Buy Now — $21 via Lemon Squeezy</a>
<a href="https://blazor-saas-hrm.csharpasp.net/" target="_blank" rel="noopener" class="btn-secondary text-sm py-3 px-6"><svg class="w-4 h-4 mr-1.5" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M15 12a3 3 0 11-6 0 3 3 0 016 0z"/><path stroke-linecap="round" stroke-linejoin="round" d="M2.458 12C3.732 7.943 7.523 5 12 5c4.478 0 8.268 2.943 9.542 7-1.274 4.057-5.064 7-9.542 7-4.477 0-8.268-2.943-9.542-7z"/></svg>Live Demo</a>
</div>
</div>
<div class="flex-1"><img src="../img/hrm-multi-tenant-saas-01.png" alt="Blazor HRM Multi-Tenant Dashboard — SaaS HRM .NET 10 Blazor Server" class="rounded-2xl shadow-2xl border border-gray-200 w-full" loading="eager" /></div>
</div>
</div>
</section>
<section class="py-6 bg-gray-50/80 border-y border-gray-100 sticky top-16 z-40">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="flex flex-wrap items-center gap-3 text-xs font-medium">
<span class="text-gray-400">On this page:</span>
<a href="#problem" class="toc-link text-gray-500">Business Problem</a><span class="text-gray-300">|</span>
<a href="#features" class="toc-link text-gray-500">Features</a><span class="text-gray-300">|</span>
<a href="#tech-stack" class="toc-link text-gray-500">Tech Stack</a><span class="text-gray-300">|</span>
<a href="#architecture" class="toc-link text-gray-500">Architecture</a><span class="text-gray-300">|</span>
<a href="#security" class="toc-link text-gray-500">Security</a><span class="text-gray-300">|</span>
<a href="#api" class="toc-link text-gray-500">REST API</a><span class="text-gray-300">|</span>
<a href="#database" class="toc-link text-gray-500">Database & Deployment</a><span class="text-gray-300">|</span>
<a href="#screenshots" class="toc-link text-gray-500">Screenshots</a><span class="text-gray-300">|</span>
<a href="#faq" class="toc-link text-gray-500">FAQ</a>
</div>
</div>
</section>
<section id="problem" class="py-16 lg:py-20">
<div class="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="text-center mb-10">
<div class="inline-flex items-center gap-1.5 bg-red-50 border border-red-200 rounded-full px-3.5 py-1 mb-4"><span class="text-red-700 text-xs font-medium tracking-wide">The Problem</span></div>
<h2 class="text-3xl sm:text-4xl font-bold text-gray-900">Business Problems <span class="gradient-text">Solved</span> by Blazor HRM Multi-Tenant</h2>
<p class="text-gray-500 mt-3 max-w-2xl mx-auto">HRM Multitenant: The Next-Gen People Engine: Built for Scale, Engineered for Excellence.</p>
</div>
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
<div class="bg-white border border-gray-200 rounded-xl p-6 product-card">
<div class="w-10 h-10 rounded-lg bg-purple-50 flex items-center justify-center mb-4"><svg class="w-5 h-5 text-purple-500" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><path d="M3.75 21h16.5M4.5 3h15M5.25 3v18m13.5-18v18M9 6.75h1.5m-1.5 3h1.5m-1.5 3h1.5m3-6H15m-1.5 3H15m-1.5 3H15M9 21v-3.375c0-.621.504-1.125 1.125-1.125h3.75c.621 0 1.125.504 1.125 1.125V21"/></svg></div>
<h3 class="text-base font-semibold text-gray-900 mb-2">Managing Multiple Client Workforces</h3>
<p class="text-sm text-gray-500">Running separate HRM instances for each client is costly. <strong>Blazor HRM Multi-Tenant allows multiple organizations to share one deployment</strong> with complete workforce data isolation via TenantId global query filters. Add new client organizations in seconds.</p>
</div>
<div class="bg-white border border-gray-200 rounded-xl p-6 product-card">
<div class="w-10 h-10 rounded-lg bg-amber-50 flex items-center justify-center mb-4"><svg class="w-5 h-5 text-amber-500" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><path d="M12 9v3.75m9-.75a9 9 0 11-18 0 9 9 0 0118 0zm-9 3.75h.008v.008H12v-.008z"/></svg></div>
<h3 class="text-base font-semibold text-gray-900 mb-2">Confidential Employee Data Leakage</h3>
<p class="text-sm text-gray-500">Employee data is highly confidential. Without proper isolation, one client's workforce data could leak to another. <strong>EF Core global query filters automatically scope every query.</strong> Tenant A's employees, salaries, and leave records are invisible to Tenant B.</p>
</div>
<div class="bg-white border border-gray-200 rounded-xl p-6 product-card">
<div class="w-10 h-10 rounded-lg bg-blue-50 flex items-center justify-center mb-4"><svg class="w-5 h-5 text-blue-500" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><path d="M15 19.128a9.38 9.38 0 002.625.372 9.337 9.337 0 004.121-.952 4.125 4.125 0 00-7.533-2.493M15 19.128v-.003c0-1.113-.285-2.16-.786-3.07M15 19.128v.106A12.318 12.318 0 018.624 21c-2.331 0-4.512-.645-6.374-1.766l-.001-.109a6.375 6.375 0 0111.964-3.07M12 6.375a3.375 3.375 0 11-6.75 0 3.375 3.375 0 016.75 0zm8.25 2.25a2.625 2.625 0 11-5.25 0 2.625 2.625 0 015.25 0z"/></svg></div>
<h3 class="text-base font-semibold text-gray-900 mb-2">Disconnected Leave & Attendance Per Tenant</h3>
<p class="text-sm text-gray-500">Each tenant needs their own leave policies and attendance tracking. <strong>Blazor HRM Multi-Tenant provides tenant-scoped leave management</strong> with approval workflows, attendance logging, and calendar views — all isolated per organization.</p>
</div>
<div class="bg-white border border-gray-200 rounded-xl p-6 product-card">
<div class="w-10 h-10 rounded-lg bg-emerald-50 flex items-center justify-center mb-4"><svg class="w-5 h-5 text-emerald-500" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><path d="M3.75 3v11.25A2.25 2.25 0 006 16.5h2.25M3.75 3h-1.5m1.5 0h16.5m0 0h1.5m-1.5 0v11.25A2.25 2.25 0 0118 16.5h-2.25m-7.5 0h7.5m-7.5 0l-1 3m8.5-3l1 3m0 0l.5 1.5m-.5-1.5h-9.5m0 0l-.5 1.5m.75-9l3-3 2.148 2.148A12.061 12.061 0 0116.5 7.605"/></svg></div>
<h3 class="text-base font-semibold text-gray-900 mb-2">No Tenant-Aware Workforce Analytics</h3>
<p class="text-sm text-gray-500">HR service providers need per-tenant dashboards and reports. <strong>Blazor HRM Multi-Tenant includes tenant-aware workforce dashboards</strong> with headcount, department distribution, leave balances, and attendance metrics — all scoped per organization.</p>
</div>
</div>
</div>
</section>
<!-- KEY FEATURES -->
<section id="features" class="py-16 lg:py-20 bg-gray-50/80">
<div class="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="text-center mb-10">
<div class="inline-flex items-center gap-1.5 bg-emerald-50 border border-emerald-200 rounded-full px-3.5 py-1 mb-4"><span class="text-emerald-700 text-xs font-medium tracking-wide">Business Features</span></div>
<h2 class="text-3xl sm:text-4xl font-bold text-gray-900">What's <span class="gradient-text">Included</span> in Blazor HRM Multi-Tenant</h2>
<p class="text-gray-500 mt-3 max-w-2xl mx-auto">Complete end-to-end business features with multi-tenant isolation — every module is a complete vertical slice with endpoint, handler, validator, and EF Core queries.</p>
</div>
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-5">
<div class="bg-white border border-gray-200 rounded-xl p-5 product-card"><div class="w-9 h-9 rounded-lg bg-blue-50 flex items-center justify-center mb-3"><svg class="w-4.5 h-4.5 text-blue-600" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><path d="M15 19.128a9.38 9.38 0 002.625.372 9.337 9.337 0 004.121-.952 4.125 4.125 0 00-7.533-2.493M15 19.128v-.003c0-1.113-.285-2.16-.786-3.07M15 19.128v.106A12.318 12.318 0 018.624 21c-2.331 0-4.512-.645-6.374-1.766l-.001-.109a6.375 6.375 0 0111.964-3.07M12 6.375a3.375 3.375 0 11-6.75 0 3.375 3.375 0 016.75 0zm8.25 2.25a2.625 2.625 0 11-5.25 0 2.625 2.625 0 015.25 0z"/></svg></div><h4 class="text-sm font-semibold text-gray-900 mb-1">Profile</h4><p class="text-xs text-gray-500">Personal Info, Password, Avatar, Session</p></div>
<div class="bg-white border border-gray-200 rounded-xl p-5 product-card"><div class="w-9 h-9 rounded-lg bg-indigo-50 flex items-center justify-center mb-3"><svg class="w-4.5 h-4.5 text-indigo-600" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><path d="M2.25 21h19.5m-18-18v18m10.5-18v18m6-13.5V21M6.75 6.75h.75m-.75 3h.75m-.75 3h.75m3-6h.75m-.75 3h.75m-.75 3h.75M6.75 21v-3.375c0-.621.504-1.125 1.125-1.125h2.25c.621 0 1.125.504 1.125 1.125V21M3.75 3h12.75c.621 0 1.125.504 1.125 1.125v17.25c0 .621-.504 1.125-1.125 1.125H3.75c-.621 0-1.125-.504-1.125-1.125V4.125C2.625 3.504 3.129 3 3.75 3z"/></svg></div><h4 class="text-sm font-semibold text-gray-900 mb-1">Leave Management</h4><p class="text-xs text-gray-500">Leave Request, Leave Categories, Leave Balance</p></div>
<div class="bg-white border border-gray-200 rounded-xl p-5 product-card"><div class="w-9 h-9 rounded-lg bg-amber-50 flex items-center justify-center mb-3"><svg class="w-4.5 h-4.5 text-amber-600" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><path d="M3 3v1.5M3 21v-6m0 0l2.77-.693a9 9 0 016.208.682l.108.054a9 9 0 006.086.71l3.114-.732a48.524 48.524 0 01-.005-10.499l-3.11.732a9 9 0 01-6.085-.711l-.108-.054a9 9 0 00-6.208-.682L3 4.5M3 15V4.5"/></svg></div><h4 class="text-sm font-semibold text-gray-900 mb-1">Performance</h4><p class="text-xs text-gray-500">Evaluation, Appraisal, Promotion, Transfer</p></div>
<div class="bg-white border border-gray-200 rounded-xl p-5 product-card"><div class="w-9 h-9 rounded-lg bg-emerald-50 flex items-center justify-center mb-3"><svg class="w-4.5 h-4.5 text-emerald-600" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><path d="M12 6v6h4.5m4.5 0a9 9 0 11-18 0 9 9 0 0118 0z"/></svg></div><h4 class="text-sm font-semibold text-gray-900 mb-1">Organization</h4><p class="text-xs text-gray-500">Branches, Departments, Designations, Employees</p></div>
<div class="bg-white border border-gray-200 rounded-xl p-5 product-card"><div class="w-9 h-9 rounded-lg bg-cyan-50 flex items-center justify-center mb-3"><svg class="w-4.5 h-4.5 text-cyan-600" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><path d="M3.75 3v11.25A2.25 2.25 0 006 16.5h2.25M3.75 3h-1.5m1.5 0h16.5m0 0h1.5m-1.5 0v11.25A2.25 2.25 0 0118 16.5h-2.25m-7.5 0h7.5m-7.5 0l-1 3m8.5-3l1 3m0 0l.5 1.5m-.5-1.5h-9.5m0 0l-.5 1.5m.75-9l3-3 2.148 2.148A12.061 12.061 0 0116.5 7.605"/></svg></div><h4 class="text-sm font-semibold text-gray-900 mb-1">Payroll Process</h4><p class="text-xs text-gray-500">Salary Grades, Income, Deduction</p></div>
<div class="bg-white border border-gray-200 rounded-xl p-5 product-card"><div class="w-9 h-9 rounded-lg bg-purple-50 flex items-center justify-center mb-3"><svg class="w-4.5 h-4.5 text-purple-600" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><path d="M12 21v-8.25M15.75 21v-8.25M8.25 21v-8.25M3 9l9-6 9 6m-1.5 12V10.332A48.36 48.36 0 0012 9.75c-2.551 0-5.056.2-7.5.582V21M3 21h18M12 6.75h.008v.008H12V6.75z"/></svg></div><h4 class="text-sm font-semibold text-gray-900 mb-1">System Logs</h4><p class="text-xs text-gray-500">Database log, File log</p></div>
<div class="bg-white border border-gray-200 rounded-xl p-5 product-card"><div class="w-9 h-9 rounded-lg bg-rose-50 flex items-center justify-center mb-3"><svg class="w-4.5 h-4.5 text-rose-600" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><path d="M3.75 21h16.5M4.5 3h15M5.25 3v18m13.5-18v18M9 6.75h1.5m-1.5 3h1.5m-1.5 3h1.5m3-6H15m-1.5 3H15m-1.5 3H15M9 21v-3.375c0-.621.504-1.125 1.125-1.125h3.75c.621 0 1.125.504 1.125 1.125V21"/></svg></div><h4 class="text-sm font-semibold text-gray-900 mb-1">App Settings</h4><p class="text-xs text-gray-500">Users, Currencies, Auto Number</p></div>
<div class="bg-white border border-gray-200 rounded-xl p-5 product-card"><div class="w-9 h-9 rounded-lg bg-orange-50 flex items-center justify-center mb-3"><svg class="w-4.5 h-4.5 text-orange-600" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><path d="M9 12.75L11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0z"/></svg></div><h4 class="text-sm font-semibold text-gray-900 mb-1">System Settings</h4><p class="text-xs text-gray-500">full inspection mode for appsettings.json</p></div>
</div>
</div>
</section>
<section id="tech-stack" class="py-16 lg:py-20">
<div class="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="text-center mb-10">
<div class="inline-flex items-center gap-1.5 bg-purple-50 border border-purple-200 rounded-full px-3.5 py-1 mb-4"><span class="text-purple-700 text-xs font-medium tracking-wide">Technology</span></div>
<h2 class="text-3xl sm:text-4xl font-bold text-gray-900">Technologies <span class="gradient-text">Used</span></h2>
</div>
<div class="flex flex-wrap justify-center gap-3 mb-10">
<span class="inline-flex items-center gap-2 bg-white border border-gray-200 rounded-xl px-4 py-2.5 text-sm font-medium text-gray-700 shadow-sm"><span class="w-2 h-2 rounded-full bg-brand-500"></span>.NET 10</span>
<span class="inline-flex items-center gap-2 bg-white border border-gray-200 rounded-xl px-4 py-2.5 text-sm font-medium text-gray-700 shadow-sm"><span class="w-2 h-2 rounded-full bg-blue-500"></span>ASP.NET Core 10</span>
<span class="inline-flex items-center gap-2 bg-white border border-gray-200 rounded-xl px-4 py-2.5 text-sm font-medium text-gray-700 shadow-sm"><span class="w-2 h-2 rounded-full bg-emerald-500"></span>Blazor Server</span>
<span class="inline-flex items-center gap-2 bg-white border border-gray-200 rounded-xl px-4 py-2.5 text-sm font-medium text-gray-700 shadow-sm"><span class="w-2 h-2 rounded-full bg-purple-500"></span>MudBlazor</span>
<span class="inline-flex items-center gap-2 bg-white border border-gray-200 rounded-xl px-4 py-2.5 text-sm font-medium text-gray-700 shadow-sm"><span class="w-2 h-2 rounded-full bg-cyan-500"></span>ASP.NET Core Minimal APIs</span>
<span class="inline-flex items-center gap-2 bg-white border border-gray-200 rounded-xl px-4 py-2.5 text-sm font-medium text-gray-700 shadow-sm"><span class="w-2 h-2 rounded-full bg-amber-500"></span>Entity Framework Core 10</span>
<span class="inline-flex items-center gap-2 bg-white border border-gray-200 rounded-xl px-4 py-2.5 text-sm font-medium text-gray-700 shadow-sm"><span class="w-2 h-2 rounded-full bg-rose-500"></span>MediatR + CQRS</span>
<span class="inline-flex items-center gap-2 bg-white border border-gray-200 rounded-xl px-4 py-2.5 text-sm font-medium text-gray-700 shadow-sm"><span class="w-2 h-2 rounded-full bg-indigo-500"></span>FluentValidation</span>
<span class="inline-flex items-center gap-2 bg-white border border-gray-200 rounded-xl px-4 py-2.5 text-sm font-medium text-gray-700 shadow-sm"><span class="w-2 h-2 rounded-full bg-green-500"></span>Swagger / OpenAPI</span>
<span class="inline-flex items-center gap-2 bg-white border border-gray-200 rounded-xl px-4 py-2.5 text-sm font-medium text-gray-700 shadow-sm"><span class="w-2 h-2 rounded-full bg-orange-500"></span>SignalR</span>
</div>
<div class="bg-white border border-gray-200 rounded-2xl overflow-hidden shadow-sm"><div class="overflow-x-auto"><table class="w-full text-sm">
<thead><tr class="border-b border-gray-200 bg-gray-50/80"><th class="text-left px-4 py-3 font-semibold text-gray-700 w-1/3">Layer</th><th class="text-left px-4 py-3 font-semibold text-gray-700">Technology</th></tr></thead>
<tbody>
<tr class="border-b border-gray-100"><td class="px-4 py-3 text-gray-700 font-medium">Framework</td><td class="px-4 py-3 text-gray-600">.NET 10</td></tr>
<tr class="border-b border-gray-100"><td class="px-4 py-3 text-gray-700 font-medium">Web Framework</td><td class="px-4 py-3 text-gray-600">ASP.NET Core 10</td></tr>
<tr class="border-b border-gray-100"><td class="px-4 py-3 text-gray-700 font-medium">UI Rendering</td><td class="px-4 py-3 text-gray-600">Blazor Server (SignalR-based real-time UI)</td></tr>
<tr class="border-b border-gray-100"><td class="px-4 py-3 text-gray-700 font-medium">UI Library</td><td class="px-4 py-3 text-gray-600">MudBlazor (Material Design for Blazor)</td></tr>
<tr class="border-b border-gray-100"><td class="px-4 py-3 text-gray-700 font-medium">Architecture</td><td class="px-4 py-3 text-gray-600">Vertical Slice Architecture (VSA) + CQRS via MediatR</td></tr>
<tr class="border-b border-gray-100"><td class="px-4 py-3 text-gray-700 font-medium">Multi-Tenancy</td><td class="px-4 py-3 text-gray-600">EF Core Global Query Filters with TenantId isolation</td></tr>
<tr class="border-b border-gray-100"><td class="px-4 py-3 text-gray-700 font-medium">API Style</td><td class="px-4 py-3 text-gray-600">ASP.NET Core Minimal APIs with Swagger/OpenAPI</td></tr>
<tr class="border-b border-gray-100"><td class="px-4 py-3 text-gray-700 font-medium">Data Access</td><td class="px-4 py-3 text-gray-600">Entity Framework Core 10 (Code-First, Migrations, Compiled Queries)</td></tr>
<tr class="border-b border-gray-100"><td class="px-4 py-3 text-gray-700 font-medium">Database</td><td class="px-4 py-3 text-gray-600">SQL Server (fully tested) / PostgreSQL (scaffolded)</td></tr>
<tr class="border-b border-gray-100"><td class="px-4 py-3 text-gray-700 font-medium">Validation</td><td class="px-4 py-3 text-gray-600">FluentValidation</td></tr>
<tr class="border-b border-gray-100"><td class="px-4 py-3 text-gray-700 font-medium">Authentication</td><td class="px-4 py-3 text-gray-600">ASP.NET Core Identity + JWT Bearer Token</td></tr>
<tr class="border-b border-gray-100"><td class="px-4 py-3 text-gray-700 font-medium">Authorization</td><td class="px-4 py-3 text-gray-600">Role-Based (RBAC) + Policy-Based Authorization</td></tr>
<tr><td class="px-4 py-3 text-gray-700 font-medium">Real-Time</td><td class="px-4 py-3 text-gray-600">SignalR (built into Blazor Server)</td></tr>
</tbody>
</table></div></div>
</div>
</section>
<section id="architecture" class="py-16 lg:py-20 bg-gray-50/80">
<div class="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="text-center mb-10">
<div class="inline-flex items-center gap-1.5 bg-amber-50 border border-amber-200 rounded-full px-3.5 py-1 mb-4"><span class="text-amber-700 text-xs font-medium tracking-wide">Architecture</span></div>
<h2 class="text-3xl sm:text-4xl font-bold text-gray-900">Application <span class="gradient-text">Architecture</span></h2>
<p class="text-gray-500 mt-3 max-w-2xl mx-auto">Blazor HRM Multi-Tenant uses Vertical Slice Architecture (VSA) with CQRS via MediatR and EF Core global query filters for complete tenant isolation across all workforce features.</p>
</div>
<div class="grid grid-cols-1 md:grid-cols-3 gap-5 mb-10">
<div class="bg-white border border-gray-200 rounded-xl p-6">
<div class="w-10 h-10 rounded-lg bg-rose-50 flex items-center justify-center mb-4"><svg class="w-5 h-5 text-rose-600" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><path d="M3.75 6A2.25 2.25 0 016 3.75h2.25A2.25 2.25 0 0110.5 6v2.25a2.25 2.25 0 01-2.25 2.25H6a2.25 2.25 0 01-2.25-2.25V6zM3.75 15.75A2.25 2.25 0 016 13.5h2.25a2.25 2.25 0 012.25 2.25V18a2.25 2.25 0 01-2.25 2.25H6A2.25 2.25 0 013.75 18v-2.25zM13.5 6a2.25 2.25 0 012.25-2.25H18A2.25 2.25 0 0120.25 6v2.25A2.25 2.25 0 0118 10.5h-2.25a2.25 2.25 0 01-2.25-2.25V6zM13.5 15.75a2.25 2.25 0 012.25-2.25H18a2.25 2.25 0 012.25 2.25V18A2.25 2.25 0 0118 20.25h-2.25A2.25 2.25 0 0113.5 18v-2.25z"/></svg></div>
<h3 class="text-base font-semibold text-gray-900 mb-2">Vertical Slice Architecture</h3>
<p class="text-sm text-gray-500">Each feature (Create Employee, Approve Leave, etc.) lives in its own folder with endpoint, MediatR handler, validator, and EF Core queries — all in one place. Every handler automatically applies tenant filtering.</p>
</div>
<div class="bg-white border border-gray-200 rounded-xl p-6">
<div class="w-10 h-10 rounded-lg bg-purple-50 flex items-center justify-center mb-4"><svg class="w-5 h-5 text-purple-600" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><path d="M3.75 21h16.5M4.5 3h15M5.25 3v18m13.5-18v18M9 6.75h1.5m-1.5 3h1.5m-1.5 3h1.5m3-6H15m-1.5 3H15m-1.5 3H15M9 21v-3.375c0-.621.504-1.125 1.125-1.125h3.75c.621 0 1.125.504 1.125 1.125V21"/></svg></div>
<h3 class="text-base font-semibold text-gray-900 mb-2">Multi-Tenant Isolation</h3>
<p class="text-sm text-gray-500">Tenant isolation via <strong>EF Core global query filters</strong>. Every entity has TenantId; EF Core auto-applies <code class="text-xs bg-gray-100 px-1.5 py-0.5 rounded">.Where(e => e.TenantId == currentTenantId)</code> to all queries. Zero data leakage by design.</p>
</div>
<div class="bg-white border border-gray-200 rounded-xl p-6">
<div class="w-10 h-10 rounded-lg bg-emerald-50 flex items-center justify-center mb-4"><svg class="w-5 h-5 text-emerald-600" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><path d="M12 21v-8.25M15.75 21v-8.25M8.25 21v-8.25M3 9l9-6 9 6m-1.5 12V10.332A48.36 48.36 0 0012 9.75c-2.551 0-5.056.2-7.5.582V21M3 21h18M12 6.75h.008v.008H12V6.75z"/></svg></div>
<h3 class="text-base font-semibold text-gray-900 mb-2">Single-Project Monolith</h3>
<p class="text-sm text-gray-500">The entire multi-tenant HRM application lives in <strong>one .NET 10 project</strong>. No distributed complexity. Single F5 to run. Deploy as one unit. Perfect for SaaS HR service providers.</p>
</div>
</div>
<div class="bg-white border border-gray-200 rounded-2xl p-6 shadow-sm">
<h3 class="font-semibold text-gray-900 mb-3 text-sm">Project Structure Overview</h3>
<pre class="text-xs text-gray-600 bg-gray-50 rounded-lg p-4 overflow-x-auto"><code>BlazorHRMMultiTenant/
├── Features/
│ ├── Tenants/
│ ├── Employees/
│ ├── Departments/
│ ├── Designations/
│ ├── LeaveManagement/
│ ├── Attendance/
│ ├── Payroll/
│ └── Dashboard/
├── Infrastructure/ # Auth, Audit, Tenant Resolution, EF Core
├── Migrations/
├── SeedData/ # Demo tenants, users, employee sample data
├── Components/
└── Program.cs</code></pre>
</div>
</div>
</section>
<section id="security" class="py-16 lg:py-20">
<div class="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="text-center mb-10">
<div class="inline-flex items-center gap-1.5 bg-green-50 border border-green-200 rounded-full px-3.5 py-1 mb-4"><span class="text-green-700 text-xs font-medium tracking-wide">Security</span></div>
<h2 class="text-3xl sm:text-4xl font-bold text-gray-900">Security & <span class="gradient-text">Authorization</span></h2>
</div>
<div class="grid grid-cols-1 md:grid-cols-2 gap-8">
<div>
<p class="text-gray-600 leading-relaxed text-sm mb-4">Blazor HRM Multi-Tenant ships with <strong class="text-gray-800">tenant-aware security</strong>. ASP.NET Core Identity manages users per tenant. JWT protects REST API, cookies protect Blazor UI. <strong>Both are tenant-scoped.</strong></p>
<p class="text-gray-600 leading-relaxed text-sm mb-4">Role-based access control is <strong>fully tenant-scoped</strong> — each tenant has their own Admin, Manager, and User roles. <strong>EF Core global query filters</strong> guarantee employee data never leaks between tenants.</p>
<p class="text-gray-600 leading-relaxed text-sm">With Blazor Server, <strong>all employee data, source code, and database credentials never leave the server.</strong></p>
</div>
<div class="bg-gray-50 rounded-2xl p-6 border border-gray-200">
<h3 class="font-semibold text-gray-900 mb-3 text-sm">Security Features</h3>
<ul class="space-y-2 text-sm text-gray-600">
<li class="flex items-start gap-2"><svg class="w-4 h-4 text-emerald-500 mt-0.5 shrink-0" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M9 12.75 11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0Z"/></svg><span><strong class="text-gray-800">Tenant Isolation</strong> — EF Core global query filters prevent data leakage</span></li>
<li class="flex items-start gap-2"><svg class="w-4 h-4 text-emerald-500 mt-0.5 shrink-0" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M9 12.75 11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0Z"/></svg><span><strong class="text-gray-800">ASP.NET Core Identity</strong> — Per-tenant user management</span></li>
<li class="flex items-start gap-2"><svg class="w-4 h-4 text-emerald-500 mt-0.5 shrink-0" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M9 12.75 11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0Z"/></svg><span><strong class="text-gray-800">JWT + Cookie Dual Auth</strong> — Tenant-scoped authentication</span></li>
<li class="flex items-start gap-2"><svg class="w-4 h-4 text-emerald-500 mt-0.5 shrink-0" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M9 12.75 11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0Z"/></svg><span><strong class="text-gray-800">RBAC</strong> — Tenant-scoped Admin, Manager, User roles</span></li>
<li class="flex items-start gap-2"><svg class="w-4 h-4 text-emerald-500 mt-0.5 shrink-0" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M9 12.75 11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0Z"/></svg><span><strong class="text-gray-800">Policy-Based Authorization</strong> — Fine-grained HR access control</span></li>
<li class="flex items-start gap-2"><svg class="w-4 h-4 text-emerald-500 mt-0.5 shrink-0" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M9 12.75 11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0Z"/></svg><span><strong class="text-gray-800">Audit Trail</strong> — Every HR action logged with tenant + user ID</span></li>
<li class="flex items-start gap-2"><svg class="w-4 h-4 text-emerald-500 mt-0.5 shrink-0" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M9 12.75 11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0Z"/></svg><span><strong class="text-gray-800">Server-Side Code</strong> — Employee data never leaves the server</span></li>
</ul>
</div>
</div>
</div>
</section>
<section id="api" class="py-16 lg:py-20 bg-gray-50/80">
<div class="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="text-center mb-10">
<div class="inline-flex items-center gap-1.5 bg-cyan-50 border border-cyan-200 rounded-full px-3.5 py-1 mb-4"><span class="text-cyan-700 text-xs font-medium tracking-wide">Integration</span></div>
<h2 class="text-3xl sm:text-4xl font-bold text-gray-900">REST API & <span class="gradient-text">Integration</span></h2>
</div>
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
<div class="bg-white border border-gray-200 rounded-xl p-6">
<h3 class="text-base font-semibold text-gray-900 mb-3">API Endpoints (Tenant-Aware)</h3>
<div class="space-y-1.5 text-xs font-mono">
<div class="flex items-center gap-2"><span class="bg-emerald-100 text-emerald-700 px-1.5 py-0.5 rounded font-semibold">GET</span><span class="text-gray-600">/api/employees</span><span class="text-gray-400">— List employees (tenant-scoped)</span></div>
<div class="flex items-center gap-2"><span class="bg-emerald-100 text-emerald-700 px-1.5 py-0.5 rounded font-semibold">GET</span><span class="text-gray-600">/api/employees/{id}</span><span class="text-gray-400">— Get employee (tenant-scoped)</span></div>
<div class="flex items-center gap-2"><span class="bg-blue-100 text-blue-700 px-1.5 py-0.5 rounded font-semibold">POST</span><span class="text-gray-600">/api/employees</span><span class="text-gray-400">— Create employee (auto-assigned to tenant)</span></div>
<div class="flex items-center gap-2"><span class="bg-amber-100 text-amber-700 px-1.5 py-0.5 rounded font-semibold">PUT</span><span class="text-gray-600">/api/employees/{id}</span><span class="text-gray-400">— Update employee</span></div>
<div class="flex items-center gap-2"><span class="bg-red-100 text-red-700 px-1.5 py-0.5 rounded font-semibold">DELETE</span><span class="text-gray-600">/api/employees/{id}</span><span class="text-gray-400">— Delete employee</span></div>
</div>
<p class="text-xs text-gray-400 mt-4">Same pattern for: Departments, Designations, Leave Requests, Attendance, Payroll.</p>
</div>
<div class="bg-white border border-gray-200 rounded-xl p-6">
<h3 class="text-base font-semibold text-gray-900 mb-3">API Features</h3>
<ul class="space-y-2.5 text-sm text-gray-600">
<li class="flex items-start gap-2"><svg class="w-4 h-4 text-cyan-500 mt-0.5 shrink-0" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M9 12.75 11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0Z"/></svg><span><strong class="text-gray-800">Swagger/OpenAPI</strong> — Interactive docs at <code class="text-xs bg-gray-100 px-1 py-0.5 rounded">/swagger</code></span></li>
<li class="flex items-start gap-2"><svg class="w-4 h-4 text-cyan-500 mt-0.5 shrink-0" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M9 12.75 11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0Z"/></svg><span><strong class="text-gray-800">JWT Authentication</strong> — Bearer token with tenant claim</span></li>
<li class="flex items-start gap-2"><svg class="w-4 h-4 text-cyan-500 mt-0.5 shrink-0" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M9 12.75 11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0Z"/></svg><span><strong class="text-gray-800">Auto Tenant Scoping</strong> — Only tenant-owned data returned</span></li>
<li class="flex items-start gap-2"><svg class="w-4 h-4 text-cyan-500 mt-0.5 shrink-0" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M9 12.75 11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0Z"/></svg><span><strong class="text-gray-800">FluentValidation</strong> — Input validation on all endpoints</span></li>
<li class="flex items-start gap-2"><svg class="w-4 h-4 text-cyan-500 mt-0.5 shrink-0" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M9 12.75 11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0Z"/></svg><span><strong class="text-gray-800">Pagination & Filtering</strong> — Built-in query parameters</span></li>
<li class="flex items-start gap-2"><svg class="w-4 h-4 text-cyan-500 mt-0.5 shrink-0" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M9 12.75 11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0Z"/></svg><span><strong class="text-gray-800">Mobile-Ready</strong> — Build mobile HR apps with this API</span></li>
</ul>
</div>
</div>
</div>
</section>
<section id="database" class="py-16 lg:py-20">
<div class="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="text-center mb-10">
<div class="inline-flex items-center gap-1.5 bg-indigo-50 border border-indigo-200 rounded-full px-3.5 py-1 mb-4"><span class="text-indigo-700 text-xs font-medium tracking-wide">Database & Deployment</span></div>
<h2 class="text-3xl sm:text-4xl font-bold text-gray-900">Database & <span class="gradient-text">Deployment</span></h2>
</div>
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
<div class="bg-white border border-gray-200 rounded-xl p-6">
<h3 class="text-base font-semibold text-gray-900 mb-3">Database</h3>
<ul class="space-y-2.5 text-sm text-gray-600">
<li class="flex items-start gap-2"><svg class="w-4 h-4 text-emerald-500 mt-0.5 shrink-0" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M9 12.75 11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0Z"/></svg><span><strong class="text-gray-800">SQL Server</strong> — Fully tested with EF Core migrations and seed data</span></li>
<li class="flex items-start gap-2"><svg class="w-4 h-4 text-emerald-500 mt-0.5 shrink-0" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M9 12.75 11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0Z"/></svg><span><strong class="text-gray-800">PostgreSQL</strong> — Scaffolded (provider ready, not fully tested)</span></li>
<li class="flex items-start gap-2"><svg class="w-4 h-4 text-emerald-500 mt-0.5 shrink-0" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M9 12.75 11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0Z"/></svg><span><strong class="text-gray-800">EF Core Migrations</strong> — Code-first with full migration history</span></li>
<li class="flex items-start gap-2"><svg class="w-4 h-4 text-emerald-500 mt-0.5 shrink-0" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M9 12.75 11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0Z"/></svg><span><strong class="text-gray-800">Seed Data</strong> — Demo tenants, employees, departments, leave types</span></li>
<li class="flex items-start gap-2"><svg class="w-4 h-4 text-emerald-500 mt-0.5 shrink-0" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M9 12.75 11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0Z"/></svg><span><strong class="text-gray-800">Compiled Queries</strong> — Optimized EF Core queries with tenant filtering</span></li>
</ul>
</div>
<div class="bg-white border border-gray-200 rounded-xl p-6">
<h3 class="text-base font-semibold text-gray-900 mb-3">Deployment Options</h3>
<ul class="space-y-2.5 text-sm text-gray-600">
<li class="flex items-start gap-2"><svg class="w-4 h-4 text-indigo-500 mt-0.5 shrink-0" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M9 12.75 11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0Z"/></svg><span><strong class="text-gray-800">Azure App Service</strong> — Deploy from Visual Studio or CI/CD</span></li>
<li class="flex items-start gap-2"><svg class="w-4 h-4 text-indigo-500 mt-0.5 shrink-0" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M9 12.75 11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0Z"/></svg><span><strong class="text-gray-800">IIS</strong> — Standard ASP.NET Core publish</span></li>
<li class="flex items-start gap-2"><svg class="w-4 h-4 text-indigo-500 mt-0.5 shrink-0" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M9 12.75 11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0Z"/></svg><span><strong class="text-gray-800">Docker</strong> — Containerize for any platform</span></li>
<li class="flex items-start gap-2"><svg class="w-4 h-4 text-indigo-500 mt-0.5 shrink-0" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M9 12.75 11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0Z"/></svg><span><strong class="text-gray-800">Windows / Linux / macOS</strong></span></li>
<li class="flex items-start gap-2"><svg class="w-4 h-4 text-indigo-500 mt-0.5 shrink-0" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M9 12.75 11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0Z"/></svg><span><strong class="text-gray-800">Setup:</strong> Clone → connection string → F5 → multi-tenant running in 60s</span></li>
</ul>
</div>
</div>
</div>
</section>
<section id="screenshots" class="py-16 lg:py-20 bg-gray-50/80">
<div class="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="text-center mb-10"><h2 class="text-2xl sm:text-3xl font-bold text-gray-900">Application <span class="gradient-text">Screenshots</span></h2></div>
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
<img src="../img/hrm-multi-tenant-saas-01.png" alt="Blazor HRM Multi-Tenant Dashboard" class="w-full rounded-xl border border-gray-200 shadow-lg" loading="lazy" />
<img src="../img/hrm-multi-tenant-saas-02.png" alt="Blazor HRM Multi-Tenant Employee Management" class="w-full rounded-xl border border-gray-200 shadow-lg" loading="lazy" />
<img src="../img/hrm-multi-tenant-saas-03.png" alt="Blazor HRM Multi-Tenant Tenant Management" class="w-full rounded-xl border border-gray-200 shadow-lg" loading="lazy" />
<img src="../img/hrm-multi-tenant-saas-04.png" alt="Blazor HRM Multi-Tenant Leave Management" class="w-full rounded-xl border border-gray-200 shadow-lg" loading="lazy" />
<img src="../img/hrm-multi-tenant-saas-05.png" alt="Blazor HRM Multi-Tenant Attendance Tracking" class="w-full rounded-xl border border-gray-200 shadow-lg" loading="lazy" />
<img src="../img/hrm-multi-tenant-saas-06.png" alt="Blazor HRM Multi-Tenant Payroll Reports" class="w-full rounded-xl border border-gray-200 shadow-lg" loading="lazy" />
<img src="../img/hrm-multi-tenant-saas-07.png" alt="Blazor HRM Multi-Tenant Analytics" class="w-full rounded-xl border border-gray-200 shadow-lg" loading="lazy" />
</div>
</div>
</section>
<section class="py-10 lg:py-12">
<div class="max-w-3xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
<h2 class="text-xl font-bold text-gray-900 mb-4">Try the Live Demo</h2>
<div class="bg-white border border-gray-200 rounded-xl p-5 inline-block text-left shadow-sm">
<p class="text-sm text-gray-600"><strong>URL:</strong> <a href="https://blazor-saas-hrm.csharpasp.net/" target="_blank" rel="noopener" class="text-brand-600 hover:text-brand-700">https://blazor-saas-hrm.csharpasp.net/</a></p>
<p class="text-sm text-gray-600 mt-1"><strong>Email:</strong> admin@root.com</p>
<p class="text-sm text-gray-600"><strong>Password:</strong> 123456</p>
</div>
</div>
</section>
<section class="py-8 lg:py-10 bg-gradient-to-r from-orange-50 via-amber-50 to-orange-50">
<div class="max-w-3xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
<div class="bg-white border border-orange-200 rounded-2xl p-6 sm:p-8 shadow-lg">
<h2 class="text-2xl font-bold text-gray-900 mb-2">Get Blazor HRM Multi-Tenant Source Code</h2>
<p class="text-gray-500 mb-4">Complete, unrestricted C# source code. Single .NET 10 project. Clone, F5, serve multiple organizations.</p>
<div class="flex items-center justify-center gap-4 mb-6">
<div><span class="text-3xl font-extrabold text-gray-900">$21</span> <span class="text-lg text-gray-400 line-through ml-2">$49</span></div>
<span class="text-xs bg-emerald-50 text-emerald-700 border border-emerald-200 rounded-full px-3 py-1 font-medium">Instant Download</span>
</div>
<a href="https://code.indotalent.com/checkout/buy/5a35e0ec-b88f-4176-a6ac-3e02201a5288?embed=1&logo=0&desc=0" class="lemonsqueezy-button btn-buy text-lg"><svg class="w-5 h-5" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 3h2l.4 2M7 13h10l4-8H5.4M7 13L5.4 5M7 13l-2.293 2.293c-.63.63-.184 1.707.707 1.707H17m0 0a2 2 0 100 4 2 2 0 000-4zm-8 2a2 2 0 100 4 2 2 0 000-4z"/></svg>Buy Now — $21 via Lemon Squeezy</a>
<p class="text-xs text-gray-400 mt-4">Secure checkout via Lemon Squeezy. Lifetime access. No subscription.</p>
</div>
</div>
</section>
<section id="faq" class="py-16 lg:py-20">
<div class="max-w-3xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="text-center mb-10">
<div class="inline-flex items-center gap-1.5 bg-orange-50 border border-orange-200 rounded-full px-3.5 py-1 mb-4"><span class="text-brand-700 text-xs font-medium tracking-wide">FAQ</span></div>
<h2 class="text-2xl sm:text-3xl font-bold text-gray-900">Frequently Asked <span class="gradient-text">Questions</span></h2>
</div>
<div class="space-y-3" x-data="{open:null}">
<div class="border border-gray-200 rounded-xl overflow-hidden"><button @click="open = open === 1 ? null : 1" class="w-full flex items-center justify-between p-4 text-left bg-white hover:bg-gray-50"><span class="font-semibold text-gray-900 text-sm">What do I get when I purchase?</span><svg class="w-4 h-4 text-gray-400 shrink-0 ml-4" :class="{'rotate-180': open === 1}" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path d="M19.5 8.25l-7.5 7.5-7.5-7.5"/></svg></button><div x-show="open === 1" x-cloak class="px-4 pb-4 text-sm text-gray-600">Complete, unrestricted C# source code of the entire multi-tenant HRM application. Single .NET 10 project with VSA, EF Core global query filters, migrations, seed data with demo tenants. Clone, F5, serve multiple organizations immediately.</div></div>
<div class="border border-gray-200 rounded-xl overflow-hidden"><button @click="open = open === 2 ? null : 2" class="w-full flex items-center justify-between p-4 text-left bg-white hover:bg-gray-50"><span class="font-semibold text-gray-900 text-sm">How does multi-tenancy work?</span><svg class="w-4 h-4 text-gray-400 shrink-0 ml-4" :class="{'rotate-180': open === 2}" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path d="M19.5 8.25l-7.5 7.5-7.5-7.5"/></svg></button><div x-show="open === 2" x-cloak class="px-4 pb-4 text-sm text-gray-600">EF Core global query filters with TenantId on every entity. Each tenant sees only their employees, departments, and leave data. Zero data leakage — enforced at the database level.</div></div>
<div class="border border-gray-200 rounded-xl overflow-hidden"><button @click="open = open === 3 ? null : 3" class="w-full flex items-center justify-between p-4 text-left bg-white hover:bg-gray-50"><span class="font-semibold text-gray-900 text-sm">Can I customize for my HR SaaS business?</span><svg class="w-4 h-4 text-gray-400 shrink-0 ml-4" :class="{'rotate-180': open === 3}" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path d="M19.5 8.25l-7.5 7.5-7.5-7.5"/></svg></button><div x-show="open === 3" x-cloak class="px-4 pb-4 text-sm text-gray-600">Absolutely! Rebrand, add custom HR features, modify leave policies, integrate payroll systems. Deploy as your own SaaS platform. Each license covers one end product per client project. <a href="../license.html" class="text-brand-600 hover:text-brand-700 font-medium">License details</a>.</div></div>
<div class="border border-gray-200 rounded-xl overflow-hidden"><button @click="open = open === 4 ? null : 4" class="w-full flex items-center justify-between p-4 text-left bg-white hover:bg-gray-50"><span class="font-semibold text-gray-900 text-sm">Does it support SQL Server and PostgreSQL?</span><svg class="w-4 h-4 text-gray-400 shrink-0 ml-4" :class="{'rotate-180': open === 4}" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path d="M19.5 8.25l-7.5 7.5-7.5-7.5"/></svg></button><div x-show="open === 4" x-cloak class="px-4 pb-4 text-sm text-gray-600">SQL Server fully tested. PostgreSQL scaffolded in codebase (provider + connection string ready, not fully tested).</div></div>
<div class="border border-gray-200 rounded-xl overflow-hidden"><button @click="open = open === 5 ? null : 5" class="w-full flex items-center justify-between p-4 text-left bg-white hover:bg-gray-50"><span class="font-semibold text-gray-900 text-sm">Can beginners learn from this?</span><svg class="w-4 h-4 text-gray-400 shrink-0 ml-4" :class="{'rotate-180': open === 5}" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path d="M19.5 8.25l-7.5 7.5-7.5-7.5"/></svg></button><div x-show="open === 5" x-cloak class="px-4 pb-4 text-sm text-gray-600">Yes! Study real multi-tenant SaaS patterns, EF Core global query filters, VSA feature organization, and HRM domain design.</div></div>
<div class="border border-gray-200 rounded-xl overflow-hidden"><button @click="open = open === 6 ? null : 6" class="w-full flex items-center justify-between p-4 text-left bg-white hover:bg-gray-50"><span class="font-semibold text-gray-900 text-sm">Is there a refund policy?</span><svg class="w-4 h-4 text-gray-400 shrink-0 ml-4" :class="{'rotate-180': open === 6}" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path d="M19.5 8.25l-7.5 7.5-7.5-7.5"/></svg></button><div x-show="open === 6" x-cloak class="px-4 pb-4 text-sm text-gray-600">No refund due to digital nature. Test the fully functional live demo before buying. <a href="../no-refund-policy.html" class="text-brand-600 hover:text-brand-700 font-medium">Full policy</a>.</div></div>
</div>
</div>
</section>
<footer class="bg-white border-t border-gray-200">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-10">
<div class="flex flex-col md:flex-row items-center justify-between gap-4">
<a href="../index.html" class="flex items-center gap-2"><img src="../img/logo-indotalent-dark.svg" alt="Indotalent" class="h-5 w-auto" /></a>
<div class="flex flex-wrap gap-4 text-sm">
<a href="../blog.html" class="text-gray-500 hover:text-brand-500">Blog</a>
<a href="../privacy-policy.html" class="text-gray-500 hover:text-brand-500">Privacy</a>
<a href="../license.html" class="text-gray-500 hover:text-brand-500">License</a>
<a href="../support.html" class="text-gray-500 hover:text-brand-500">Support</a>
</div>
<p class="text-xs text-gray-500">&copy; 2024-2026 Indotalent. <span class="text-brand-500">&hearts;</span> by go2ismail</p>
</div>
</div>
</footer>
</body>
</html>