مطالب
قابلیت های کاربردی ASP.NET WebFroms - قسمت اول
قابلیت CompositeScript 
پس از گذشت مدتی که از توسعه پروژه مورد نظرتان می‌گذرد احتمالاً فایل‌های javascript زیادی در پروژه شما استفاده می‌شود که هم مدیریت و هم بار سنگینی بر سرعت بارگذاری اولیه سایت شما به دلیل زمان بارگذاری فایل‌های javascript خواهد گذاشت. در ASP.NET چندین روش برای مدیریت فایل‌های javascript , css  وجود دارد.
ساده‌ترین روش استفاده از امکانات خود ASP.Net  است. با قابلیت CompositeScript براحتی می‌توانید فایل‌های javascript خود را با هم ادغام و در یک فایل ScriptResource.axd برای Client ارسال نمایید. برای این کار کافیست از تگ جدید CompositeScript در کنترل ScriptManager استفاده نمایید. در کد زیر این قابلیت نمایش داده شده است:
 <asp:ScriptManager ID="ScriptManager" runat="server" ScriptMode="Release">
                <CompositeScript>
                    <Scripts>
                        <asp:ScriptReference Path="~/Scripts/jquery-1.7.2.min.js" />
                        <asp:ScriptReference Path="~/Scripts/jquery.ui.core.min.js" />
                        <asp:ScriptReference Path="~/Scripts/jquery.ui.widget.min.js" />
                        <asp:ScriptReference Path="~/Scripts/jquery.ui.mouse.min.js" />
                        <asp:ScriptReference Path="~/Scripts/jquery.ui.sortable.min.js" />
                    </Scripts>
                </CompositeScript>
 </asp:ScriptManager>

علاوه بر آن حتما خاصیت ScriptMode کنترل ScriptManager  را بر روی Release تنظیم نمایید تا از حداکثر کارایی و کش فایل‌ها استفاده نمایید

دسترسی به ScriptManager در صفحات دیگر و الصاق فایل‌های خاص

برخی از فایل‌های Javascript فقط در صفحات خاصی استفاده شده اند و لازم نیست در هر صفحه بارگذاری شود برای این کار کافی است فایل مورد نظر را در صفحه خاص به  ScriptManager اضافه نمایید. البته ابتدا لازم است به ScriptManager دسترسی داشته باشیم. کد زیر نحوه دسترسی به آن را نمایش داده است:

ScriptManager scriptManager = ScriptManager.GetCurrent(this.Page);
scriptManager.CompositeScript.Scripts.Add(new ScriptReference("~/Scripts/jquery.json.min.js"));
ادامه دارد...
مطالب
پیاده سازی Default Dependency Injection در AngularJS 1.x
 در این مقاله شما را با روشی آشنا خواهم کرد که در عین سادگی، کارآیی زیادی در پروژه‌های  AngularJS خواهد داشت.
برای همه ما پیش آماده است که خیلی از Injection‌های Controller‌های AngularJS به صورت مشترک بوده ولی مجبور شده‌ایم این Injection‌ها را در هر Controller تکرار کنیم. کدهای زیر را مشاهده کنید. در این کد یک سری از injection‌ها به صورت مشترک در این ۴ Controller تکرار شده است.
app.controller('ctrl1',['$scope','$rootscope','$location','$route','api','delete','notify',ctrl1]);
...
app.controller('ctrl2',['$scope','$rootscope','$location','$route','api','delete','notify','chart',ctrl2]);
...
app.controller('ctrl3',['$scope','$rootscope','$location','$route','api','delete','notify','pulling',ctrl3]);
...
app.controller('ctrl4',['$scope','$rootscope','$location','$route','api','delete','notify','chart','report',ctrl4]);
در پروژه‌های بزرگ که تعداد Controller‌ها بیش از حد می‌باشد همیشه تعدادی Injection مشترک وجود دارد و مدیریت این Injection‌ها در همه کنترل‌ها و مخصوصا کنترل‌های جدید که به پروژه اضافه میکنیم سخت می‌شود و گاهی از نظم خارج می‌شود مخصوصا وقتی که تعداد Developer‌ها در پروژه زیاد باشند.
در این روش که نوعی Trick ساده Javascript هست به شما در مدیریت Injection‌ها کمک میکند.
خوب ابتدا همه Injectionهای مشترک Controller‌ها را شناسایی می‌کنیم و یه آرایه تعریف میکنیم و همه Injection‌های مشترک را مرتب در این آرایه قرار می‌دهیم.
var injection=['$scope','$rootscope','$location','$route','api','delete','notify'];
با استفاده از تابع زیر مابقی Injection‌های مختص هر Controller را پیاده سازی می‌کنیم.
function injectionHandle() {    
    var _injection=angular.copy(injection);
    for(var i=0;i<arguments.length;i++){
        _injection.push(arguments[i]);        
    }
    return _injection;
}
توضیح تابع: در خط اول یک Copy از آرایه را تهیه می‌کنیم تا در دفعات بعد هم این آرایه قابل استفاده باشد. arguments در داخل تابع به رشته Injectionهای ارسال شده به تابع و تابع Controller اشاره دارد. با این روش می‌توانیم به صورت نامحدود Injection‌ها را به تابع ارسال کنیم. در داخل حلقه به Copy متغیر injection همه Injection‌های ارسالی به تابع را push میکنیم. نهایتا این تابع آرایه‌ای از injection‌های مشترک و Injectionهای مختص هر Controller و خود تابع Controller را بر میگرداند.
در مرحله بعدی در تعریف Controller‌ها تابع injectionHandle را همراه با Injection‌های مختص آن  Controller را صدا میزنیم.
در کد زیر نحوه استفاده از این روش را مشاهده میکنید:
app.controller('ctrl1', injectionHandle(ctrl1));
...
app.controller('ctrl2', injectionHandle('chart',ctrl2));
...
app.controller('ctrl3', injectionHandle('pulling',ctrl3));
...
app.controller('ctrl4', injectionHandle('chart','report',ctrl4));
همانطور که مشاهده کردید، با این روش خیلی راحتتر می‌توانید Injection‌های مشترک را مدیریت کنید. اگر قرار باشد Injection جدیدی را به همه Controller‌ها اضافه کنید، کافیست آن را در آرایه injection درج کنید.
مطالب
توسعه سرویس‌های مبتنی بر REST در AngularJs با استفاده از RestAngular : بخش اول
برای مطالعه‌ی این مقاله شما باید به مواردی از قبیل کتابخانه‌ی AngularJs، تعاملات بین کلاینت و سرور و همچنین معماری RESTful تسلط کافی داشته باشید و ما از توضیح و تفصیلی این سرفصل‌ها اجتناب میکنیم.
خیلی خوب بپردازیم به اصل مطلب:

