Web Devs
640 subscribers
218 photos
22 videos
17 files
233 links
Articles, News, Jokes, Quotes, Back-End and UI/UX for web developers.
Github : https://github.com/fullStackDevsGroup
Advertising: @adsfullStackDevs
Download Telegram
Forwarded from Web Devs
#ABluePersianDateTimePicker
توضیحات تکمیلی


نحوه استفاده از این picker به صورت زیر به صورت میلادی و شمسی می باشد . میتونید اچ تی ام ال این صفحه را مشاهده کنید و المنت های خودتونو به سادگی بسازید و به دلخواه css هارو تغییر دهید.
🔹 با اتریبوت زیر روی المنت مثلا اینپوت picker فعال میشود
data-disablebeforetoday="true"

🔹 با اتریبوت زیر روزهای قبل امروز غیر فعال میشوند
data-disablebeforetoday="true"

🔸 با اتریبوت زیر میتونید تاریخ میلادی را فعال کنید
data-isgregorian="true"

🔹 با اتریبوت زیر میتونید ساعت دقیقه ثانیه رو نمایش ندید
data-enabletimepicker="true"


ورژن جدید ریایز شده :

Install-Package ABluePersianDateTimePicker -Version 1.0.4
dotnet add package ABluePersianDateTimePicker --version 1.0.4
<PackageReference Include="ABluePersianDateTimePicker" Version="1.0.4" />
paket add ABluePersianDateTimePicker --version 1.0.4

@fullStackDevs
#javascript
#VSCode

ویژوال استودیو کد , تجربه ای عالی در ویرایشگر متن درست مثل IDE ارائه می دهد ، در اینجا برخی از extentions هایی در ویژوال استودیو کد موجود هست که برای توسعه وب با استفاده از جاوا اسکریپت، HTML و CSS مفید است.
این مجموعه شامل extentions ,git tools و تم های پیشنهادی میباشد که شما بستگی به نیازهایتان می توانید برخی از آنها را انتخاب کنید و یا غیر فعال کنید

🔹️ Download and try:

https://marketplace.visualstudio.com/items?itemName=GulajavaMinistudio.javascript-complete-packs

🔸️ List of extensions , Github Sources and release notes can be seen here:

https://github.com/GulajavaMinistudio/FullJSExtensionPackCode

#Code #Extensions #Pack

@fullStackDevs
#Docker
#Container

این روزها صحبت داکر #Docker در محافل فناوری داغ است و به احتمال زیاد از گوشه‌ و‌ کنار تعریف‌های داکر به گوش شما خورده است.

حدود ۵ سال پیش فردی با نام سالامان هایکز (Solomon Hykes)، سازوکاری با نام داکر را راه‌اندازی کرد. هدف از این کار تعامل راحت‌تر با کانتینرها (Containers) بود. این ایده با موفقیت روبرو شد و در سال ۲۰۱۴ پس از انتشار داکر نسخه ۱.۰ شاهد افزایش محبوبیت آن بودیم.

در نتیجه شرکت‌ها یکی پس از دیگری اپلیکیشن‌های تحت سرور را به جای ماشین‌های مجازی در بستر داکر راه‌اندازی کردند. جالب است بدانید چندین بانک بزرگ در زمانی که داکر هنوز در نسخه ۱.۰ به سر می‌برد از این فناوری کمک گرفتند که این امر برای فناوری که در نسخه اولیه قرار دارد از امنیت بالای داکر حکایت می‌کند.

ابنا به گزارش داکر چیزی بیشتر از ۳.۵ اپلیکیشن در کانتینرها از طریق فناوری داکر قرار دارند و بیشتر از ۳.۷ میلیارد اپلیکیشن از این طریق دانلود شده است.

شرکت های بزرگی مانند ردهت، کنونیکال، اوراکل و مایکروسافت نیز به استفاده از داکر گرایش پیدا کرده اند و در حال حاضر تقریباً تمامی بزرگان حاضر در بستر رایانش ابری به نوعی از داکر استفاده می‌کنند.

🔹داکر چیست؟
داکر امکانی را فراهم آورده است که پروسه‌ها و نرم‌افزارها به صورت مجزا در محیط کاملا ایزوله‌ای بر روی کرنل لینوکس راه‌اندازی شود که به این محیط و بسته‌ی ایزوله، کانتینر (Container) می‌گویند.

کانتینر این امکان را برای برنامه نویسان و توسعه دهندگان اپلیکیشن ها فراهم می کند تا یک برنامه را با تمام ماژول ها و کامپوننت‌های وابسته آن ( مانند کتابخانه ها ، توابع و … ) یکی کرده و به صورت یک پکیج درآورده تا آن برنامه تولید شده در پلتفرم ها و سیستمهای مختلف بدون مشکل اجرا شود.

