let's level up our Js
#js
#QUIZ

@fullStackDevs

#js
#QUIZ

javaScript FACTS💎

@fullStackDevs

🎯 وبلاگ دات‌نت
𝗝𝗲𝘁𝗕𝗿𝗮𝗶𝗻𝘀
مطالب خواندنی برای دات‌نت کارها داره، خصوصا کە هر ماه در قالب یک خبرنامه لیستی از پستهای مفید دات‌نتی رو با عنوان
.𝗡𝗘𝗧 𝗔𝗻𝗻𝗼𝘁𝗮𝘁𝗲𝗱 𝗠𝗼𝗻𝘁𝗵𝗹𝘆
از سایتهای مختلف جمع میکنە کە نگاه اجمالی به آنها خالی از لطف نیست.

https://blog.jetbrains.com/tag/net-annotated/



@fullStackDevs

#js
#WorkerService

Worker Service in JS

🔹 تا حالا در مورد worker serviece ها از خودتون پرسیدین و سعی کردین متوجه بشین که دقیقا چی هستن و کارشون چیه؟
▪️تو این پست سعی میکنیم تا به برخی از این سوالها در این مورد پاسخ بدیم.

❇️ یک worker service اسکریپتی هست که در بک گراند در یک thread ای جدا از browser ui اجرا میشه .
✳️ کار کردن وب سایت به صورت افلاین توسط worker service میسر میشود و به کمک آنها یکپارچه سازی پلتفرمها مانند push notification و rich caching و background sync انجام پذیر است.
▪️در تکنولوژی PWA قلب و هسته اصلی worker service ها هستند.

✳️از ویژگی های یک worker service این است که به DOM دسترسی مستقیم ندارد ولی میتواند تمام درخواست های شبکه را رهگیری کند.
این مسئله به توسعه دهنگان این فرصت را میدهد تا نحوه مدیریت درخواست ها را کنترل کنند و راهی موثر برای کار کردن وب سایت در زمان افلاین ، فراهم آورند.
بدون شک قاعده بازی وب سایتها توسط worker service ها تغییر میکند.

🔰در زیر ویژگی های اصلی worker service ها را لیست میکنیم : یک worker service ❕
🔻یک فایل جاوا اسکریپت است.
🔻در thread جدا از ui اجرا میشوند.
🔻بطور مستقیم به DOM دسترسی ندارند.
🔻برای فعال شدن یک worker service مجموعه ای از رویداد های و life cycle ها باید انجام شود.
🔻فقط زمانی که مورد استفاده قرار گیرند Live هستند در نتیجه مصرف بی رویه باتری ای وجود ندارد.
🔻فقط به Domain یا origin ای که رجیستر شده اند، محدود میشوند.
🔻برای کار کردن به Https قطعا و الزاما نیاز دارند.
🔻توانایی دریافت و یا ارسال پیام ها را به ui دارند
🔻برای اجرا نیازی نیست تا حتما page باز باشد.
🔻توسط تمامی مرورگر های ضروری و اصلی و از جمله Ios safari پشتیبانی میشوند.
🔻تقریبا مشابه web worker ها هستند اما در خیلی از موارد بهتر هستند.

✳️ یک service worker چگونه کار میکند ؟

🔸یک service worker بین مرورگر و شبکه قرار میگیرد. مانند یک پراکسی سرور عمل میکند و مجموعه ای از تسک هایی که مربوط به UI نیستند را مدیریت میکند. آنها همچنین رویداد محور (Event Driven) هستند و جدا از پراسس مرورگر کار میکنند.
اولین و مهمترین قابلیتی که یک service worker برای یک وب سایت به ارمغان می اورد قابلیت کار کردن به صورت افلان با کنترل پذیری بالا است.
این امر به کمک API های caching و رهگیری همه ی درخواست های شبکه قبل از اینکه ارسال شوند، انجام میشود.


🔹در این پست مقدمه ای از service worker ها را بررسی کردیم و در قسمتهای بعد به جزئیات بیشتر خواهیم پرداخت و در نهایت به PWA ها خواهیم رسید.🔹
@fullStackDevs

