.NET Tips | جستجوها: نتایج مشابه «واکشی اولیه در HTML۵ Prefetching

نظرات مطالب

روش استفاده‌ی صحیح از HttpClient در برنامه‌های دات نت

بررسی کنید آیا مسیر http://localhost:5000/api/account/login یا مسیر مشابه آن در مرورگر قابل دسترسی هست یا خیر. اگر بله، با HttpClient هم قابل دسترسی است.

‫۶ سال و ۲ ماه قبل، چهارشنبه ۳۱ مرداد ۱۳۹۷، ساعت ۰۴:۰۹

وحید نصیری

نظرات مطالب

مفهوم READ_COMMITTED_SNAPSHOT در EF 6

بحث اصلی هم همین نحوه و محل ذخیره سازی snapshot است.
- Sanpshot مطابق واژه نامه مایکروسافت معنای «نگارش» را می‌دهد. در این حالت کلیه کوئری‌های داخل یک تراکنش، یک نگارش یا snapshot از دیتابیس را مشاهده خواهند کرد. این نگارش یا Row version، در tempdb نگه داری می‌شود. با فعال سازی SNAPSHOT isolation، هر زمانیکه یک ردیف به روز رسانی می‌شود، موتور SQL Server یک نسخه از اطلاعات اولیه این ردیف را در tempdb ذخیره می‌کند (اینجا بود که عنوان شد با یک کپی فقط خواندنی از اطلاعات در حین واکشی اطلاعات سر و کار خواهید داشت).
خلاصه الگوریتم کاری آن :
الف) با آغاز یک تراکنش، یک عدد متوالی منحصربفرد تراکنش (شماره نگارش) ایجاد شده و به آن نسبت داده می‌شود.
ب) در حین این تراکنش، موتور SQL Server، به tempdb مراجعه کرده و شماره نگارشی نزدیک و کمتر از شماره نگارش تراکنش جاری را پیدا می‌کند. همچنین SQL Server بررسی می‌کند که این شماره یافت شده حتما جزو تراکنش‌های پایان یافته سیستم باشد.
ج) بر اساس این شماره یافت شده، نگارش معتبری از اطلاعات از tempdb استخراج می‌شود.
به این ترتیب یک تراکنش، کلیه اطلاعات موجود در ابتدای کار خود را بدون قرار دادن قفلی بر روی جداول مرتبط، دریافت خواهد کرد.
اطلاعات بیشتر

- در متن ذکر گردید که از SQL Server 2005 به بعد قابلیت فوق اضافه شده.
- همچنین SQL Server 2000 دیگر پشتیبانی رسمی ندارد و استفاده از آن حداقل از لحاظ امنیتی معقول نیست.

‫۱۱ سال و ۴ ماه قبل، شنبه ۱۵ تیر ۱۳۹۲، ساعت ۱۶:۱۸

وحید نصیری

مطالب

درست کردن فایل راهنمای CHM از توضیحات XML یک پروژه

تا حالا هیچ وقت برای شما این سؤال پیش اومده که این فایل‌های CHM راهنمای زیبایی که برای مثال به‌عنوان مستندات یک کتابخانه در دات نت ارائه می‌شوند با چه نرم‌افزار یا نرم‌افزارهایی تولید می‌شوند؟ یا اینکه به نظر یک یا چند نفر ساعت‌ها وقت می‌گذارند، صفحات HTML مربوطه را تولید می‌کنند و در آخر با استفاده از ابزارهای تولید فایل CHM ، فایل راهنما را نهایی می‌کنند؟
این فایل‌ها به صورت خودکار بر اساس XML code comments ارائه شده برای یک متد ، کلاس و امثال آن تولید می‌شوند. برای مثال به توضیحات زیر دقت بفرمائید:


    /// <summary>
    /// استخراج ایمیل‌های یک فایل متنی و ذخیره آن در فایلی جدید
    /// </summary>
    /// <param name="inFilePath">فایل ورودی</param>
    /// <param name="outFilePath">فایل خروجی</param>
    public static void ExtractEmails(string inFilePath, string outFilePath)

هر چند VS.Net‌ در ایجاد خوکار قالب اولیه این نوع کامنت‌ها بسیار خوب عمل می‌کند اما نکات پیشرفته‌تری نیز در این‌باره موجود هستند که در کیفیت فایل راهنمای تولید شده بر اساس این توضیحات بسیار مؤثرند. راهنمای کاملی در این‌باره را از اینجا می‌توانید دریافت کنید.
در ادامه نحوه تولید خودکار این نوع راهنماها را بررسی خواهیم کرد.

الف) نصب برنامه‌های مورد نیاز
برای ایجاد فایل chm از توضیحات xml ایی ارائه شده، ابتدا دو برنامه سورس باز زیر را دریافت و نصب کنید:

Sandcastle

Sandcastle Help File Builder

سپس نیاز به HTML Help 2.0 compiler خواهد بود. این کامپایلر به همراه SDK ویژوال استودیو ارائه می‌شود. بسته به نگارش VS مورد استفاده، نیاز است تا یکی از موارد زیر را دریافت و نصب کنید:

Visual Studio 2005 SDK Version 4.0

Visual Studio 2008 SDK Version 1.0

برنامه hxcomp.exe ذکر شده، عموما در مسیر زیر نصب خواهد شد:

%Program Files%\Common Files\Microsoft Shared\Help 2.0 Compiler\

ب) تنظیمات VS.Net
مرحله بعد به تنظیمات VS.Net مربوط می‌شود. به صفحه خواص پروژه مراجعه کنید و در برگه Build ، گزینه تولید XML documentation file را انتخاب کنید. سپس مجددا پروژه خود را کامپایل کنید.

ج) تنظیمات Sandcastle Help File Builder
یک پروژه جدید را در این برنامه آغاز کرده و سپس فایل اسمبلی و xml تولید شده آنرا انتخاب کنید. (بر روی دکمه add کلیک کرده و هر دو فایل exe یا dll مورد نظر را به همراه فایل xml آن که در قسمت ب تولید کردیم، انتخاب کنید. در صورت عدم انتخاب یکی از موارد فایل راهنما تولید نخواهد شد)
اکنون نوبت به تنظیمات پروژه می‌رسد.
در قسمت Build:
گزینه Help File Format را انتخاب کرده و سپس html help 2x را نیز تیک بزنید. (در صورت تمایل به تولید این نوع فرمت)
در قسمت Dependencies ، تمام اسمبلی‌هایی را که پروژه شما به آن وابسته است، اضافه کنید.
توسط گزینه Framework Version ، نگارشی از دات نت فریم ورک که اسمبلی شما بر اساس آن کامپایل شده است را انتخاب کنید.
در قسمت Help File:
Presentation Style را بر روی VS2005 قرار دهید. این‌کار اجباری نیست اما راهنمای حاصل زیباتر خواهد بود.
در قسمت Paths :
مسیرهای کامپایلرهای راهنما را مشخص کنید. بر روی سیستم من این مسیرها مطابق شکل زیر هستند:

اگر HTML Help Workshop بر روی سیستم شما نصب نبود، آنرا از این آدرس دریافت نمائید.

د) ساخت فایل راهنما
بر روی آیکون build در نوار ابزار برنامه کلیک کنید (و یا انتخاب گزینه documentation->build)

تا اینجا اگر هر دو نوع Help1xAndHelp2x را در قسمت build انتخاب کرده باشید، دو نوع راهنمای مستقل و همچنین قابل یکپارچه شدن با سیستم راهنمای VS.net را تولید کرده‌اید.

ه) یکپارچه سازی Help2x تولید شده با سیستم راهنمای VS.Net
پروژه جدیدی را در VS.Net از نوع Other Project Types > Extensibility > Help Integration Wizard ایجاد کنید. در مرحله اول، ایجاد setup و نوع VS را انتخاب کرده و در صفحه بعد فایل‌های Help2x خود را اضافه کنید (فایلهایی با پسوند hxs). دو مرحله آخر را مطابق نیازهای کاری خود تنظیم نموده و پروژه را در آخر build کنید. نصاب تولید شده فایل‌های راهنمای شما را با سیستم راهنمای VS.Net یکپارچه خواهد ساخت.

چند نکته:
1- جهت سفارشی سازی بیشتر راهنمای تولید شده می‌توان از ابزار سورس باز زیر نیز کمک گرفت:
http://www.codeplex.com/DocProject
2- افزونه‌ای رایگان برای VS.Net جهت سهولت تولید توضیحات XML در آدرس زیر قابل دریافت است:
http://www.roland-weigelt.de/ghostdoc

‫۱۵ سال و ۱۲ ماه قبل، یکشنبه ۳ آذر ۱۳۸۷، ساعت ۱۶:۳۷

مهمان

بازخوردهای پروژه‌ها

دیت پیکر فارسی

مسلما یکی از مشکلات ما در زبان فارسی تقویم هست و بیشترین کامپوننت‌ها در تمامی سیستم‌های دیجیتال موبایل، کامپیوتر برنامه نویسی دیتابیس و غیره تبدیل تاریخ هست
تلاشهای همه افراد هم خوب و ستودنی است ولی به نظر خود من این دیت پیکر امکانات کمی داره
دیت پیکر
http://stefangabos.ro/jquery/zebra-datepicker/

خیلی عالی هست و با کتابخانه PersianCalendar که در جاوا اسکریپت نوشته شده به سادگی فارسی میشه و خیلی خوب هم کار میکنه حالا باید این نسخه ای که تاریخ فارسی داره رو بذارم روی وب
تبدیلش به کامپوننت هم کار زیاد سختی نیست