Restangular  چیست؟

کتابخانه RestAngular بنا به گفته ناشر در مستندات Github آن، یک سرویس توسعه داده شده AngularJs می‌باشد که کد‌های نوشته شده‌ی برای پیاده سازی فرآیند‌های Request/Response کلاینت و سرور را به حداقل رسانده است. این فرآیندها در قالب درخواست‌های GET، POST، DELETE و Update صورت می‌پذیرند. این سرویس برای وب اپلیکیشن‌هایی که که داده‌های خود را از API‌های RESTful  همانند Microsoft ASP.NET Web API 2 دریافت می‌کنند نیز بسیار کارآمد است.
کد زیر یک فرآیند درخواست GET را نمایش می‌دهد که در آن از سرویس RestAngular استفاده شده است:
// Restangular returns promises
Restangular.all('users').getList()  // GET: /users
.then(function(users) {
  // returns a list of users
  $scope.user = users[0]; // first Restangular obj in list: { id: 123 }
})

// Later in the code...

// Restangular objects are self-aware and know how to make their own RESTful requests
$scope.user.getList('cars');  // GET: /users/123/cars

// You can also use your own custom methods on Restangular objects
$scope.user.sendMessage();  // POST: /users/123/sendMessage

// Chain methods together to easily build complex requests
$scope.user.one('messages', 123).one('from', 123).getList('unread');
// GET: /users/123/messages/123/from/123/unread
همانطور که ملاحظه میکنید تمام پروسه‌ی دریافت، در یک خط خلاصه شده است. همچنین می‌بینید که restAngular دارای Promise نیز هست. در تکه کد اول، تمامی userها به صورت Get دریافت می‌شوند. در تکه کد دوم مشاهده می‌کنید که عملیات درخواست لیست ماشین‌های کاربر چگونه در یک خط خلاصه می‌گردد. حال فرض کنید قصد داشتیم تا این عملیات را با وابستگی http پیاده سازی نماییم. برای این کار باید چندین خط کد را درون یک سرویس جا می‌دادیم و آنگاه از متد سرویس در کنترلر استفاده می‌کردیم.
در اینجا همچنین قادرید درخواست‌های خود را به صورت سفارشی نیز اعمال کنید (تکه کد سوم) و در آخر مشاهده می‌کنید که پیچیده‌ترین عملیات‌های درخواست کاربر را می‌توان در یک خط خلاصه نمود. برای نمونه کد آخر یک دستور GET تو در تو را به چه سادگی پیاده سازی کرده است.

وابستگی ها

باید توجه داشته باشید که برای استفاده از RestAngular نیاز به کتابخانه‌ی Lodash نیز می‌باشد.

شروع پروژه

برای شروع پروژه و استفاده از RestAngular، پس از اضافه کردن اسکریپت رفرنس‌ها و وابستگی‌ها (lodash و AngularJs) باید وابستگی restAngular را به صورت زیر به angular.module اضافه نمایید:
// Add Restangular as a dependency to your app
angular.module('your-app', ['restangular']);

// Inject Restangular into your controller
angular.module('your-app').controller('MainCtrl', function($scope, Restangular) {
  // ...
});
توجه داشته باشید هنگامیکه یک وابستگی به module اضافه می‌گردد، با حروف کوچک یعنی restangular اضافه می‌گردد؛ اما هنگامیکه به کنترلر اضافه می‌شود، به صورت Restangular و با R بزرگ اضافه می‌گردد.

برخی از متدهای RestAngular