#معرفی_وبسایت
#برنامه_نویسی


🔰معرفی سه تا وب سایت فوق العاده برای برنامه نویسان

🔸در این پست سه تا وب سایت بهتون معرفی میکنیم که به کمک اونها میتونین هنگامی که برای حل مشکلی در کدتون به کمک کسی نیاز دارین (به خصوص در گروه ها ) ، ازشون استفاده کنین.

1️⃣ codeshare.io

🔹از فوق العاده بودن این وب سایت هرچی بنویسیم کم نوشتیم. در این وب سایت میتونین کد خودتون را با بقیه share کنین و به صورت realtime با بقیه در مورد کدتون صحبت کنین (از طریق ویدیو چت😎). و اگه مشکلی داره ازشون بخواین تا برطرفش کنن.

2️⃣ repl.it

🔹با استفاده از این وب سایت میتونین در هر زبانی یه پروژه ای رو سریعا setup کنین و به نوبه خودش یک IDE کامل در browser هست

3️⃣ onelang.io

🔹به کمک این وب سایت میتونین یک قطعه کد رو در یک زبان برنامه نویسی بنویسین و معادلش رو در زبان های مطرح دیگه ببینین.

@fullStackDevs

#CI
#CD


✳️ What is CI/CD ?

🔹 CI
🔸 مفهوم Continuous integration یا به اختصار CI، سبک یا روشی از کدنویسی است که تیم های توسعه را به سمت اعمال تغییرات کوچک و ثبت مکرر آنها در سورس کنترل میبرد.
هدف تکنیکال CI برقراریه روشی برای BUILD , Package , Test خودکار اپلیکیشن میباشد.
به عنوان مثال فرض کنید در یک تیم پنج نفره کار می کنید و از github به عنوان کد ریپازیتوری خود استفاده میکنید. هر یک از اعضای تیم کدهای و تغییرات خود را هروز به ریپازیتوری مربوطه در گیتهاب push میکنند و ممکن است مواردی پیش آید که یک نفر کدی را push کند که دارای باگ باشد و این مورد منجر به درست کار نکردن و از کار افتادن اپلیکشن میشود.
در اینجاست که CI برای جلوگیری از این اتفاق به کمکتان می آید.
🔹 Benefit of using CI

🔸 از مزیت های CI تنظیم ریپازیتوری به گونه ای است که هر زمانی که کسی کد جدیدی را در ریپازیتوری push میکند، CI به صورت خودکار BUILd ای برای کدهایتارن اجرا میکند و اگر اروری در کدها باشد build نخواهد شد و اعضای تیم از آن مطلع میشوند علاوه بر این میتوانید با نوشتن test case های خودکار، بعد از هر build آن هارا اجرا کنید بدین ترتیب اگر موردی درست کار نکند و fail شود بقیه از ان مطلع خواهند شد.

🔹 CD
🔸 مفهوم continuous delivery و continuous deployment و یا به اختصار CD را میتوان به فرایند خودکاری گفت که از تغییرات اعمال شده برنامه نویسان بروی کدها در ریپازیتوری، یک release برای production انجام میشود تا به وسیله مشتریان اپلیکیشن مورد استفاده قرار گیرد.
برای مثال فرض کنین که اپلیکیشن خود را بروی هاست میزبانی کرده اید و میخواهید فرایند توسعه اپلیکیشن را automate کنید. برای این منظور می توانید CD را طوری پیاده کنید ک وقتی تغییرات را روی branch مستر push کردید به صورت خودکار کدهایتارن رو روی AWS دیپلوی (Deploy) کند.

@fullStackDevs

#NewVersion
#ABluePersianDateTimePicker
#NETCore
✅ ورژن جدید 2.0.1 برای NETCore

Install-Package ABluePersianDateTimePicker -Version 2.0.1

توضیحات تکمیلی 👇

@fullStackDevs

#NewVersion
#ABluePersianDateTimePicker
#NETCore
☑️ موارد اضافه شده در این ورژن :