‫۱۱ سال و ۴ ماه قبل، چهارشنبه ۲۹ خرداد ۱۳۹۲، ساعت ۲۲:۰۳

وحید محمدطاهری

مسیرراه‌ها

ASP.NET Web API

‫۹ سال و ۱۱ ماه قبل، شنبه ۲۴ آبان ۱۳۹۳، ساعت ۱۵:۴۷

محمد جواد ابراهیمی

نظرات مطالب

شروع به کار با EF Core 1.0 - قسمت 5 - استراتژهای تعیین کلید اصلی جداول و ایندکس‌ها

ممنون اقای ربال عزیز

در تکمیل پاسخ و رفع ابهامی که برای خودم پیش اومده بود باید بگم استفاده از Sequence در حالت عادی باعث استفاده از الگوریتم HiLo نمی‌شود مگر زمانی که در کنار متد UseHiLo (متد قبلی آن ForSqlServerUseSequenceHiLo منسوخ شده است) به کاربرده شود.

طرز کار به این صورت است توسط کد زیر

entity.Property(e => e.SequenceId).HasDefaultValueSql("NEXT VALUE FOR [OrderNumbers]")

میتوان مقدار Sequence تعریف شده (OrderNumbers) را بر روی یک خاصیت خاص (مثلا SequenceId) معرفی کرد و مقدار این خاصیت به صورت خودکار از مقدار بعدی Sequence تعریف شده پر خواهد شد، ولی نه قبل از Insert بلکه بعد از آن (بعد از متد SaveChanges)، پس به خودی خود از HiLo استفاده نمیکند.

در عوض قابلیت HiLo این امکان را می‌دهد یک خاصیت قبل از Insert شدن (بعد از فراخوانی متد Add و قبل از SaveChanges) از دیتابیس مقدار بگیرد.

برای استفاده از این حالت، توسط متد UseHiLo و تعیین نام Sequence تعریف شده، مقدار فیلد قبل از Insert شدن از دیتابیس واکشی می‌شود

modelBuilder.HasSequence<int>("OrderNumbers").StartsAt(1000).IncrementsBy(5);
modelBuilder.UseHiLo("OrderNumbers");

اما چند نکته در این بین وجود دارد :

1- فراخوانی متد UseHiLo بر روی modelBuilder باعث میشود تمام خواصی که به صورت ValueGenerated.OnAdd (توسط [DatabaseGenerated(DatabaseGeneratedOption.Identity)] یا متد ValueGeneratedOnAdd) نشانه گذاری شده اند اعمال شود، نه یک پروپرتی خاص

2- جهت اعمال HiLo بر روی یک پروپرتی خاص باید به صورت زیر عمل کنید

entity.Property(p => p.SequenceId).UseHiLo("OrderNumbers");

3- اگر نام Sequence ایی که به متد UseHiLo پاس داده می‌شود وجود داشته باشد از همان استفاده می‌کند، در غیر این صورت یک Sequence جدید با آن نام و مقدار پیشفرض StartsAt برابر 0 و IncrementsBy برابر 10 ایجاد میکند.

4- زمانی که از HiLo استفاده می‌شود در اولین درخواست Add به دیتابیس، مقدار بازه Sequence توسط دستور (SELECT NEXT VALUE FOR [OrderNumbers]) واکشی شده و هم برای آن entity و هم برای entity‌های بعدی، مادامی که بازه Sequence به آخر نرسد، دیگر Select ایی به دیتابیس زده نمی‌شود و مقادیر فیلد‌ها از بین بازه Sequence به صورت خودکار پر می‌شود.

مثلا اگر یک Sequence با StartAt برابر با 1000 و IncrementsBy برابر با 5 باشد، در اولین Add مقدار Sequence را خوانده (مثلا 1000 است) سپس تا 5 entity بعدی مقدار فیلد‌ها را " یکی یکی" و نه "5تا 5تا" مقدار دهی میکند (مثلا 1000، 1001، 1002، 1003، 1004) سپس برای entity شش ام، مجددا به دیتابیس درخواست زده و مقدار بعدی Sequence را واکشی میکند (مثلا مقدار بعدی می‌شود 1005) و ادامه ماجرا ...

مقدار بازه Sequence-based HiLo کش می‌شود و با Dispose شدن DbContext، صفر نخواهد شد و از بین نخواهد رفت، پس نگرانی ایی بابت طول عمر Scoped بودن DbContext در بحث DI وجود نخواهد داشت.

‫۴ سال و ۸ ماه قبل، سه‌شنبه ۲۴ دی ۱۳۹۸، ساعت ۲۰:۰۵

وحید نصیری