در این بخش قصد داریم تا برخی از پر کاربرد‌ترین متد‌های RestAngular را تشریح کنیم:
 نام متد  پارامتر‌های ارسالی  توضیحات
 one
 route, id
 این متد یک RestAngular object ایجاد میکند که از آدرسی که در route قرار داده شده با id مشخص دریافت میشود.
 all
 route
 این متد یک RestAngular object که لیستی از المنت هایی را که در آدرس route قرار دارد، دریافت می‌نماید.
 oneUrl
 route, url
 این متد یک RestAngular object ایجاد می‌کند که یک المنت از url خاصی را بازگشت میدهد.
مانند: Restangular.oneUrl( 'googlers' , 'http://www.google.com/1' ).get(); 
 allUrl
 route, url
 این متد مانند متد قبل است با این تفاوت که یک مجموعه را بازگشت میدهد.
 copy
 formElement
 این متد یک کپی از المنت‌های یک فرم را ایجاد میکند که ما میتوانیم آنها را تغییر دهیم.
 restangularizeElement
 parent,element, route, queryParams
 یک المنت جدید را به صورت Restangularize تغییر میدهد.
 restangularizeCollection
 parent, element, route, queryParams
 یک کالکشن Collection را به صورت Restangularize تغییر میدهد.
در این قسمت قصد داشتیم تا شما را با این کتابخانه کمی آشنا کنیم. در قسمت بعدی سعی می‌کنیم تا با مثال‌هایی کاربردی، شما را بیشتر با این سرویس خارق العاده آشنا کنیم.
مطالب
Minimal API's در دات نت 6 - قسمت اول - معرفی
یکی از مهم‌ترین تغییرات دات نت 6، ارائه‌ی Minimal API's به همراه آن است که نسبت به MVC و سایر مشتقات ASP.NET Core، کمتر به همراه پیش‌فرض‌های نظری خاص و بسیار مقید و متعصبانه (opinionated) است؛ که این مورد خود مزیتی است جهت انجام امور متداول، به نحوی دیگر و دلخواه و با آزادی عمل بیشتری در طراحی endpoints مورد نیاز و کل برنامه. خصوصا این سبک جدید، با معماری برش‌های عمودی (vertical slices) ارائه شده‌ی توسط نویسنده‌ی AutoMapper، هماهنگی خاصی دارد و اینطور به نظر می‌رسد که جهت ساده سازی طراحی برنامه‌های ASP.NET Core با معماری CQRS ارائه شده‌است. با وجود Minimal API's می‌توان از دو لایه‌ی متداول برنامه‌ها رها شد: لایه‌ی سرویس‌ها و لایه‌ی مخازن یا Repositories. در معماری برش‌های عمودی، برنامه به ویژگی‌های خاصی (Features) تقسیم شده و هر ویژگی، متکی به خود طراحی می‌شود. زمانیکه از هندلرها برای هر Command و Query معماری CQRS استفاده می‌کنیم، این‌ها مختص به یک ویژگی متکی به خود طراحی می‌شوند و به همراه تمام اطلاعات و اعمال مرتبط هستند و دیگر در این حالت، وجود لایه‌های سرویس و مخزن، بی‌معنا و غیرضروری می‌شوند.

در ادامه قصد داریم تمام این موارد را مانند Minimal API's و معماری برش‌های عمودی به همراه CQRS، در طی یک سری و یک پروژه‌ی عملی ساخت یک Blog به نام MinimalBlog، بررسی کنیم. البته هدف ما در اینجا صرفا ساخت backend ساختار یافته‌ی این برنامه‌است؛ منهای UI آن. هدف اصلی ما از این سری، ارائه‌ی یک معماری، جهت کار با Minimal API's است.


دریافت کدهای کامل این سری

جهت مرور سریعتر و ساده‌تر این سری، کدهای کامل آن‌را از اینجا می‌توانید دریافت کنید: MinimalBlog.zip


پروژه‌هایی که برنامه‌ی MinimalBlog را تشکیل می‌دهند

برنامه‌ی MinimalBlog، تنها از سه پروژه‌ی زیر تشکیل می‌شود:
MinimalBlog.Api: این پروژه از نوع minimal API's است که توسط دستور جدید «dotnet new webapi --use-minimal-apis» آغاز خواهد شد و به صورت پیش‌فرض به همراه پشتیبانی از OpenAPI نیز هست. البته اگر از VS2022 استفاده می‌کنید، در حین آغاز یک پروژه‌ی Web API جدید، تیک مربوط به use controllers را در UI بردارید تا از Minimal API's استفاده شود.
MinimalBlog.Dal: که Dal در اینجا مخفف data access layer است و یک class library می‌باشد و با دستور dotnet new classlib آغاز می‌شود.
MinimalBlog.Domain: نیز یک class library است و با دستور dotnet new classlib آغاز می‌شود.

همانطور که مشاهده می‌کنید، این طراحی جدید، بدون وجود لایه‌ی متداول سرویس‌ها و یا مخازن است.


بررسی ساختار ابتدایی پروژه‌ی MinimalBlog.Api

در اینجا تنها تک فایل Program.cs، به همراه تنظیمات برنامه قابل مشاهده‌است و فایل Starup.cs از آن حذف شده‌است (اطلاعات بیشتر). این فایل نیز بر مبنای مفهوم top level programs طراحی شده‌است و به همراه تعریف class و یا فضای نامی نیست:
var builder = WebApplication.CreateBuilder(args);