🔸استفاده شده از bootstrap 4

🔹ورژن مختص NETCore

🔸 اضافه شدن از تاریخ تا تاریخ به صورتی که تاریخ "تا" حتما باید بزرگتر از تاریخ "از" میباشد و تاریخ های قبل همه غیرفعال میشوند.

🔰 اصلاحیات

✅ در ورژن های قبل page سمپلی که تو ناگت قرار داشت درست کار نمیکرد ولی تو این ورژن تقریبا تمام مدل های استفاده از این پیکر را بصورت سمپل گنجانده شده و میتونید از نمونه ها استفاده کنید !

✅ ورژن های قبل تو دات نت کور وقتی پکیج را نصب میکردیم فایل های js و css اضافه نمیشد و باید به آدرس C:\Users\MyUser\.nuget\packages میرفتیم تا فایل ها را به پروژه اضافه میکردیم که با نصب این ورژن یه فولدر در wwwroot شما اضافه خواهد شد که شامل css,js و sample page میباشد.

‼️توجه داشته باشید این ورژن برای دات نت کور NET CORE میباشد و برای استفاده از ورژن های غیر Core از ورژن 1.0.5 به پایین استفاده کنید .

⚙️ اگر نقطه نظر یا انتقاد یا پیشنهادی برای بهبود این کامپوننت دارین میتونید با بنده در میان بگذارید.

✔️ ورژن جدید ریلیز شده :

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

@fullStackDevs

#react
#chat

Chat UI Kit React

چت Ui کیت از chatscope یک مجموعه ابزار UI منبع باز برای توسعه برنامه های چت وب است.

@fullStackDevs

#RoadMap

Road map backend developer 2020

@fullStackDevs

#LINQ


❇️ 5 usefull tips to write cleaner LINQ code

🔹در این پست قصد داریم چند توصیه در هنگام نوشتن کوئری های Linq به شما دهیم که باعث خوانا تر شدن کوئری ها میشود.

🔸کوئری های linq علاوه بر ساده بودن زیبایی خاصی نیز دارند و بدون شک در صورتی که به درستی نوشته شود پرفورمنس بالایی هم دارند.
برای پرهیز کردن از اشتباهات احتمالی در هنگام نوشتن کوئری های linq باید قوانینی را برای خود مشخص کنید و بدین ترتیب بروز باگ و خطاهای احتمالی کاهش میابد.

در ادامه پنج نوع از این قوانین را معرفی میکنیم.
1️⃣ Two chained methods

هنگامی که کوئری ای مینویسید که فقط دارای دو Linq متد است و کوئری تان به یک eager linq متد ختم می شود. میتوانید کل کوئری خود را در یک خط قرار دهید.

var userList = GetDataSource().Where(p => p.Email.Contains("@foo.com")).ToList();

در غیر اینصورت کوئری خود را در چند خط بنویسید.

var userList = GetDataSource()
   .Where(p => p.Email.Contains("@foo.com"))
   .Select(s => s.Email);

▫️اگه در مورد eager linq متدها اطلاعاتی محدودی دارید این مقاله را مطالعه نمایید.

2️⃣ اگر کوئری تان بیش از دو متد دارد باز هم هر متد را در خط جدیدی قرار دهید.

3️⃣ Don’t iterate IQueryable<T> by using keyword foreach.

🔹در این قانون شما را با اصلی آشنا میکنیم با عنوان
💎 “explicit is better than implicit”.

🔸در هنگام بررسی کدها و حتی خواندن کدهای دیگران اگر جایی از کد بروی یک IQuerable حلقه زده باشید(به وسیله foreach), خوانایی و درک کد کاهش میابد (البته این یک نظر شخصی است) . همچنین ممکن است کسی که کدتان را میخواند این مسئله را فراموش کرده باشد یا نداند که در foreach باعث اجرا شدن این کوئری میشود.
روش بهتر این است که ابتدا کوئری را اجرا کرده و سپس بروی آن حلقه بزنید.

var usersEmailList = GetDataSource()
.Where(p => p.Email.Contains("@foo.com"))
.Select(user => user.Email);
.ToList();

