543 lines
63 KiB
HTML
543 lines
63 KiB
HTML
<!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 CRM — Customer Relationship Management .NET 10 Source Code | Indotalent</title>
|
|
<meta name="description" content="Blazor CRM: Complete Customer Relationship Management source code built with .NET 10, Blazor Server, MudBlazor, and Vertical Slice Architecture. Contact management, sales pipeline, lead tracking, reporting. $21 instant download." />
|
|
<meta name="keywords" content="Blazor CRM, Customer Relationship Management, .NET 10, Blazor Server, MudBlazor, Vertical Slice Architecture, CRM source code, ASP.NET Core CRM" />
|
|
<meta name="robots" content="index,follow" />
|
|
<link rel="canonical" href="https://www.indotalent.com/products/blazor-crm.html" />
|
|
<meta property="og:title" content="Blazor CRM — Customer Relationship Management .NET 10 Source Code | Indotalent" />
|
|
<meta property="og:description" content="Complete CRM source code: .NET 10, Blazor Server, MudBlazor, VSA. Contact, pipeline, lead tracking, reporting. $21." />
|
|
<meta property="og:type" content="product" />
|
|
<meta property="og:url" content="https://www.indotalent.com/products/blazor-crm.html" />
|
|
<meta property="og:image" content="https://www.indotalent.com/img/crm-customer-relationship-management-01.png" />
|
|
<meta name="twitter:card" content="summary_large_image" />
|
|
<meta name="twitter:title" content="Blazor CRM — .NET 10 Customer Relationship Management Source Code" />
|
|
<meta name="twitter:description" content="Complete CRM source code with Blazor Server, MudBlazor, VSA. $21 instant download." />
|
|
<meta name="twitter:image" content="https://www.indotalent.com/img/crm-customer-relationship-management-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>
|
|
<!-- Structured Data: SoftwareApplication + Product -->
|
|
<script type="application/ld+json">
|
|
{
|
|
"@context": "https://schema.org",
|
|
"@type": "SoftwareApplication",
|
|
"name": "Blazor CRM",
|
|
"applicationCategory": "BusinessApplication",
|
|
"operatingSystem": "Windows, Linux, macOS",
|
|
"description": "Customer Relationship Management system built with .NET 10 Blazor Server, Vertical Slice Architecture, and MudBlazor. Complete source code with contact management, sales pipeline, lead tracking, and reporting dashboards.",
|
|
"url": "https://www.indotalent.com/products/blazor-crm.html",
|
|
"author": {
|
|
"@type": "Organization",
|
|
"name": "Indotalent",
|
|
"url": "https://www.indotalent.com"
|
|
},
|
|
"offers": {
|
|
"@type": "Offer",
|
|
"price": "21.00",
|
|
"priceCurrency": "USD",
|
|
"availability": "https://schema.org/InStock",
|
|
"priceValidUntil": "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 CRM", "item": "https://www.indotalent.com/products/blazor-crm.html" }
|
|
]
|
|
}
|
|
</script>
|
|
<script type="application/ld+json">
|
|
{
|
|
"@context": "https://schema.org",
|
|
"@type": "FAQPage",
|
|
"mainEntity": [
|
|
{
|
|
"@type": "Question",
|
|
"name": "What features does Blazor CRM include?",
|
|
"acceptedAnswer": { "@type": "Answer", "text": "Blazor CRM includes contact management, company/organization management, sales pipeline with deal stages, lead tracking and conversion, activity logging, communication history, dashboard with KPIs and charts, reporting, and full audit trail. All features are built with .NET 10, Blazor Server, MudBlazor, and VSA." }
|
|
},
|
|
{
|
|
"@type": "Question",
|
|
"name": "Does Blazor CRM include REST API?",
|
|
"acceptedAnswer": { "@type": "Answer", "text": "Yes! Blazor CRM 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 CRUD operations on contacts, companies, deals, and activities." }
|
|
},
|
|
{
|
|
"@type": "Question",
|
|
"name": "Can I customize the CRM for my clients?",
|
|
"acceptedAnswer": { "@type": "Answer", "text": "Absolutely. You receive the complete, unrestricted C# source code. You can rebrand, add custom fields, modify workflows, integrate with third-party services, and deploy for your clients. Each client project requires a separate $21 license." }
|
|
},
|
|
{
|
|
"@type": "Question",
|
|
"name": "What database does Blazor CRM 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 the connection string and provider in Program.cs." }
|
|
},
|
|
{
|
|
"@type": "Question",
|
|
"name": "Does it include authentication and user roles?",
|
|
"acceptedAnswer": { "@type": "Answer", "text": "Yes. Blazor CRM 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">
|
|
|
|
<!-- NAVBAR -->
|
|
<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 transition-colors">Products</a>
|
|
<a href="../index.html#features" class="text-sm font-medium text-gray-600 hover:text-brand-500 transition-colors">Features</a>
|
|
<a href="../index.html#pricing" class="text-sm font-medium text-gray-600 hover:text-brand-500 transition-colors">Pricing</a>
|
|
<a href="../blog.html" class="text-sm font-medium text-gray-600 hover:text-brand-500 transition-colors">Blog</a>
|
|
</div>
|
|
<a href="../index.html#products" class="btn-primary text-sm py-2.5 px-5">All Products</a>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<!-- HERO -->
|
|
<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-orange-50 border border-orange-200 rounded-full px-3.5 py-1 mb-5">
|
|
<span class="text-brand-700 text-xs font-medium tracking-wide">.NET 10 · Blazor Server · VSA · MudBlazor</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">CRM</span></h1>
|
|
<p class="text-lg text-gray-500 mb-3 max-w-xl">Customer Relationship Management — Complete Source Code</p>
|
|
<p class="text-sm text-gray-400 mb-6 max-w-xl">A production-ready CRM application to manage contacts, companies, sales pipeline, leads, and customer relationships. Built with .NET 10, ASP.NET Core, Blazor Server, MudBlazor, and Vertical Slice Architecture.</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/f4b80702-1ba0-422c-b78e-2903c5558441?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-crm.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/crm-customer-relationship-management-01.png" alt="Blazor CRM Dashboard — Customer Relationship Management .NET 10 Blazor Server" class="rounded-2xl shadow-2xl border border-gray-200 w-full" loading="eager" /></div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- TABLE OF CONTENTS -->
|
|
<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>
|
|
|
|
<!-- BUSINESS PROBLEM -->
|
|
<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 CRM</h2>
|
|
<p class="text-gray-500 mt-3 max-w-2xl mx-auto">Every business needs to manage customer relationships — but fragmented tools, manual tracking, and disconnected data cost time and revenue.</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-red-50 flex items-center justify-center mb-4"><svg class="w-5 h-5 text-red-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">Scattered Customer Data</h3>
|
|
<p class="text-sm text-gray-500">Sales teams store contacts in spreadsheets, email inboxes, and personal notes. No central source of truth means missed follow-ups, duplicate entries, and lost opportunities. <strong>Blazor CRM centralizes all contact, company, and deal data</strong> in one searchable, organized system with complete history tracking.</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="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>
|
|
<h3 class="text-base font-semibold text-gray-900 mb-2">No Sales Pipeline Visibility</h3>
|
|
<p class="text-sm text-gray-500">Without a structured pipeline, managers cannot forecast revenue or identify bottlenecks. Deals get stuck without anyone noticing. <strong>Blazor CRM provides a visual sales pipeline with deal stages</strong> (Prospecting, Qualification, Proposal, Negotiation, Closed Won/Lost) so you always know where every deal stands.</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">Missed Follow-Ups & No Activity Tracking</h3>
|
|
<p class="text-sm text-gray-500">Critical follow-ups slip through the cracks when there is no logging system. <strong>Blazor CRM tracks every activity</strong> — calls, emails, meetings, notes — and links them to contacts and deals. Complete activity timeline for every customer relationship.</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 Actionable Insights</h3>
|
|
<p class="text-sm text-gray-500">Without dashboards and reports, management flies blind. <strong>Blazor CRM includes KPI dashboards</strong> with charts and summary cards showing pipeline value, win rate, conversion metrics, and sales performance — all powered by EF Core aggregation queries.</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 CRM</h2>
|
|
<p class="text-gray-500 mt-3 max-w-2xl mx-auto">Complete end-to-end business features — 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">Pipeline</h4><p class="text-xs text-gray-500">Campaign, Budget, Expense, Lead, Lead Contacts, Lead Activities, Sales Team, Sales Representative</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">Third Party</h4><p class="text-xs text-gray-500">Customer Group, Customer Category, Customer, Customer Contact, Vendor Group, Vendor Category, Vendor, Vendor Contact</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">Sales</h4><p class="text-xs text-gray-500">Quotation, Sales Order, Delivery Order, Sales Return, Invoice, Credit Note, Payment, Sales Report, Delivery Report, Return Report, Invoice Report, Payment Report</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">Purchase</h4><p class="text-xs text-gray-500">Requisition, Purchase Order, Goods Receive, Purchase Return, Bill, Debit Note, Payment, Purchase Report, Receive Report, Return Report, Bill Report, Payment Report</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">Inventory</h4><p class="text-xs text-gray-500">Unit Measure, Product Group, Product, Warehouse, Transfer Out, Transfer In, Positive/Negative Adjustment, Scrapping, Stock Count, Transaction Report, Stock Report, Movement Report</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">Utilities</h4><p class="text-xs text-gray-500">Booking Group, Booking Resource, Booking Manager, Scheduler, Program Resource, Program Manager, To-Do List</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 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-teal-50 flex items-center justify-center mb-3"><svg class="w-4.5 h-4.5 text-teal-600" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><path d="M12 9v3.75m-9.303 3.376c-.866 1.5.217 3.374 1.948 3.374h14.71c1.73 0 2.813-1.874 1.948-3.374L13.949 3.378c-.866-1.5-3.032-1.5-3.898 0L2.697 16.126z"/></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-red-50 flex items-center justify-center mb-3"><svg class="w-4.5 h-4.5 text-red-600" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><path d="M21 21l-5.197-5.197m0 0A7.5 7.5 0 105.196 5.196a7.5 7.5 0 0010.607 10.607z"/></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>
|
|
|
|
<!-- TECH STACK -->
|
|
<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>
|
|
<p class="text-gray-500 mt-3 max-w-2xl mx-auto">Blazor CRM is built on the modern .NET ecosystem with production-grade libraries and tools.</p>
|
|
</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 Component Library</td><td class="px-4 py-3 text-gray-600">MudBlazor (Material Design components for Blazor)</td></tr>
|
|
<tr class="border-b border-gray-100"><td class="px-4 py-3 text-gray-700 font-medium">Architecture Pattern</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">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>
|
|
|
|
<!-- ARCHITECTURE -->
|
|
<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 CRM uses Vertical Slice Architecture (VSA) with CQRS via MediatR — the modern, maintainable approach to building .NET applications.</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 Contact, Get Deal, Update Lead, etc.) lives in its own folder with its Minimal API endpoint, MediatR handler (Command or Query), FluentValidation validator, and EF Core queries all in one place. <strong>Zero coupling between features.</strong> Add a feature without touching unrelated code.</p>
|
|
<p class="text-sm text-gray-500 mt-2"><strong>Folder structure:</strong> <code class="text-xs bg-gray-100 px-1.5 py-0.5 rounded">Features/Contacts/CreateContact/</code> contains endpoint, handler, validator, DTO, and mapping — everything for that single operation.</p>
|
|
</div>
|
|
<div class="bg-white border border-gray-200 rounded-xl p-6">
|
|
<div class="w-10 h-10 rounded-lg bg-cyan-50 flex items-center justify-center mb-4"><svg class="w-5 h-5 text-cyan-600" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><path d="M8.625 12a.375.375 0 11-.75 0 .375.375 0 01.75 0zM8.625 9.75a.375.375 0 11-.75 0 .375.375 0 01.75 0zM8.625 14.25a.375.375 0 11-.75 0 .375.375 0 01.75 0zM12 12a.375.375 0 11-.75 0 .375.375 0 01.75 0zM12 9.75a.375.375 0 11-.75 0 .375.375 0 01.75 0zM12 14.25a.375.375 0 11-.75 0 .375.375 0 01.75 0zM15.375 12a.375.375 0 11-.75 0 .375.375 0 01.75 0zM15.375 9.75a.375.375 0 11-.75 0 .375.375 0 01.75 0zM15.375 14.25a.375.375 0 11-.75 0 .375.375 0 01.75 0z"/><path stroke-linecap="round" d="M3.75 4.5h16.5a.75.75 0 01.75.75v13.5a.75.75 0 01-.75.75H3.75a.75.75 0 01-.75-.75V5.25a.75.75 0 01.75-.75z"/></svg></div>
|
|
<h3 class="text-base font-semibold text-gray-900 mb-2">CQRS via MediatR</h3>
|
|
<p class="text-sm text-gray-500">Commands (writes) and Queries (reads) are separated into distinct MediatR handlers. <strong>Read queries use EF Core no-tracking</strong> for maximum performance. <strong>Command handlers encapsulate business logic</strong> with full change tracking. Pipeline behaviors handle cross-cutting concerns like validation, logging, and transactions.</p>
|
|
<p class="text-sm text-gray-500 mt-2"><strong>Example:</strong> <code class="text-xs bg-gray-100 px-1.5 py-0.5 rounded">GetContactByIdQuery</code> uses <code class="text-xs bg-gray-100 px-1.5 py-0.5 rounded">.AsNoTracking()</code>. <code class="text-xs bg-gray-100 px-1.5 py-0.5 rounded">CreateContactCommand</code> uses full change tracking with validation pipeline behavior.</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 application — Blazor UI, REST API, business logic, data access, and authentication — lives in <strong>one .NET 10 project</strong>. No distributed complexity, no microservice overhead. Single <code class="text-xs bg-gray-100 px-1.5 py-0.5 rounded">F5</code> to run. Deploy as one unit to Azure, IIS, or Docker. Perfect for teams that value simplicity and velocity.</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>BlazorCRM/
|
|
├── Features/ # Vertical Slices (one folder per feature)
|
|
│ ├── Contacts/
|
|
│ │ ├── CreateContact/ # Endpoint + Handler + Validator + DTO
|
|
│ │ ├── GetContactById/
|
|
│ │ ├── GetContactList/
|
|
│ │ ├── UpdateContact/
|
|
│ │ └── DeleteContact/
|
|
│ ├── Companies/
|
|
│ ├── Deals/
|
|
│ ├── Leads/
|
|
│ ├── Activities/
|
|
│ └── Dashboard/
|
|
├── Infrastructure/ # Cross-cutting: Auth, Audit, EF Core
|
|
├── Migrations/ # EF Core migrations
|
|
├── SeedData/ # Initial seed data (demo users, sample data)
|
|
├── Components/ # Shared Blazor components
|
|
├── wwwroot/ # Static assets
|
|
└── Program.cs # Single entry point with full configuration</code></pre>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- SECURITY -->
|
|
<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>
|
|
<p class="text-gray-500 mt-3 max-w-2xl mx-auto">Security is baked into the architecture from the ground up — not bolted on as an afterthought.</p>
|
|
</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 CRM ships with a <strong class="text-gray-800">fully configured authentication and authorization system</strong>. ASP.NET Core Identity manages users and roles with secure password hashing. JWT (JSON Web Token) authentication protects all REST API endpoints, while cookie-based authentication handles Blazor Server UI access. <strong>Both schemes run simultaneously.</strong></p>
|
|
<p class="text-gray-600 leading-relaxed text-sm mb-4">Role-based access control (RBAC) restricts features by user role: <strong>Admin</strong> (full access), <strong>Manager</strong> (team-level access), and <strong>User</strong> (self-service). Policy-based authorization provides fine-grained control for sensitive operations like deal approval or financial reports.</p>
|
|
<p class="text-gray-600 leading-relaxed text-sm">With Blazor Server, <strong>source code and connection strings never leave the server</strong>. All data access happens server-side via SignalR — zero exposure of database credentials or business logic to the client.</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">ASP.NET Core Identity</strong> — User registration, login, password hashing, password reset</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> — Cookies for Blazor UI, JWT for REST API</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">Role-Based Access Control</strong> — Admin, Manager, User roles with granular permissions</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> — Declarative policies for fine-grained feature access</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 create/update/delete logged with user ID and timestamp</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">SignalR Protection</strong> — Blazor Server connections secured with [Authorize]</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> — Source code and DB credentials never leave the server</span></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- REST API -->
|
|
<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>
|
|
<p class="text-gray-500 mt-3 max-w-2xl mx-auto">Blazor CRM exposes a complete REST Web API for all entities — ready for mobile apps, third-party integrations, and external systems.</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">
|
|
<h3 class="text-base font-semibold text-gray-900 mb-3">API Endpoints</h3>
|
|
<p class="text-sm text-gray-500 mb-4">Every feature exposes REST endpoints via ASP.NET Core Minimal APIs. All endpoints are JWT-protected and return proper HTTP status codes.</p>
|
|
<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/contacts</span><span class="text-gray-400">— List contacts with pagination, search, sort</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/contacts/{id}</span><span class="text-gray-400">— Get contact by ID</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/contacts</span><span class="text-gray-400">— Create new contact</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/contacts/{id}</span><span class="text-gray-400">— Update contact</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/contacts/{id}</span><span class="text-gray-400">— Delete contact</span></div>
|
|
</div>
|
|
<p class="text-xs text-gray-400 mt-4">Same pattern applies to all entities: Companies, Deals, Leads, Activities, and Dashboard aggregations.</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 Docs</strong> — Interactive API documentation 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> — All endpoints require Bearer token</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">Request/Response DTOs</strong> — Clean separation from domain models</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 for list 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">Mobile-Ready</strong> — Use the API to build mobile apps or integrate with external systems</span></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- DATABASE & DEPLOYMENT -->
|
|
<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>
|
|
<p class="text-gray-500 mt-3 max-w-2xl mx-auto">EF Core migrations, seed data, and flexible deployment options — ready to run in under 60 seconds.</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">
|
|
<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 included</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 in codebase (provider + connection string config 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 approach 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 users (admin, manager, user), sample contacts, companies, deals</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> — Performance-optimized EF Core queries</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 directly from Visual Studio or GitHub Actions</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 (Windows Server)</strong> — Standard ASP.NET Core publish to IIS</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 and deploy anywhere Docker runs</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> — .NET 10 runs everywhere</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">Single Project</strong> — No distributed complexity. One publish, one deploy</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 Time:</strong> Clone repo → set connection string → F5 → running in under 60 seconds</span></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- SCREENSHOTS -->
|
|
<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>
|
|
<p class="text-gray-500 mt-2">Explore the Blazor CRM interface — dashboards, contact management, sales pipeline, and more.</p>
|
|
</div>
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
|
|
<img src="../img/crm-customer-relationship-management-01.png" alt="Blazor CRM Dashboard Overview" class="w-full rounded-xl border border-gray-200 shadow-lg" loading="lazy" />
|
|
<img src="../img/crm-customer-relationship-management-02.png" alt="Blazor CRM Contact Management" class="w-full rounded-xl border border-gray-200 shadow-lg" loading="lazy" />
|
|
<img src="../img/crm-customer-relationship-management-03.png" alt="Blazor CRM Sales Pipeline" class="w-full rounded-xl border border-gray-200 shadow-lg" loading="lazy" />
|
|
<img src="../img/crm-customer-relationship-management-04.png" alt="Blazor CRM Deal Tracking" class="w-full rounded-xl border border-gray-200 shadow-lg" loading="lazy" />
|
|
<img src="../img/crm-customer-relationship-management-05.png" alt="Blazor CRM Reporting & Analytics" class="w-full rounded-xl border border-gray-200 shadow-lg" loading="lazy" />
|
|
<img src="../img/crm-customer-relationship-management-06.png" alt="Blazor CRM Data Management" class="w-full rounded-xl border border-gray-200 shadow-lg" loading="lazy" />
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- LIVE DEMO -->
|
|
<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>
|
|
<p class="text-sm text-gray-500 mb-4">Test every feature before you buy. No registration required.</p>
|
|
<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-crm.csharpasp.net/" target="_blank" rel="noopener" class="text-brand-600 hover:text-brand-700">https://blazor-crm.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>
|
|
|
|
<!-- BUY CTA -->
|
|
<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 CRM Source Code</h2>
|
|
<p class="text-gray-500 mb-4">Complete, unrestricted C# source code. Single .NET 10 project. Clone, F5, run.</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/f4b80702-1ba0-422c-b78e-2903c5558441?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>
|
|
|
|
<!-- FAQ -->
|
|
<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 transition-colors">
|
|
<span class="font-semibold text-gray-900 text-sm">What do I get when I purchase Blazor CRM?</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">You get the <strong>complete, unrestricted C# source code</strong> of the entire Blazor CRM application. A single .NET 10 project with all features, Vertical Slice Architecture implementation, EF Core migrations, seed data, and full configuration. Clone, set your connection string, press F5, and it runs immediately. Includes Blazor Server UI, REST API, authentication, authorization, audit trail, and all CRM features.</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 transition-colors">
|
|
<span class="font-semibold text-gray-900 text-sm">Can I customize and use this for commercial projects?</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">Yes! Each license covers <strong>one end product per client project</strong>. You can rebrand, customize, add features, and deploy for your clients. Freelancers and agencies save weeks of development. Each new client project requires a separate $21 license. See our <a href="../license.html" class="text-brand-600 hover:text-brand-700 font-medium">License page</a>.</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 transition-colors">
|
|
<span class="font-semibold text-gray-900 text-sm">Does it support both SQL Server and PostgreSQL?</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">SQL Server is <strong>fully tested</strong> and ready to use. PostgreSQL support is <strong>scaffolded in the codebase</strong> — the EF Core provider and connection string configuration are set up — but has not been fully tested yet. Switch between databases by changing the connection string and provider in <code class="text-xs bg-gray-100 px-1 py-0.5 rounded">Program.cs</code>.</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 transition-colors">
|
|
<span class="font-semibold text-gray-900 text-sm">What architecture pattern does Blazor CRM use?</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">Blazor CRM uses <strong>Vertical Slice Architecture (VSA) with CQRS via MediatR</strong>. Each feature (Create Contact, Get Deal, etc.) lives in its own folder with endpoint, MediatR handler, FluentValidation validator, and EF Core queries. This pattern is AI-friendly, beginner-friendly, and production-proven. Read our <a href="../blog/vsa-introduction.html" class="text-brand-600 hover:text-brand-700 font-medium">VSA Introduction</a>.</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 transition-colors">
|
|
<span class="font-semibold text-gray-900 text-sm">Can beginners learn from this source code?</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">Absolutely! The code is clean, well-structured, and self-documenting. Beginners can study real production patterns — authentication flows, VSA feature organization, REST API endpoints, and database design — all in a single project. You'll need Visual Studio 2022+ and SQL Server (LocalDB or Express, both free).</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 transition-colors">
|
|
<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">Due to the digital nature of source code, we have a strict no-refund policy. That's why we provide a <strong>fully functional live demo</strong> — test every feature before you buy. <a href="../no-refund-policy.html" class="text-brand-600 hover:text-brand-700 font-medium">Full policy here</a>.</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- FOOTER -->
|
|
<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">© 2024-2026 Indotalent. <span class="text-brand-500">♥</span> by go2ismail</p>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
|
|
</body>
|
|
</html> |