builder.Services.AddEndpointsApiExplorer();
builder.Services.AddSwaggerGen();
همانطور که ملاحظه می‌کنید، تمام اتفاقات در همین تک فایل رخ می‌دهند. برای مثال سرویس‌های مورد نیاز برنامه به مجموعه‌ی builder.Services اضافه می‌شوند؛ شبیه به کاری که پیشتر در فایل Startup.cs و متد ConfigureServices آن انجام می‌دادیم.

پس از آن به تعاریف زیر می‌رسیم؛ تعاریف میان افزارهایی که پیشتر در متد Configure کلاس Startup انجام می‌شدند، الان همگی در تک فایل Program.cs قرار دارند:
var app = builder.Build();

if (app.Environment.IsDevelopment())
{
    app.UseSwagger();
    app.UseSwaggerUI();
}

app.UseHttpsRedirection();
البته هنوز هم می‌توان در صورت نیاز به همان ساختار کلاس Startup پیشین نیز رسید.


در انتهای این فایل نیز تعاریف پیش‌فرض زیر قرار دارند:
var summaries = new[]
{
    "Freezing", "Bracing", "Chilly", "Cool", "Mild", "Warm", "Balmy", "Hot", "Sweltering", "Scorching"
};

app.MapGet("/weatherforecast", () =>
{
    var forecast =  Enumerable.Range(1, 5).Select(index =>
        new WeatherForecast
        (
            DateTime.Now.AddDays(index),
            Random.Shared.Next(-20, 55),
            summaries[Random.Shared.Next(summaries.Length)]
        ))
        .ToArray();
    return forecast;
})
.WithName("GetWeatherForecast");

app.Run();

record WeatherForecast(DateTime Date, int TemperatureC, string? Summary)
{
    public int TemperatureF => 32 + (int)(TemperatureC / 0.5556);
}
در اینجا متد متد MapGet یک endpoint را تعریف کرده و سپس اکشنی را به آن انتساب می‌دهد. یعنی اگر آدرس weatherforecast/ درخواست شود، lambda expression تعریف شده، اجرا می‌شود. هدف از ارائه‌ی Minimal API نیز همین است تا بتوان با حداقل کدنویسی، سریعا به نتیجه‌ی مدنظر خود رسید.
در همین حال اگر برنامه‌ی Api را اجرا کنیم، به تصویر زیر خواهیم رسید:


در ادامه کدهای موجود در این فایل را Refactor کرده و به کلاس‌های دیگری منتقل می‌کنیم؛ چون اگر قرار باشد در طول زمان تمام endpoints مدنظر را در همینجا تعریف کنیم، کنترل برنامه از دست خارج خواهد شد.


غنی سازی Solution و کامپایلر #C با استفاده از فایل‌های editorconfig. و Directory.Build.props

در مورد این دو فایل در مطلب «غنی سازی کامپایلر C# 9.0 با افزونه‌ها » بیشتر بحث شده‌است. هدف از آن‌ها، اعمال یکسری تنظیمات سراسری، به تمام پروژه‌های یک solution به صورت یک‌دست است؛ مانند تنظیمات کامپایلر جهت نمایش اخطارها به صورت خطاها، تعریف usingهای سراسری سی‌شارپ 10 و یا اعمال Roslyn analyzers به تمام پروژه‌ها. این دو فایل را به همراه پروژه‌ی پیوست می‌توانید دریافت کنید و ... باید جزء استاندارد تمام پروژه‌های جدید باشند. چون وجود آن‌ها سبب خواهد شد که به شدت کیفیت کدهای نهایی افزایش یابند و مبتنی بر یکسری best practices شوند.
نظرات مطالب
استفاده از bower در visual studio
در لحظه‌ای که این فایل‌ها دریافت میشوند، به این دلیل که در محیط خارج از VS این عملیات دریافت اتفاق میافتد، بنابراین در VS این فایل‌ها وجود ندارند، چون این فایل‌ها هنوز در فایل مدیریت منابع پروژه csproj نگاشته نشده‌اند. شما میتونید با include کردن این فایل‌ها در VS، در واقع آنها را به فایل csproj پروژه اضافه کنید که دیگر درون فولدرهای پروژه در VS نیز قابل مشاهده باشند.
مطالب
توسعه یک Web API با استفاده از ASP.NET Core و MongoDb (قسمت اول)

در این مقاله قصد داریم یک Api تحت وب را با استفاده از فریم‌ورک ASP.NET Core توسعه دهیم تا عملیات CRUD را بر روی دیتابیس MongoDb که یکی از محبوب‌ترین دیتابیس‌های NoSql است، انجام دهد. قبل از شروع کار باید ویژوال استودیو نسخه‌ی 2019 را نصب داشته باشید؛ به‌طوریکه ورک لود ASP.NET and web development را  هم حتما همراه آن نصب کرده باشید. علاوه بر آن باید .Net Core SDK 3.0+ و دیتابیس MongoDb را هم نصب کنید که می‌توانید آنها را از آدرس‌های زیر دانلود کنید. نگران نصب MongoDb هم نباشید چون نکته خاصی ندارد. 

https://docs.mongodb.com/manual/tutorial/install-mongodb-on-windows/

https://dotnet.microsoft.com/download/dotnet-core