foreach (var user in usersEmailList)
{
...
}

4️⃣ Long Lambda statement is not okay.

🔸از طولانی و بزرگ شدن بدنه lambda های درون کوئری تا حد ممکن بپرهیزید در برخی موارد اگر lambda ای چند خط به عنوان بدنه داشته باشد باعث خوانایی کد میشود اما در اکثر مواقع از خوانایی کوئری می کاهد.

someQuery.Select(p => {
var newUser = new User
{
Name = p.Name,
Age = p.Age
}
});

5️⃣ Entity Framework

🔸در هنگام کار کردن با EF از این دست قبیل قوانین که غالبا شخصی هستند بسیار وجود دارد به عنوان مثال
فرض کنید نیاز به نوشتن linq کوئری داریم که براساس شروطی, داده هایی رو از دیتابیس واکشی کند و در قسمتی دیگری از کد بروی داده های واکشی شده کارهای دیگری انجام دهیم.(فرایند اجرا شدن این کارها در حافظه انجام میشود و قابل ترجمه به کوئری sql نیستند)

▫️روش اشتباه نوشتن این کوئری بدین صورت است

var usersEmailList = GetSomeDbSet()
.Where(p => p.Email.Contains("@foo.com"))
.Select(user => user.Email)
.ToList()
.Select(SomeTransoformationInMemory);


🔸 بدین منظور باید کوئری خود را به دو بخش تقسیم کرده و عملیاتی را که قابل ترجمه هستند را ابتدا در کوئری که به سمت دیتابیس ارسال میشود, اجرا کنند و بقیه عملیات را بروی داده های واکشی شده انجام دهید.

var usersEmailListFromDB = GetSomeDbSet()
.Where(p => p.Email.Contains("@foo.com"))
.Select(user => user.Email)
.ToList();

var usersEmailList = usersEmailListFromDB.Select(SomeTransoformationInMemory).ToList();

@fullStackDevs

#NET5
#CSharp9

.NET 5 = .NET Core vNext

🌀 معرفی نسخه نهایی NET 5.0

🔸 در این نسخه C# 9 وF# 5 با مجموعه گسترده ای از ویژگی های جدید و پیشرفت های جذاب به این نسخه اضافه شده اند.


🔹 این نسخه با هدف یکپارچه کردن محیط های مختلف توسعه نرم افزار در دات نت تهیه شده است تا گروه بسیاری از توسعه دهندگان را قادر به انتقال کد و برنامه های NET Framework خود به NET 5.0 باشند و همچنین کارهای اولیه در 5.0 انجام داده شده تا توسعه دهندگان Xamarin هنگام انتشار .NET 6.0 بتوانند از پلت فرم یکپارچه .NET استفاده کنند.

شما برای استفاده از .NET 5.0 در ویندوز و یا آخرین نسخه ویژوال استودیو برای Mac در macOS به Visual Studio 16.8 یا بالاتر نیاز دارید. C# extension برای Visual Studio Code از قبل .NET 5.0 و C # 9 را پشتیبانی می کند.

🔹 دات نت 5 دارای یک ماتریس پشتیبانی پلت فرم تقریباً یکسان با NET Core 3.1 ،برای ویندوز ،macOS ولینوکس است. مهمترین مورد برای NET 5.0 ویندوز Arm64 است.
💎 لینک مطلب ( معرفی دات نت 5 )

💎 لینک امکانات جدید در .NET 5


در ادامه بیشتر راجب امکانات جدید و این نسخه بحث خواهیم کرد.

@fullStackDevs

📌 پی ‎پال یکی از بزرگ‌ترین سیستم‌های پرداخت بین‌المللی و از امن‌ترین بسترهای انتقال آنلاین پول در جهان است که به علت تحریم‎هایی که برای کشور عزیزمان، جمهوری اسلامی ایران وضع شده امکان استفاده‎ی مستقیم برای کاربران ایرانی وجود ندارد.
اما نگران نباشید، کاشان‎پی این امکان رو برای کاربران و هم‌وطنان ایرانی خود فراهم کرده است!!