مطالب دوره‌ها

استفاده از async و await در برنامه‌های ASP.NET Web forms 4.5

سؤال: چه زمانی از متدهای async و چه زمانی از متدهای همزمان بهتر است استفاده شود؟

از متدهای همزمان متداول برای انجام امور ذیل استفاده نمائید:
- جهت پردازش اعمالی ساده و سریع
- اعمال مدنظر بیشتر قرار است بر روی CPU اجرا شوند و از مرزهای IO سیستم عبور نمی‌کنند.

و از متدهای غیرهمزمان برای پردازش موارد زیر کمک بگیرید:
- از وب سرویس‌هایی استفاده می‌کنید که متدهای نگارش async را نیز ارائه داده‌اند.
- عمل مدنظر network-bound و یا I/O-bound است بجای CPU-bound. یعنی از مرزهای IO سیستم عبور می‌کند.
- نیاز است چندین عملیات را به موازات هم اجرا کرد.
- نیاز است مکانیزمی را جهت لغو یک عملیات طولانی ارائه دهید.

مزایای استفاده از متدهای async در ASP.NET

استفاده از await در ASP.NET، ساختار ذاتی پروتکل HTTP را که اساسا یک synchronous protocol، تغییر نمی‌دهد. کلاینت، درخواستی را ارسال می‌کند و باید تا زمان آماده شدن نتیجه و بازگشت آن از طرف سرور، صبر کند. نحوه‌ی تهیه‌ی این نتیجه، خواه async باشد و یا حتی همزمان، از دید مصرف کننده کاملا مخفی است. اکنون سؤال اینجا است که چرا باید از متدهای async استفاده کرد؟
- پردازش موازی: می‌توان چند Task را مثلا توسط Task.WhenAll به صورت موازی با هم پردازش کرده و در نهایت نتیجه را سریعتر به مصرف کننده بازگشت داد. اما باید دقت داشت که این Taskها اگر I/O bound باشند، ارزش پردازش موازی را دارند و اگر compute bound باشند (اعمال محاسباتی)، صرفا یک سری ترد را ایجاد و مصرف کرده‌اید که می‌توانسته‌اند به سایر درخواست‌های رسیده پاسخ دهند.
- خالی کردن تردهای در حال انتظار: در اعمالی که disk I/O و یا network I/O دارند، پردازش موازی و اعمال async به شدت مقیاس پذیری سیستم را بالا می‌برند. به این ترتیب worker thread جاری (که تعداد آن‌ها محدود است)، سریعتر آزاد شده و به worker pool بازگشت داده می‌شود تا بتواند به یک درخواست دیگر رسیده سرویس دهد. در این حالت می‌توان با منابع کمتری، درخواست‌های بیشتری را پردازش کرد.

ایجاد Asynchronous HTTP Handlers در ASP.Net 4.5

در نگارش‌های پیش از دات نت 4.5، برای نوشتن فایل‌های ashx غیرهمزمان می‌بایستی اینترفیس IHttpAsynchHandler پیاده سازی می‌شد که نحوه‌ی کار با آن از مدل APM پیروی می‌کرد؛ نیاز به استفاده از یک سری callback داشت و این عملیات باید طی دو متد پردازش می‌شد. اما در دات نت 4.5 و با معرفی امکانات async و await، نگارش سازگاری با پیاده سازی کلاس پایه HttpTaskAsyncHandler فراهم شده است.
برای آزمایش آن، یک برنامه‌ی جدید ASP.NET Web forms نگارش 4.5 یا بالاتر را ایجاد کنید. سپس از منوی پروژه، گزینه‌ی Add new item یک Generic handler به نام LogRequestHandler.ashx را به پروژه اضافه نمائید.
زمانیکه این فایل به پروژه اضافه می‌شود، یک چنین امضایی را دارد:

 public class LogRequestHandler : IHttpHandler

IHttpHandler آن‌را اکنون به HttpTaskAsyncHandler تغییر دهید. سپس پیاده سازی ابتدایی آن به شکل زیر خواهد بود:

using System;
using System.Net;
using System.Text;
using System.Threading.Tasks;
using System.Web;

namespace Async14
{
    public class LogRequestHandler : HttpTaskAsyncHandler
    {
        public override async Task ProcessRequestAsync(HttpContext context)
        {
            string url = context.Request.QueryString["rssfeedURL"];
            if (string.IsNullOrWhiteSpace(url))
            {
                context.Response.Write("Rss feed URL is not provided");
            }

            using (var webClient = new WebClient {Encoding = Encoding.UTF8})
            {
                webClient.Headers.Add("User-Agent", "LogRequestHandler 1.0");
                var rssfeed = await webClient.DownloadStringTaskAsync(url);
                context.Response.Write(rssfeed);
            }
        }