نسخه‌ی جاری MongoDb، 4.4 است که پس از نصب، به صورت پیشفرض در آدرس C:\Program Files\MongoDB قرار می‌گیرد. در مسیر C:\Program Files\MongoDB\Server\4.4\bin فایل‌های اصلی MongoDb قرار دارند و برای تعامل با MongoDb، به این فایل‌ها نیاز خواهیم داشت. پس برای اینکه به راحتی بتوان در هر جای سیستم از طریق پاورشل به این فایل‌ها دسترسی داشته باشید، این مسیر را به Path environment variable ویندوز اضافه کنید.

MongoDb دارای یک بخش اصلی یا اصطلاحا یکdaemon  است که وظیفه‌ی آن، پردازش درخواست‌هایی است که برای کار با داده‌ها صادر می‌شود. در حقیقت همه کارهایی که ما با داده‌ها انجام می‌دهیم مثلا دسترسی به داده‌ها و دستکاری آن‌ها، از طریق این daemon انجام می‌گیرد و پشت صحنه‌ی این daemon، با Storage Engine کار خواهد کرد.  برای اجرای daemon، پاور شل را باز کنید و دستور mongod را وارد کنید. اگر با تنظیمات پیشفرض اجرا کنید، بر روی پورت 27017 بالا آمده و فایل‌های دیتابیس را هم در مسیر C:\data\db قرار می‌دهد. اگر این مسیر را نداشته باشید، با خطا مواجه می‌شوید. یا باید این مسیر را تعریف کنید و یا از سوئیچ dbpath -- استفاده کنید تا مسیر فایل دیتابیس را تغییر دهید. پس پاور شل را باز کنید و دستور زیر را وارد کنید.

>> mongod --dbpath C:\BooksData
پس از اجرا شدن daemon ، باید از طریق شل mongo که یک شل جاوااسکریپتی است، به آن متصل شویم. از طریق این شل می‌توان کوئری‌ها و دستورات دستکاری داده‌ها را بر روی دیتابیس MongoDb اجرا کنیم. پس یک کنسول پاورشل جدید را باز کرده و دستور زیر را در آن وارد کنید.
>> mongo
پس از متصل شدن به شل، از طریق دستورuse ، یک دیتابیس را به نام BookstoreDb بسازید. بنابراین دستور زیر را وارد کنید.

>> use BookstoreDb
توجه کنید اگر از قبل این دیتابیس وجود داشته باشد، از آن استفاده می‌کند و گرنه آن را خواهد ساخت. بعد از اینکه پیغام switched to db BookstoreDb را مشاهده کردید، می‌توانید هر جا که به این دیتابیس نیاز داشته باشید، از دستور db استفاده نمایید که اشاره به دیتابیسی دارد که آن را use کرده‌ایم.

بعد از ساختن دیتابیس، باید یک کالکشن بسازید. کالکشن‌ها را می‌توان معادل جداول، در دیتابیس‌های رابطه‌ای تصور کرد. با دستور createCollection می توان اینکار را انجام داد. برای اینکار دستور زیر را وارد کنید.

>> db.createCollection('Books')
با این دستور، یک کالکشن با نام Books ساخته می‌شود. اگر پیغام { ok" : 1" } را دیدید، مطمئن باشید که کالکشن Books به درستی ساخته شده‌است. در واقع بعد از ساختن اولین کالکشن، دیتابیس ساخته می‌شود. با دستور show dbs می‌توانید دیتابیس‌های ساخته شده را ببینید.

بعد از ساختن کالکشن، می‌خواهیم مقداری دیتا را در آن قرار دهیم. معادل رکورد در دیتابیس‌های رابطه‌ای، در دیتابیس مونگو دی‌بی، Document نام دارد که مانند رکوردهای دیتابیس‌های رابطه‌ای نیست و ساختار و اسکیمای خاصی ندارد؛ یعنی می‌توان هر دیتایی را با هر ساختاری در آن ذخیره کرد. می‌خواهیم دو Document را به کالکشن Books اضافه کنیم. پس دستور زیر را وارد می‌کنیم. توجه کنید داده‌ها با ساختار json وارد می‌شوند.

>> db.Books.insertMany([{'Name':'Design Patterns','Price':54.93,'Category':'Computers','Author':'Ralph Johnson'}, {'Name':'Clean Code','Price':43.15,'Category':'Computers','Author':'Robert C. Martin'}])
بعد از اجرای دستور بالا، نتایج زیر را در خروجی می‌بینید که گویای این مطلب است که دو Document جدید اضافه شده‌است و خود سرور، به هر یک از داکیومنت‌ها، یک شناسه یا آی دی اختصاص داده‌است و Ack درست هم برگشت داده شده‌است که به معنای انجام درست کار است. اگر می‌خواهید خودتان به داکیومنت‌هایی که می‌سازید آی دی بدهید، باید از پراپرتی id_ استفاده نمایید.
 {
      "acknowledged" : true,
      "insertedIds" : [
         ObjectId("5bfd996f7b8e48dc15ff215d"),
         ObjectId("5bfd996f7b8e48dc15ff215e")
      ]
}
برای اینکه محتویات کالکشنی را مشاهده کنید، دستور زیر را وارد کنید. همانطور که اشاره شد، db، به دیتابیس ساخته شده اشاره دارد؛ Books همان کالکشن‌مان است و با استفاده از متد find می‌توان داده‌های کالکشن را جستجو کرد که در این مثال ما، هیچ فیلتری به آن نداده‌ایم. پس در نتیجه تمام دیتاها را بر می‌گرداند. متد pretty هم داده‌های برگشتی را در یک ساختار مرتب نمایش می‌دهد.
>> db.Books.find().pretty()
و خروجی زیر را مشاهده خواهید کرد
 {
      "_id" : ObjectId("5bfd996f7b8e48dc15ff215d"),
      "Name" : "Design Patterns",
      "Price" : 54.93,
      "Category" : "Computers",
      "Author" : "Ralph Johnson"
},
{
      "_id" : ObjectId("5bfd996f7b8e48dc15ff215e"),
      "Name" : "Clean Code",
      "Price" : 43.15,
      "Category" : "Computers",
      "Author" : "Robert C. Martin"
}
حالا دیتابیس ما آماده شده‌است. در بخش‌های بعدی با استفاده از فریم ورک   ASP.NET Core Web Api  ، Api هایی خواهیم نوشت که داده‌های این دیتابیس را به بیرون ارائه خواهد داد. 