🔸 پرداخت فاکتور و خریدهای اینترنتی، سندمانی و شارژ انواع حساب‌ها
🔸 نقد کردن درآمد‎های پی‌ پال به ریال و سایر ارزها
🔸 افتتاح، وریفای و رفع محدودیت حساب‎های پرسونال و بیزینس
🔸 ارائه درگاه اختصاصی پی‎ پال و مشاوره تخصصی رایگان
🔸 و...

➖➖➖➖➖➖➖➖➖➖➖➖
🔉@kashanpay

#vuejs
#ReactJs

🔰در این پست می خوایم یه کار خطرناک کنیم و react و vue رو یه مقایسه ای با هم کنیم و reactDeveloper ها و vuejsDeveloper ها رو کلا بندازیم به جون هم😎.

❇️ سال میلادی جدید نزدیکه و تو این پست برای دولوپرهایی که برای سال جدید برنامه ریختن که بلاخره چه فریم وورک یا لایبری UI ای رو یاد بگیرین، میخایم یه مقایسه بین react و vue بزاریم با این عنوان که :
🔹React vs Vue.Which one is the best ini 2021?

🔸هر دوی ری اکت و ویو از لایبری های پرقدرت در زمینه frontEnd هستن که طرفدار های زیادی هم در بین دولوپر ها دارن اما ری اکت طرفدار های بیشتری داره چون عمر ری اکت چند سالی بیشتر از vue هست.

🔹تفاوت React و vue در چیه؟
به این سوال از چند وجه میشه پاسخ داد که در ادامه اونها رو لیست میکنیم.
▫️Background :
▪️ری اکت با هدف رفع نیاز های فیسبوک ساخته شده و تا به امروز غولهای فناوری باعث حفظش شدن. حمایت غولهای فناوری باعث ثبات و اطمینان از آینده ری اکت میشه.

▪️ویو توسط یک دولوپر (Evan You) ساخته شده و هدفش بهبود پرفورمنس js tools ها بوده. اقای Evan هر چی رویکرد خوب داخل انگولار و امبر و ری اکت بوده اورده داخل vue و یه سری ویژگی های خاص مخصوص vue هم بهش اضافه کرده. همه اینکار ها باعث شده که توسعه اپلیکیشن با ویو خیلی راحت و سریعتر بشه.

▫️Performance
▪️وقتی که حرف از مقایسه بین ری اکت و ویو میشه مقایسه کردن از لحاظ پرفورمنس معیار قابل توجه ای نیست از لحاظ پرفورمنس ویو از ری اکت به مقدار ناچیزی بهتره و علاوه بر فیچر های خیلی خوبی که داره حجمش هم کمتره . اما اختلاف شون اونقدر های فاحش نیست که بشه در نظر گرفتش، مخصوصا که هر دو لایبری از روش مشابه ای برای ارتباط با DOM استفاده میکنند.
▫️Community Support for React and Vue
برای هر ابزاری کامیونیتیش حیاتی ترین مسئله هست چون کامیونیتی غنی باعث میشه بقیه افراد به سمتش سوق پیدا کنن .

▪️از اونجایی که ری اکت توسط فیسبوک maintain میشه و دائما در حال اپدیت هست، یه قابلیت اطمینانی رو برای دولوپر هاش به ارمغان میاره.

▪️ویو که توسط کارمند سابق گوگل ساخته شده، فاقد پشتیبانی شدن توسط یه برند خاصه و این مسئله ویو رو انتخاب قابل اعتمادی برای شرکت های فناوری دیگه نمیکنه . علی رغم این باز هم ویو طرفدار های خیلی زیاده داره و این دلیل، مهر تایید محکمیه بر قدرت و راحتی vue.

▫️منحنی یادگیری React و Vue به چه شکله ؟

به طور کلی منحنی یاد گیری یعنی برای پیاده سازی کردن چیزی که تو ذهنتون دارین چقدر باید دردسر بکشین .