        public override bool IsReusable
        {
            get { return true; }
        }

        public override void ProcessRequest(HttpContext context)
        {
            throw new Exception("The ProcessRequest method has no implementation.");
        }
    }
}

واژه‌ی کلیدی async را نیز جهت استفاده از await به نسخه‌ی غیرهمزمان آن اضافه کرده‌ایم.
در این مثال آدرس یک فید RSS از طریق کوئری استرینگ rssfeedURL دریافت شده و سپس محتوای آن به کمک متد DownloadStringTaskAsync دریافت و بازگشت داده می‌شود.
برای آزمایش آن، مسیر ذیل را درخواست دهید:

 http://localhost:4207/LogRequestHandler.ashx?rssfeedURL=https://www.dntips.ir/feed/latestchanges

کاربردهای فایل‌های ashx برای مثال ارائه فید‌های XML ایی یک سایت، ارائه منبع نمایش تصاویر پویا از بانک اطلاعاتی، ارائه JSON برای افزونه‌های auto complete جی‌کوئری و امثال آن است. مزیت آن‌ها سربار بسیار کم است؛ زیرا وارد چرخه‌ی طول عمر یک صفحه‌ی aspx معمولی نمی‌شوند.

صفحات async در ASP.NET 4.5

در قسمت‌های قبل مشاهده کردیم که در برنامه‌های دسکتاپ، به سادگی می‌توان امضای روال‌های رخداد گردان را به async تغییر داد و ... برنامه کار می‌کند. به علاوه از مزیت استفاده از واژه کلیدی await نیز در آن‌ها برخوردار خواهیم شد. اما ... هرچند این روش در وب فرم‌ها نیز صادق است (مثلا public void Page_Load را به public async void Page_Load می‌توان تبدیل کرد) اما اعضای تیم ASP.NET آن‌را در مورد برنامه‌های وب فرم توصیه نمی‌کنند:
Async void event handlers تنها در مورد تعداد کمی از روال‌های رخدادگردان ASP.NET Web forms کار می‌کنند و از آن‌ها تنها برای تدارک پردازش‌های ساده می‌توان استفاده کرد. اگر کار در حال انجام اندکی پیچیدگی دارد، «باید» از PageAsyncTask استفاده نمائید. علت اینجا است که Async void یعنی fire and forget (کاری را شروع کرده و فراموشش کنید). این روش در برنامه‌های دسکتاپ کار می‌کند، زیرا این برنامه‌ها مدل طول عمر متفاوتی داشته و تا زمانیکه برنامه از طرف OS خاتمه نیابد، مشکلی نخواهند داشت. اما برنامه‌های بدون حالت وب متفاوتند. اگر عملیات async پس از خاتمه‌ی طول عمر صفحه پایان یابد، دیگر نمی‌توان اطلاعات صحیحی را به کاربر ارائه داد. بنابراین تا حد ممکن از تعاریف async void در برنامه‌های وب خودداری کنید.

تبدیل روال‌های رخدادگردان متداول وب فرم‌ها به نسخه‌ی async شامل دو مرحله است:
الف) از متد جدید RegisterAsyncTask که در کلاس پایه Page قرار دارد برای تعریف یک PageAsyncTask استفاده کنید:

using System;
using System.Net;
using System.Text;
using System.Threading.Tasks;
using System.Web.UI;

namespace Async14
{
    public partial class _default : Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            RegisterAsyncTask(new PageAsyncTask(LoadSomeData));
        }

        public async Task LoadSomeData()
        {
            using (var webClient = new WebClient { Encoding = Encoding.UTF8 })
            {
                webClient.Headers.Add("User-Agent", "LogRequest 1.0");
                var rssfeed = await webClient.DownloadStringTaskAsync("url");

                //listcontacts.DataSource = rssfeed;
            }
        }
    }
}

با استفاده از System.Web.UI.PageAsyncTask می‌توان یک async Task را در روال‌های رخدادگردان ASP.NET مورد استفاده قرار داد.

ب) سپس در کدهای فایل aspx، نیاز است خاصیت async را نیز true نمائید:

 <%@ Page Language="C#" AutoEventWireup="true"
Async="true"
  CodeBehind="default.aspx.cs" Inherits="Async14._default" %>

تغییر تنظیمات IIS برای بهره بردن از پردازش‌های Async

اگر از ویندوزهای 7، ویستا و یا 8 استفاده می‌کنید، IIS آن‌ها به صورت پیش فرض به 10 درخواست همزمان محدود است.
بنابراین تنظیمات ذیل مرتبط است به یک ویندوز سرور و نه یک work station :
به IIS manager مراجعه کنید. سپس برگه‌ی Application Pools آن‌را باز کرده و بر روی Application pool برنامه خود کلیک راست نمائید. در اینجا گزینه‌ی Advanced Settings را انتخاب کنید. در آن Queue Length را به مثلا عدد 5000 تغییر دهید. همچنین در دات نت 4.5 عدد 5000 برای MaxConcurrentRequestsPerCPU نیز مناسب است. به علاوه عدد connectionManagement/maxconnection را نیز به 12 برابر تعداد هسته‌های موجود تغییر دهید.