مطالب
معماری لایه بندی نرم افزار #1

طراحی یک معماری خوب و مناسب یکی از عوامل مهم تولید یک برنامه کاربردی موفق می‌باشد. بنابراین انتخاب یک ساختار مناسب به منظور تولید برنامه کاربردی بسیار مهم و تا حدودی نیز سخت است. در اینجا یاد خواهیم گرفت که چگونه یک طراحی مناسب را انتخاب نماییم. همچنین روش‌های مختلف تولید برنامه‌های کاربردی را که مطمئنا شما هم از برخی از این روشها استفاده نمودید را بررسی می‌نماییم و مزایا و معایب آن را نیز به چالش می‌کشیم.

ضد الگو (Antipattern) – رابط کاربری هوشمند (Smart UI)

با استفاده از Visual Studio یا به اختصار VS، می‌توانید برنامه‌های کاربردی را به راحتی تولید نمایید. طراحی رابط کاربری به آسانی عمل کشیدن و رها کردن (Drag & Drop) کنترل‌ها بر روی رابط کاربری قابل انجام است. همچنین در پشت رابط کاربری (Code Behind) تمامی عملیات مربوط به مدیریت رویدادها، دسترسی به داده ها، منطق تجاری و سایر نیازهای برنامه کاربردی، کد نویسی خواهند شد. مشکل این نوع کدنویسی بدین شرح است که تمامی نیازهای برنامه در پشت رابط کاربری قرار می‌گیرند و موجب تولید کدهای تکراری، غیر قابل تست، پیچیدگی کدنویسی و کاهش قابلیت استفاده مجدد از کد می‌گردد.

به این روش کد نویسی Smart UI می‌گویند که موجب تسهیل تولید برنامه‌های کاربردی می‌گردد. اما یکی از مشکلات عمده‌ی این روش، کاهش قابلیت نگهداری و پشتیبانی و عمر کوتاه برنامه‌های کاربردی می‌باشد که در برنامه‌های بزرگ به خوبی این مشکلات را حس خواهید کرد.

از آنجایی که تمامی برنامه نویسان مبتدی و تازه کار، از جمله من و شما در روزهای اول برنامه نویسی، به همین روش کدنویسی می‌کردیم، لزومی به ارائه مثال در رابطه با این نوع کدنویسی نمی‌بینم.

تفکیک و جدا سازی اجزای برنامه کاربردی (Separating Your Concern)

راه حل رفع مشکل Smart UI، لایه بندی یا تفکیک اجزای برنامه از یکدیگر می‌باشد. لایه بندی برنامه می‌تواند به شکل‌های مختلفی صورت بگیرد. این کار می‌تواند توسط تفکیک کدها از طریق فضای نام (Namespace)، پوشه بندی فایلهای حاوی کد و یا جداسازی کدها در پروژه‌های متفاوت انجام شود. در شکل زیر نمونه ای از معماری لایه بندی را برای یک برنامه کاربردی بزرگ می‌بینید.

به منظور پیاده سازی یک برنامه کاربردی لایه بندی شده و تفکیک اجزای برنامه از یکدیگر، مثالی را پیاده سازی خواهیم کرد. ممکن است در این مثال با مسائل جدید و شیوه‌های پیاده سازی جدیدی مواجه شوید که این نوع پیاده سازی برای شما قابل درک نباشد. اگر کمی صبر پیشه نمایید و این مجموعه‌ی آموزشی را پیگیری کنید، تمامی مسائل نامانوس با جزئیات بیان خواهند شد و درک آن برای شما ساده خواهد گشت. قبل از شروع این موضوع را هم به عرض برسانم که علت اصلی این نوع پیاده سازی، انعطاف پذیری بالای برنامه کاربردی، پشتیبانی و نگهداری آسان، قابلیت تست پذیری با استفاده از ابزارهای تست، پیاده سازی پروژه بصورت تیمی و تقسیم بخشهای مختلف برنامه بین اعضای تیم و سایر مزایای فوق العاده آن می‌باشد.

1- Visual Studio را باز کنید و یک Solution خالی با نام SoCPatterns.Layered ایجاد نمایید.