▪️توسعه اپلیکیشن با ری اکت وابسته
به third-party هاست. و این گاهی اوقات باعث میشه تا دولوپر ها مجبور باشن ابتدا اطلاعات زیادی بدست بیارن تا فقط بتونن کارهاشونو پیش ببرن.
اما documentation ری اکت خیلی خوب و غنیه و هزاران مقاله و وبلاگ هم میتونین سرتاسر اینترنت پیدا کنین. تا اونچکه که تو ذهنتون دارین رو به کمک ری اکت پیاده سازی کنین.

▪️یادگرفتن ویو خیلی راحته و خیلی سریع بهش عادت میکنین چون همانطور که قبلا تر گفته شد این لایبری هر چی فیچر خوب تو سایر لایبری ها بوده رو اورده تو خودش.همچنین vue داکیومنت خوبی هم داره و بخش FAQ اون سعی داره تا به تمامی سوالات پاسخ بده و سوالها رو بدون پاسخ نذاره. (با این قسمت هنوز کار داریم در ادامه)
از میان ری اکت و ویو بین دولوپر ها ویو developer-friendly تر هست.
▫️Popularity
▪️ری اکت چون توسط فیسبوک پشتیبنی میشه در میان لایبری های جاوااسکریپتی محبوبیت بالایی داره و نقش leader رو بازی میکنه.

امار دانلودهای ویو هم نسبت به عمر کمترش نسبت به ری اکت فوق العاست.

▫️Documentation
▪️از لحاظ دایکیومنت، داکیومنت ری اکت به مرور در حال بهبوده و تیم ری اکت دائما در تلاش اند تا داکیومنت ری اکت رو بهتر و بهتر کنند در مقایسه با ویو، داکیومنت ویو خیلی structure شده هست.
با تمام حرف های گفته شده بیان به سوال اولمون پاسخ بدیم که :
🔸What is the best choice for 2021?
▪️از نظر توسعه، ری اکت گزینه بهتری برای یادگیری در سال پیش روست و بعد اون ویو در جایگاه دوم قرار داره.

🔹آیا ویو بلاخره موفق میشه تا از پس ری اکت عبور کنه؟
▪️تا اونجایی که میشه پیش بینی کرد بدون شک ویو یکی از رقبایی برای ری اکت خواهد بود که حرفهایی زیادی برای گفتن داره و برای رسیدن vue به پلتفرمی که الان ری اکت هست و کسب این جایگاه زمان زیادی لازمه .
در ادامه گوگل ترند react و vue رو میذاریم .

🔹چرا ری اکت از ویو بهتره ؟
جواب متخصص ها به این سوال این گونه بوده :
▪️ری اکت، مسائل و مشکلات رو به صورت fundamental حل میکنه . البته چرایی وجود این چنین مشکلات اهمیت داره اما از نظر عملکرد و بهینه سازی و سهولت در توسعه، ری اکت در مراتب بالاتری قرار داره.

ادامه در پست بعدی
@fullStackDevs

#Vuejs
#ReactJs
ادامه پست قبلی

🔹Which one Is better for beginners?

▪️تمرکز ویو بروی beginner ها بوده و حتی برای کسایی که میخان ری اکت رو یاد بگیرن توصیه میشه اول ویو رو یاد بگیرن چون بعدا راحتر اکو سیستم ری اکت رو درک میکنند. در ابتدا، نقطه ورود توسعه با ویو راحتره و نیازمند داشتن اطلاعات کمتریه .
▪️ری اکت برای توسعه اپلیکیشن های پیچیده و بزرگ مثل e-commerce ایده آل تره اگر چه ویو هم برای ساختن اپلیکیشن های سبکتر مناسبه.
البته این هنر دولوپره بسته به دانشش چطور از ابزارها استفاده کنه.

❇️ خب این پست رو همین جا تموم می کنیم. اگر نظر داشتین یا فک میکنین که جایی اجحاف شده تو کامنت ها ذکر کنین.

❌ انتشار این پست بدون ذکر منبع کار غیر اخلاقی ایه🙏.
@fullStackDevs

React and Vue Google trends