داکر وظیفه مدیریت کانتینرها را به عهده دارد و بیشتر شبیه یک ماشین مجازی عمل میکند، تفاوت داکر با ماشین مجازی در این است که در VM (یا ماشین مجازی) برای اجرای اپلیکیشن و برنامه های مختلف که بخواهیم به صورت ایزوله و مجزا از هم کار کنند باید VM های مختلف ساخته شود که همین موضوع بار پردازشی و هدر رفت منابع سیستمی را روی سرور به همراه دارد.

ولی در Docker روی یک VM خاص که میتواند دارای سیستم عامل ویندوز یا لینوکس باشد، ماژول داکر نصب شده و سپس روی سرویس داکر، کانتینرهای مختلف حاوی برنامه ها و اپلیکیشن های مختلف نصب و اجرا می‌شوند بدون اینکه کانتینرها به هم دسترسی داشته باشند. بدین صورت کانتینرها از هم ایزوله هستند و نیاز ما برای ایجاد چندین VM را مرتفع میسازند.

📌لینک منبع
@fullStackDevs
#TypeScript

🔹 تایپ اسکریپت ورژن 3.5 اعلام شد.

البته یه انتشار عظیم نیست ولی روی بحث های بهبود سرعت ، performance و incremental compilation ( در زمینه ی کامپایل استفاده میشود) کار کرده



https://tiny.cc/unac8y

@fullStackDevs
#VueJs

Vue.js 2.2 complete api cheat sheet

تمام Api های موجود در vue js بهمراه مثال آورده

📌 لینک مطلب

@fullStackDevs
#PWA

Patterns for Promoting PWA Installation on Mobile

How to promote the installation of Progressive Web Apps and best practices to follow.https://tiny.cc/ycpn8y



@fullStackDevs
#DeepLearning

چگونه تو 6 ماه DeepLearning را یاد بگیریم !

https://tiny.cc/0btn8y

@fullStackDevs
#Azure
#AppService

نه ( ۹ ) نکته پرفورمنسی برای Azure App Service
سرویس Azure App Service مهمترین سرویس Azure برای هاستینگ اپلیکیشن‌ها است که امکانات scaling زیادی دارد. هر App Service جلوی خود یک Load Balancer دارد تا بتواند ترافیک را پخش و بالانس کند.
در مقاله زیر از Telerik، اسکات آلن ۹ نکته پرفورمنسی برای کار با App Service را توضیح داده که کمک می‌کنند اصطلاحا Even Faster شوید!!!
لینک مطلب
This media is not supported in your browser
VIEW IN TELEGRAM
#VSCode
#Edge

VS Code - Elements for Microsoft Edge (Chromium)

ابزار Elements مرورگر را در داخل ویرایشگر VSCode نمایش دهید و از آن سریعتر برای رفع نکات ظاهری، طرح بندی (Layout) و CSS با سایت خود استفاده کنید.

یک افزونه VSCode که به شما اجازه می دهد از ابزار مرورگر داخل ویرایشگر استفاده کنید. این ابزار به یک نمونه از Microsoft Edge متصل می شود که به شما امکان می دهد که میتوانید در زمان اجرا ساختار HTML ، طرح را تغییر دهید و یا css را اصلاح کنید و دیگر نیاز نیست تغییرات رو روی مرورگر ببینید و به vscode برگردید برای تغییرات !
برای نصب این افزونه میتونید از لینک زیر استفاده کنید.

Elements for Microsoft Edge


@fullStackDevs
#Security
#Hsts
#قسمت_اول
What Is Hsts?

پروتکل Http یک پروتکل ناامن است و اگر هکر ی بتواند دربین کلاینت و سرور موفق به شنود خط شود به راحتی دیتای تبادل شده بدون کدگذاری شدن برای او قابل مشاهده خواهد بود .
نام این حملات
( SSL-stripping یا man-in-the-middle )
میباشد.
برای حل این مشکل از نسخه امن Http با عنوان Https استفاده میکنیم اما این پروتکل نیز ضعف های امنیتی خود را دارد .
زمانی که برای وب سایت خود ssl تهیه میکنید و https را فعال میکنید از این به بعد وب سایت شما از طریق یک درخواست Https در دسترس خواهد بود اما شما نیز بایستی تنظیمات وب سایت خود را به گونه انجام دهید که فقط به صورت https در دسترس باشد و فقط درخواست های Https را بپزیرد در غیر اینصورت کاربر میتواند درخواستی مبتی بر Http به سایت شما انجام دهد. و مراحل آن به صورت زیر است .

1. کاربر ابتدا ادرس sabteahval.ir را در نوار آدرس مرورگر خود می نویسد.