· جهت ایجاد Solution خالی، پس از انتخاب New Project، از سمت چپ گزینه Other Project Types و سپس Visual Studio Solutions را انتخاب نمایید. از سمت راست گزینه Blank Solution را انتخاب کنید.

2- بر روی Solution کلیک راست نموده و از گزینه Add > New Project یک پروژه Class Library با نام SoCPatterns.Layered.Repository ایجاد کنید.

3- با استفاده از روش فوق سه پروژه Class Library دیگر با نامهای زیر را به Solution اضافه کنید:

  • SoCPatterns.Layered.Model
  • SoCPatterns.Layered.Service
  • SoCPatterns.Layered.Presentation

4- با توجه به نیاز خود یک پروژه دیگر را باید به Solution اضافه نمایید. نوع و نام پروژه در زیر لیست شده است که شما باید با توجه به نیاز خود یکی از پروژه‌های موجود در لیست را به Solution اضافه کنید.

  • Windows Forms Application (SoCPatterns.Layered.WinUI)
  • WPF Application (SoCPatterns.Layered.WpfUI)
  • ASP.NET Empty Web Application (SoCPatterns.Layered.WebUI)
  • ASP.NET MVC 4 Web Application (SoCPatterns.Layered.MvcUI)

5- بر روی پروژه SoCPatterns.Layered.Repository کلیک راست نمایید و با انتخاب گزینه Add Reference به پروژه‌ی SoCPatterns.Layered.Model ارجاع دهید.

6- بر روی پروژه SoCPatterns.Layered.Service کلیک راست نمایید و با انتخاب گزینه Add Reference به پروژه‌های SoCPatterns.Layered.Model و SoCPatterns.Layered.Repository ارجاع دهید.

7- بر روی پروژه SoCPatterns.Layered.Presentation کلیک راست نمایید و با انتخاب گزینه Add Reference به پروژه‌های SoCPatterns.Layered.Model و SoCPatterns.Layered.Service ارجاع دهید.

8- بر روی پروژه‌ی UI خود به عنوان مثال SoCPatterns.Layered.WebUI کلیک راست نمایید و با انتخاب گزینه Add Reference به پروژه‌های SoCPatterns.Layered.Model، SoCPatterns.Layered.Repository، SoCPatterns.Layered.Service و SoCPatterns.Layered.Presentation ارجاع دهید.

9- بر روی پروژه‌ی UI خود به عنوان مثال SoCPatterns.Layered.WebUI کلیک راست نمایید و با انتخاب گزینه Set as StartUp Project پروژه‌ی اجرایی را مشخص کنید.

10-  بر روی Solution کلیک راست نمایید و با انتخاب گزینه Add > New Solution Folder پوشه‌های زیر را اضافه نموده و پروژه‌های مرتبط را با عمل Drag & Drop در داخل پوشه‌ی مورد نظر قرار دهید.

  • 1. UI
    • § SoCPatterns.Layered.WebUI

  • 2. Presentation Layer
    • § SoCPatterns.Layered.Presentation

  • 3. Service Layer
    • § SoCPatterns.Layered.Service

  • 4. Domain Layer
    • § SoCPatterns.Layered.Model

  • 5. Data Layer
    • § SoCPatterns.Layered.Repository
  • توجه داشته باشید که پوشه بندی برای مرتب سازی لایه‌ها و دسترسی راحت‌تر به آنها می‌باشد.

پیاده سازی ساختار لایه بندی برنامه به صورت کامل انجام شد. حال به پیاده سازی کدهای مربوط به هر یک از لایه‌ها و بخش‌ها می‌پردازیم و از لایه Domain شروع خواهیم کرد. 

مطالب
ساخت DropDownList های مرتبط به کمک jQuery Ajax در MVC
در پروژه‌های زیادی با مواردی مواجه می‌شویم که دو انتخاب داریم ، و یک انتخاب زیر مجموعه انتخاب دیگر است ، مثلا رابطه بین استان‌ها و شهر‌ها ، در انتخاب اول استان انتخاب می‌شود و مقادیر DropDownList  شهر‌ها حاوی ، شهر‌های آن استان می‌شود.
در پروژه‌های WebForm  این کار به کمک Update Panel  انجام می‌شد ، ولی در پروژه‌های MVC  ما این امکان را نداریم و خودمان باید به کمک موارد دیگر این درخواست را پیاده سازی کنیم.
در پروژه ای که فعلا مشغول آن هستم ، با این مورد مواجه شدم ، و دیدم شاید بد نباشد راهکار خودم را با شما در میان بگذارم.
صورت مسئله :
کاربری نیاز به وارد کردن اطلاعات یک شیرالات بهداشتی  (Tap) را دارد ، از DropDownList   اول نوع آن شیر (Type)  را انتخاب می‌کند ، و از DropDownList  دوم ، که شامل گروه‌های آن نوع است ، گروه(Category) مورد نظر را انتخاب می‌کند. (در انتهای همین مطلب ببینید )
ساختار Table‌های دیتابیس به این صورت است: 

رابطه ای از جدول Type به جدول Category.

به کمک Scaffolding یک کنترلر برای کلاس Tap (شیر آب) می‌سازیم ، به طور عادی در فایل Create.chtml مقدار گروه را به صورت DropDown  نمایش می‌دهد، حال ما نیاز داریم که خودمان  DropDown را برای Type  ایجاد کنیم و بعد ارتباط این‌ها را بر قرار کنیم.