‫۱۰ سال و ۷ ماه قبل، سه‌شنبه ۱۲ فروردین ۱۳۹۳، ساعت ۱۷:۰۰

جواد رسولی

مطالب

شروع کار با Angular Material ۲

Angular Material ۲، کامپوننت‌های طراحی متریال (Material Design) را برای برنامه‌های انگیولار ۲ فراهم می‌آورد. هدف Angular Material ۲ ارائه مجموعه‌ای از کامپوننت‌های واسط کاربری با طراحی متریال (Material Design)، برای ساخت برنامه‌هایی توسط انگیولار ۲ و تایپ اسکریپت است. در این مقاله مراحل پیاده سازی یک پروژه انگیولار ۲ را که واسط کاربری آن از طراحی متریال بهره می‌برد، دنبال خواهیم کرد.

* نکته: پروژه انگیولار متریال ۲ در زمان نوشتن این مقاله به تازگی نسخه بتا ۵ را ارائه داده و همچنان در حال توسعه است. این بدان معنی است که ممکن است همه چیز به سرعت تغییر یابد.

مقدمه

انگیولار متریال ۲ همانند انگیولار متریال یک، تمامی المانهای مورد نیاز برای طراحی یک برنامه تک صفحه‌ای را به راحتی فراهم می‌کند (هرچند تمامی المانهای آن در نسخه بتا پیاده سازی نشده‌اند). خبر خوب اینکه، اکثر کامپوننتهای ارائه شده در انگیولار متریال ۲ از قالب راست به چپ پشتیبانی می‌کنند و اعمال این قالب به سادگی اضافه کردن خصوصیت dir یک المان به rtl است.

در صفحه گیت‌هاب انگیولار متریال ۲ آمده‌است که انگیولار متریال ۲، واسط‌های کاربری با کیفیت بالا را ارائه می‌دهد و در ادامه منظورش را از «کیفیت بالا»، اینگونه بیان می‌کند:

بین‌المللی و قابل دسترس برای همه به نحوی که تمامی کاربران می‌توانند از آنها استفاده کنند (عدم مشکل در چند زبانه بودن و پشتیبانی از قالب راست به چپ و چپ به راست) .
دارای APIهای ساده برای توسعه دهندگان.
رفتار مورد انتظار و بدون خطا در تمامی موردهای کاری
تست تمامی رفتارها توسط تست یکپارچگی (unit test ) و تست واحد ( integration test )
قابلیت سفارشی سازی در چارچوب طراحی متریال
بهره‌وری بالا
کد تمیز و مستندات خوب

شروع کار با انگیولار متریال ۲

قدم اول: نصب angular-material و hammerjs

برای شروع بایستی Angular Material و angular animations و hammer.js را توسط npm به صورت زیر نصب کنید.

npm install --save @angular/material @angular/animations

npm install --save hammerjs

angular/material@: بسته مربوط به انگیولار متریال دو را نصب خواهد کرد.

angular/animations@: این بسته امکاناتی جهت ساخت افکت‌های ویژه هنگام تغییر صفحات، یا بارگذاری المنت‌ها را از طریق کدهای css نوشته شده، به راحتی امکان‌پذیر می‌کند.

Hammerjs: برخی از کامپوننتهای موجود در انگیولار متریال ۲ وابسته به کتابخانه Hammerjs هستند. (از جمله md-slide-toggle و md-slider, mdTooltip)

قدم دوم: معرفی کتابخانه‌های خارجی به angular-cli.json

اگر تصمیم به استفاده از کتابخانه Hammerjs گرفتید بایستی آدرس فایل hammer.js را به قسمت script در فایل angular-cli.json اضافه کنید.

"scripts": [
  "../node_modules/hammerjs/hammer.min.js"
],

قدم سوم: افزودن Angular Material به ماوژل اصلی برنامه انگیولار

حالا نوبت اضافه کردن ماژول متریال به ماژول اصلی برنامه است. پس از معرفی ماژول MaterialModule و BrowserAnimationsModule در فایل app.module.ts این دو ماژول را به قسمت imports نیز اضافه می‌کنیم. فایل app.module.ts ما تقریبا به شکل زیر خواهد بود.

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';

import { MaterialModule } from '@angular/material';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';

import { AppComponent } from './app.component';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule,

    MaterialModule,
    BrowserAnimationsModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

قدم چهارم: افزودن تم و آیکون