2. مرورگر به صورت پیشفرض آدرس
https://www.sabteahval.ir/
را بار گذاری میکند.

3.و وب سایت sabteahval.ir در پاسخ درخواست به صورت ریدایرکت دائمی یا موقت به آدرس
https://www.sabteahval.ir/
مرور گر را آگاه میسازد .

4. واین بارمرورگر این ریدایرکت را می‌بیند و به جای سایت قبلی وب‌سایت
https://www.sabteahval.ir/
را بارگذاری می‌کند.
همانطور که میبینید با اینکه برای وب سایت خود ssl تهیه نموده و Https را فعال نموده اید باز هم وب سایت شما پذیرای دارخواست های http بوده و میتوانید در معرض حملات
SSL-stripping
قرار بگیرید و هکر در مرحله 3 (بالا) می تواند کاربر را به آدرس دیگری که تقریبا مشابه سایت شماست ریدایرکت کند.(فیشینگ)
وقتی که Hsts را فعال میکنید . اولین باری که مرورگر کاربر به سایتان درخواست http می فرستد در پاسخ درخواست ، هدر
Strict-Transport-Security
به ResposeHeader افزوده میشود و از این به بعد این هدر بر روی مرورگر کاربر فعال باقی میماند. و از این به بعد که کاربر بخواهد درخواستی http به سایتان بفرستد با فعال بودن این هدر مرورگر به صورت پیشفرض یک درخواست Https میفرستد.

@fullStackDevs
#Security
#Hsts
#قسمت_دوم(قسمت اخر)

Enforce SSL And Use Hsts in Asp Core

در این پست که پست آخر در این مورد نیز میباشد به فعال سازی Https و نحوه افزودن هدر Strict-Transport-Security به ResposeHeader می پردازیم .
برای فعال سازی Hsts مسلم است که ابتدا باید Https را فعال نمایید که به دو صورت انجام میشود.
1.فعال کردن https فقط برای بخش هایی از سایت
2. فعال کردن Https برای کل سایت
در حالت اول میتوانید از اتریبیوت [RequireHttps] بربالای کنترل خود استفاده کنید.(این روش اصلا برای webapi توصیه نمی شود).

روش دوم استفده از گلوبال فیلتر هاست و به این صورت انجام میشود

if (!_env.IsDevelopment())
{
services.Configure<MvcOptions>(options =>
{
options.Filters.Add(new RequireHttpsAttribute());
});
}

مرحله بعدی فعال کردن Hsts میباشد. از نسخه 2.1 فریم Asp Core به بعد به صورت توکار میدلوری برای پیاده سازی Hsts به فریم وورک اضافه شد و تا قبل ان باید از
Third Party Library
نظیر
NWebsec.AspNetCore.Middleware

Joonasw.AspNetCore.SecurityHeaders
استفاده می کردید .
اما از این نسخه به بعد میدلوری به نام
app.UseHsts();
به صورت توکار وجود دارد که کار افزودن هدر Strict-Transport-Security
انجام میدهد .
if (env.IsDevelopment())
{
//
}
else
{
app.UseHsts(); // Add This
}
برای انجام تنظیمات خاص خود بر روی این هدر میتوانید در ConfigureServices کانفیگ های خود را به این صورت اعمال نمایید.

if (!_env.IsDevelopment())
{
services.AddHsts(options =>
{
options.Preload = true;
options.IncludeSubDomains = true;
options.MaxAge = TimeSpan.FromDays(60);
options.ExcludedHosts.Add("example.com");
options.ExcludedHosts.Add("www.example.com");
});

}
IncludeSubDomains
هدر را برای SubDomain های تان نیز فعال میکند.
MaxAge
مدت زمان فعال بودن هدر
Strict-Transport-Security
بر روی مرورگر کاربر به صورت پیشفرض 30 روز تنظیم شده است.
ExcludedHosts
افزودن لیست سایت های که نیاز به فعال سازی هدر Hsts را برای آنها نیست.

Preload
اما هنوز ما مشکلی با اولین در خواست به سایتمان که به صورت پیشفرض توسط مرورگر http ارسال میشود داریم . این مشکل را میتوانید به کمک سایت https://hstspreload.org/ حل کنید
کافیست دامنه سایت تان را در آن ثبت کنید و در Release های بعدی مرورگر کروم دامنه سایت تان به صورت توکار در Preload List های مروگر خواهد بود و مرورگر میداند برای سایت تان باید از Https استفده کند.
مرورگر های فایر فاکس ، سافاری ،اپرا، IE 11 ،Edge نیز از همین Preload List کروم استفاده میکنند.

@fullStackDevs

https://t.iss.one/fullStackDevs
Forwarded from Web Devs
#NewVersion

Fix bug on installing!

Install-Package ABluePersianDateTime -Version 1.0.5