تابع اولی Create را این طوری ویرایش می‌کنیم :

        public ActionResult Create()
        {
            ViewBag.Type = new SelectList(db.Types, "Id", "Title");
            ViewBag.Category = new SelectList(db.Categories, "Id", "Title");
            return View();
        }

همان طور که مشخص است ، علاوه بر مقادیر Category  که خودش ارسال می‌کند ، ما نیز مقادیر نوع‌ها را به View  مورد نظر ارسال می‌کنیم.

برای نمایش دادن هر دو DropDownList ویو مورد نظر را به این صورت ویرایش می‌کنیم :

        <div>
            نوع
        </div>
        <div>
            @Html.DropDownList("Type", (SelectList)ViewBag.Type, "-- انتخاب ---", new { id = "rdbTyoe" })
            @Html.ValidationMessageFor(model => model.Category)
        </div>

        <div>
            دسته بندی
        </div>
        <div>
            @Html.DropDownList("Category", (SelectList)ViewBag.Category, "-- انتخاب ---", new { id = "rdbCategory"})
            @Html.ValidationMessageFor(model => model.Category)
        </div>

همان طور که مشاهده می‌کنید ، در اینجا  DropDownList  مربوط به Type که خودمان سمت سرور ،مقادیر آن را پر کرده بودیم نمایش می‌دهیم.

خب شاید تا اینجای کار ، ساده بود ولی میرسیم به اصل مطلب و ارتباط بین این دو DropDownList. (قبل از این قسمت حتما نگاهی به ساختار DropDownList یا همان تگ select بیندازید ، اطلاعات جی کوئری شما در این قسمت خیلی کمک حال شما است)

برای این کار ما از jQuery  استفادی می‌کنیم ، کار به این صورت است که هنگامی که مقدار DropDownList  اول تغییر کرد :

  •  ما Id  آن را به سرور ارسال می‌کنیم.
  •  در آنجا Category  هایی که دارای Type با Id  مورد نظر هستند را جدا می‌کنیم
  • فیلد‌های مورد نیاز یعنی Id  و Title را می‌گیریم
  • و بعد به کمک Json مقادیر را بر می‌گردانیم 
  • و مقادیر ارسالی از سرور را در option‌های DropDownList  دوم (گروه‌ها ) قرار می‌دهم 
در ابتدا متدی در سرور می‌نویسیم ، کار این متد (همان طور که گفته شد) گرفتن Id از نوع Type استو برگرداندن Category‌های مورد نظر. به این صورت :
        public ActionResult SelectCategory(int id)
        {
            var categoris = db.Categories.Where(m => m.Type1.Id == id).Select(c => new { c.Id, c.Title });
            return Json(categoris, JsonRequestBehavior.AllowGet);
        }
ابتدا به کمک Where مقادیر مورد نظر را پیدا می‌کنیم و بعد به کمک Select فیلد هایی مورد استفاده را جدا می‌کنیم و به کمک Json اطلاعات را بر می‌گردانیم. توجه داشته باشید که مقادیری که در categoris  قرار می‌گیرد ، شبیه به مقادیر json  هستند و ما می‌تانیم مستیما از این مقادیر در javascript استفاده کنیم. 
در کلایت (همان طور که گفته شد ) به این نیاز داریم که هنگاهی که مقدار در لیست اول تغییر کرد ، ای دی آن را به تابع بالا بفرستیم و مقادیر بازگشتی را در  DropDownList  دوم قرار دهیم : به این صورت :
            $('#rdbTyoe').change(function () {
                jQuery.getJSON('@Url.Action("SelectCategory")', { id: $(this).attr('value') }, function (data) {
                    $('#rdbCategory').empty();
                    jQuery.each(data, function (i) {
                        var option = $('<option></option>').attr("value", data[i].Id).text(data[i].Title);
                        $("#rdbCategory").append(option);
                    });
                });
            });
توضیح کد :
با کمک تابع .change() از تغییر مقدار آگاه می‌شویم ، و حالا می‌توانیم مراحل کار را انجام دهیم. حالا وقت ارسال اطلاعات ( Id مورد گزینه انتخاب شده در تغییر مقدار ) به سرور است که ما این کار را به کمک jQuery.getJSON انجام می‌دهیم ، در تابع callback باید کار مقدار دهی انجام شود.
به ازای رکورد هایی که برگشت شده است که حالا در data قرار دارد به کمک تابع each لوپ می‌رنیم و هربار این کار را تکرار می‌کنیم.
  • ابتدا یک تگ option می‌سازیم 
  • مقادیر مربوطه شامل Id که باید در attribute مورد نظر value قرار گیرد و متن آن که باید به عنوان text باشد را مقدار دهی می‌کنیم
  • option آماده شده را به DropDownList دومی (Category ) اضافه می‌کنیم.
توجه داشته باشید که هنگامی که کار دریافت اطلاعات با موفقیت انجام شد ، مقادیر داخل DropDownList  دومی ، مربوط به Category را به منظور بازیابی دوباره در  
$('#rdbCategory').empty(); 
خالی می‌کنیم.
نتیجه کار برای من می‌شود این :
قبل از انتخاب :

بعد از انتخاب :

موفق و پیروز باشید