همراه با نصب Angular Material تعدادی تم از قبل ساخته شده نیز نصب خواهند شد که شامل یکسری استایل با رنگهای مشخصی هستند. از جمله این تم‌ها عبارتند از:

indigo-pink
deeppurple-amber
purple-green
pink-bluegrey

همچنین با استفاده از Material Design icons نیز با استفاده از تگ <md-icon> به آیکونهای متریال نیز می‌توان دسترسی داشت.

برای افزودن آیکونهای متریال و همچنین انتخاب یک تم از قبل ساخته شده دو خط زیر را به فایل style.css اصلی برنامه اضافه کنید.

@import '~https://fonts.googleapis.com/icon?family=Material+Icons';
@import '~@angular/material/prebuilt-themes/deeppurple-amber.css';

نکته‌ای که در تگ <md-icon> وجود دارد این است که این تگ انواع فونت‌ها و آیکونهای svg را نیز پشتیبانی می‌کند. استفاده از آیکونهای متریال یکی از قابلیت‌های این تگ محسوب می‌شود.

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

قدم آخر: انگیولار متریال آماده است!

با انجام مراحل بالا اکنون می‌توانید به راحتی از کامپوننت‌های متریال استفاده کنید. کافی است کدهای زیر را به فایل app.component.html اضافه کنید و یک قالب ساده برای برنامه خود بسازید.

<md-sidenav-container>
  
  <md-sidenav #end align="end" opened="true" mode="side">
    
    <md-toolbar color="accent">
      <div>
        <md-toolbar-row>
          <img src="https://material.angular.io/favicon.ico" style="height:50px;margin-top: 2px; margin-bottom: 2px;">
          <span>
            برنامه من
          </span>
        </md-toolbar-row>
      </div>
    </md-toolbar>
    
    <md-nav-list>
      <md-list-item [routerLink]="['/']">
        <div>
          <div></div>
          <md-icon role="img" aria-label="home">home</md-icon>
          <span>خانه</span>
        </div>
      </md-list-item>
    </md-nav-list>

    <md-nav-list>
      <md-list-item [routerLink]="['/registries']">
        <div>
          <div></div>
          <md-icon role="img" aria-label="forms">content_paste</md-icon>
          <span>فرم</span>
        </div>
      </md-list-item>
    </md-nav-list>

    <md-nav-list>
      <md-list-item href="/charts">
        <div>
          <div></div>
          <md-icon role="img" aria-label="charts">show_chart</md-icon>
          <span>نمودارها</span>
        </div>
      </md-list-item>
    </md-nav-list>
  </md-sidenav>

  <header>
    <md-toolbar color="primary">
      <button md-icon-button (click)="end.toggle()">
        <md-icon>menu</md-icon>
      </button>
      <span>داشبورد</span>
      
      <button md-icon-button [md-menu-trigger-for]="menu">
        <md-icon>person</md-icon>
      </button>

    </md-toolbar>

    <md-menu x-position="before" #menu="mdMenu">
      <button md-menu-item>تنظیمات</button>
      <button md-menu-item>خروج</button>
    </md-menu>

  </header>

  <main>
    <router-outlet></router-outlet>
  </main>

</md-sidenav-container>

<span>
  <button md-fab>
    <md-icon>check circle</md-icon>
  </button>
</span>

همچنین کدهای css زیر را به فایل اصلی style.css اضافه کنید.

html, body, material-app, md-sidenav-container, .my-content {
  margin: 0;
  direction: rtl;
  width: 100%;
  height: 100%;
}

.mat-button-toggle,
.mat-button-base,
.mat-button,
.mat-raised-button,
.mat-fab,
.mat-icon-button,
.mat-mini-fab,
.mat-card,
.mat-checkbox,
.mat-input-container,
.mat-list,
.mat-menu-item,
.mat-radio-button,
.mat-select,
.mat-list .mat-list-item .mat-list-item-content,
.mat-nav-list .mat-list-item .mat-list-item-content,
.mat-simple-snackbar,
.mat-tab-label,
.mat-slide-toggle-content,
.mat-toolbar,
.mat-tooltip { font-family: 'Iranian Sans', Tahoma !important; 
}

md-sidenav {
  width: 225px;
  max-width: 70%;
}

  md-sidenav md-nav-list {
    display: block;
  }

    md-sidenav md-nav-list :hover {
      background-color: rgb(250, 250, 250);
    }



    md-sidenav md-nav-list .md-list-item {
      cursor: pointer;
    }

.side-navigation {
  padding-top: 0;
}

md-nav-list.side-navigation a[md-list-item] > .md-list-item > span.title {
  margin-right: 10px;
}

md-nav-list.side-navigation a[md-list-item] > .md-list-item {
  -webkit-font-smoothing: antialiased;
  letter-spacing: .14px;
}