dotnet add package ABluePersianDateTime --version 1.0.5

paket add ABluePersianDateTime --version 1.0.5


@fullStackDevs
Forwarded from Web Devs
#PersianDateTime
#CSharp
🔹 ساختار تاریخ شمسی با متد های تبدیل به تاریخ میلادی و یا هجری
🔸 متدهای مختلف برای بدست آوردن رشته های مختلف تاریخ شمسی با فرمت های متفاوت و اعداد فارسی
🔹 پشتیبانی از سال کبیسه
🔸 شبیه سازی کامل ساختار DateTime
.NetFramework 4.5

نصب پکیج :

Install-Package ABluePersianDateTime -Version 1.0.3
dotnet add package ABluePersianDateTime --version 1.0.3
paket add ABluePersianDateTime --version 1.0.3

@fullStackDevs
Forwarded from Web Devs
#ABluePersianDateTimePicker
توضیحات تکمیلی


نحوه استفاده از این picker به صورت زیر به صورت میلادی و شمسی می باشد . میتونید اچ تی ام ال این صفحه را مشاهده کنید و المنت های خودتونو به سادگی بسازید و به دلخواه css هارو تغییر دهید.
🔹 با اتریبوت زیر روی المنت مثلا اینپوت picker فعال میشود
data-disablebeforetoday="true"

🔹 با اتریبوت زیر روزهای قبل امروز غیر فعال میشوند
data-disablebeforetoday="true"

🔸 با اتریبوت زیر میتونید تاریخ میلادی را فعال کنید
data-isgregorian="true"

🔹 با اتریبوت زیر میتونید ساعت دقیقه ثانیه رو نمایش ندید
data-enabletimepicker="true"


ورژن جدید ریایز شده :

Install-Package ABluePersianDateTimePicker -Version 1.0.4
dotnet add package ABluePersianDateTimePicker --version 1.0.4
<PackageReference Include="ABluePersianDateTimePicker" Version="1.0.4" />
paket add ABluePersianDateTimePicker --version 1.0.4

@fullStackDevs
#TypeSafe_Lang

What is Type-safe?

Type-safe
به این معنی است که کامپایلر در زمان کامپایل نوع داده ها را اعتبارسنحی میکند.
و برای مثال اگر در کدتان تلاش کرده باشید که به یک متغیر String نوع داده صحیح(int) را اختصاص داده باشید کامپایلر یک ارور throw می کند.
این اتفاق حتی در هنگام اختصاص دادن مقدار با نوع اشتباه به آرگومان های یک تابع نیز می افتد.

Arraylist
از ساختمان داده NoTypeSafe در سی شارپ است و در هنگام استفاده از مقادیر موجود در آن ابتدا باید از نوع آنها مطمئن شوید.
در asp.net/AspnetCore نیز از Collection های NoTypeSafeمی توان به ViewData ,ViewBag اشاره کرد.

در مقابل ما loosely typed ها را داریم که دنیایه آزادانه ای را برای شما به وجود آورده اند
و هر مقداری با نوع متفاوت را می توانید به متغیر هایتان اختصاص دهید.
جاوا اسکریپت یک زبان loosely type می باشد.

@fullStackDevs
#EfCore_Best_Practice

Solve the problem 1+N in Ef Core

حل مشکل 1+N در Ef Core

این مشکل در correlated subqueries رخ میدهد.
به عنوان مثال در کوئری زیر
var query = context.Customers.Select(
c =>
c.Orders.Where(o => o.Amount > 100).Select(o => o.Amount)

);
ابتدا کوئری برای دریافت لیستی از Customers به دیتابیس ارسال میشود .
و به ازای هر Customer کوئری زیر

c.Orders.Where(o => o.Amount > 100).Select(o => o.Amount)
ترجمه و به سمت دیتابیس ارسال میشود.

این مشکل با نام مشکل 1+N شناحته میشود.

از Ef Core 2.1 به بعد Optimization ای برای این قبیل کوئری ها انجام شده است که از وقوع این مشکل جلوگیری میکند و سبب میشود که کوئری بالا حداکثر به دو اس کیو ال کوئری ترجمه شود.
کوئری اول سلکتی برای Customer ها و کوئری دوم اعمال فیلتری بر روی Order ها

برای انجام اینکار هم نیاز به انجام یک تغییر کوچک در کوئری خود دارید.

var query = context.Customers.Select(
c => c.Orders.Where(o => o.Amount > 100).Select(o => o.Amount).ToList());

کافیست به SubQuery خود متد ToList() را اضافه کنید .


اطلاعات بیشتر در مورد این مسئله را می توانید در Issue 4007 مربوط به ریپازیتوری Ef Core مشاهده و دنبال کنید.
@fullStackDevs