md-list a[md-list-item] .md-list-item, md-list md-list-item .md-list-item, md-nav-list a[md-list-item] .md-list-item, md-nav-list md-list-item .md-list-item {
  display: flex;
  flex-direction: row;
  align-items: center;
  box-sizing: border-box;
  height: 48px;
  padding: 0 16px;
}

button.my-fab {
  position: absolute;
  right: 20px;
  bottom: 10px;
}

md-card {
  margin: 1em;
}

md-toolbar-row {
  justify-content: space-between;
}

.done {
  position: fixed;
  bottom: 20px;
  left: 20px;
  color: white;
}

md-nav-list.side-navigation a[md-list-item] {
  position: relative;
}

md-list a[md-list-item], md-list md-list-item, md-nav-list a[md-list-item], md-nav-list md-list-item {
  display: block;
}

md-list a[md-list-item], md-list md-list-item, md-nav-list a[md-list-item], md-nav-list md-list-item {
  color: #000;
}

md-nav-list a {
  text-decoration: none;
  color: inherit;
}

a {
  color: #039be5;
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
}

.no-padding {
  padding: 0 !important;
}

به همین راحتی برنامه نمونه با طراحی متریال آماده است.

‫۷ سال و ۵ ماه قبل، سه‌شنبه ۲۶ اردیبهشت ۱۳۹۶، ساعت ۱۸:۱۵

امید مهدیزاده اردبیلی

نظرات مطالب

ارسال ایمیل در ASP.NET Core

ممنون از راهنمایی شما و با تشکر از تهیه سرویس‌های مفید در کتابخانه DNT

مطلب اشاره شده رو مطالعه کردم اما چند اختلاف داره با چیزی که بنده لازم دارم:

برای مثال حالتی رو در نظر بگیرید که مثلا پس از موجود شدن محصول و تغییر وضعیت اون، باید به تمام کاربرانی که درخواست اطلاع رسانی کردن برای اون محصول، ایمیل ارسال بشه و طبعا نه تعداد ایمیل‌ها مشخص هست و نه زمان دقیق این کار:

اول اینکه فرمودید ارسال ایمیل آنی است: برای یک ایمیل طبعا چنین به نظر میاد ولی برای تعداد بالای ایمیل، UI قفل میشه با استفاده از سرویس WebMailService در کتابخانه‌ی DNT و البته برای اجتناب از این مشکل نمیشه هم که بدون await ازش استفاده کرد به خاطر نیازمندی‌های سرویس رندرویو در این کتابخانه.

دوم اینکه عنوان شده بود که سرویس هایی که به صورت بکگراند معرفی میشن غالبا غیر HTTP هستن و اما بنده به سرویس HttpContextAccessor نیاز دارم برای کار مورد نظرم و از طرفی خود شما هم در ارسال ایمیل به صورت قالب‌های از پیش تعیین شده HTML و در داخل سرویس ویورند کتابخانه DNT از HttpContextAccessor استفاده کردید.

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

چهارم اینکه در این نوع سرویس‌ها ظاهرا فقط یکبار در ابتدای برنامه متد ExecuteAsync اجرا میشه که تعداد و نوع پارامترهای ورودیش مشخصه که فقط یک CancellationToken هست و بنابراین چطور میشه بهش اطلاع داد که چه زمانی (نه به صورت زمان بندی شده و بلکه به صورت آنی) کار مورد نظر رو انجام بده (مثلا ارسال ایمیل از طریق سرویس WebMailService موجود در کتابخانه DNT شما به تعدادی کاربر)

و آخر اینکه در زمان نیاز به انجام کاری، معمولا تعدادی هم پارامتر وجود داره برای انجام کار. (مثلا شناسه محصولی که تغییر وضعیت داشته جهت استخراج مشخصات کاربرانی که اطلاع رسانی این محصول رو فعال کردن). چطور این پارامتر هارو باید به سرویس بکگراند انتقال داد!!

ممنون از حوصله و راهنمایی شما.

‫۳ سال و ۹ ماه قبل، چهارشنبه ۳ دی ۱۳۹۹، ساعت ۰۱:۰۴

کمال ح

نظرات مطالب

بازنویسی سطح دوم کش برای Entity framework 6

آیا راهی وجود داره که به وسیله کد نویسی بشه تمام اطلاعات کش رو پاک کرد؟

به این خاطر که بعضی وقت‌ها مدیر سامانه به صورت خود سر وارد سرور میشه و اطلاعات دیتابیس رو دستی تغییر میده. توی همچین مواقعی برنامه با مشکل روبرو میشه.

آیا راه کاری برای نمایش صحیح اطلاعات وجود دارد؟

‫۷ سال و ۱۰ ماه قبل، پنجشنبه ۱۱ آذر ۱۳۹۵، ساعت ۰۱:۳۹