Angular انگولار – Telegram
Angular انگولار
312 subscribers
19 photos
1 video
1 file
80 links
در این کانال مطالب آموزشی، اخبار، فروش کتاب و اطلاع رسانی زمان ورک شاپ ها قرار خواهد گرفت.

ادمین کانال
@angular_j
Download Telegram
دوستانی که انگولار 6 تسلط دارند جهت انجام پروژه به ایدی زیر پیام بدند

نمونه کار اگر داشتند هم خوبه

@Developer_89
This media is not supported in your browser
VIEW IN TELEGRAM
چاپ دوم کتاب آموزش جامع انگولار، که نسخه به روز شده به آخرین ورژن فریم ورک انگولار می باشد،
با عنوان "آموزش جامع انگولار (نسخه۷)" به چاپ رسیده است،
و به زودی از فروشگاه های معتبر قابل تهیه می باشد
به اطلاع می رسانیم
به دلیل افزایش قیمت تیپاکس، و اینکه ارسال کتاب صرفه اقتصادی ندارد، امکان ارسال کتاب توسط ما مقدور نیست.

سعی می کنیم به زودی آدرس کتابفروشی هایی که کتاب "آموزش جامع انگولار (نسخه ۷)" را موجود دارند، در کانال قرار دهیم.
چاپ دوم کتاب آموزش جامع انگولار، که نسخه به روز شده به آخرین ورژن فریم ورک انگولار می باشد،
با عنوان "آموزش جامع انگولار (نسخه۷)" به چاپ رسیده است،
و به زودی از فروشگاه های معتبر قابل تهیه می باشد

با توجه به افزایش نرخ چاپ، قیمت چاپ جدید کتاب طبق نظر انتشارات، ۳۲۰۰۰ تومان می باشد
جهت خرید چاپ جدید کتاب میتوانید به ادمین کانال انتشارات ناقوس به آدرس

@naghoospress
پیام دهید
همچنین کتابفروشی یکتا به آدرس ذیل کتاب را به صورت اینترنتی عرضه می کند

حتما قبل از خرید در مورد چاپ اول یا دوم بودن کتاب سوال کنید

https://yektabook.com/product/28363/آموزش-جامع-انگولار
لینک خرید کتاب آموزش جامع انگولار از برخی سایت ها در ذیل عنوان می شود،
فقط لطفا قبل از تهیه کتاب از چاپ اول یا دوم بودن آن اطمینان حاصل کنید تا چاپ مورد نظرتان را خریداری کنید.

https://sourcesara.com/angular-tutorial-book/

https://rayabook.net/bookid/31901

https://arvin-bookstore.com/خرید-کتاب-های-کامپیوتر-فناوری-اطلاعات/21032-آموزش-جامع-انگولار.html

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

https://kutt.it/ng-group
استخدام «گرافیست و برنامه نویس فرانت اند» مرد مسلط به:
HTML
CSS
Javanoscript
Angular 2+

ارسال رزومه به @mostafalavaei

#موقعیت_شغلی
📣 با عرض پوزش بابت کم شدن فعالیت کانال طی چند وقت اخیر، ان شاء الله از امروز فعالیت کانال دوباره از سر گرفته می شه.
از اونجا که مطالب برای سطح مبتدی به راحتی پیدا می شه، سعی بر اینه که مطالبی که پست می شه اغلب برای سطح متوسط به بالا باشه.
Angular انگولار pinned «📣 با عرض پوزش بابت کم شدن فعالیت کانال طی چند وقت اخیر، ان شاء الله از امروز فعالیت کانال دوباره از سر گرفته می شه. از اونجا که مطالب برای سطح مبتدی به راحتی پیدا می شه، سعی بر اینه که مطالبی که پست می شه اغلب برای سطح متوسط به بالا باشه.»
شاید هرکسی که یکم انگولار کار کرده باشه بلد باشه دایرکتیو بنویسه، اما خیلی ها نمی دونن ما ۳ نوع دایرکتیو داریم:

1. Component:
کامپوننت ها دایرکتیوهایی هستن که Template دارن

2. Attribute Directive:
دایرکتیوهایی که تغییراتی روی یه المان می دن (دایرکتیو هایی که نوشتید احتمالا از این نوع بودن)

3. Structural Directive:
دایرکتیوهایی که باعث حذف/اضافه شدن المان از/به DOM می شن. (مثال *ngIf و *ngFor).
اگه می خواید بدونید چطوری می تونید یه Structural Directive بنویسید لینک های زیر رو ببینید:

https://medium.com/@adrianfaciu/creating-structural-directives-in-angular-ff17211c7b28

https://angular.io/guide/structural-directives

#Angular #Directive
وقتی یه وب اپلیکیشن می نویسید، خیلی مهمه که وب اپلیکیشنتون چقدر طول می کشه تا لود بشه. حتما تا حالا توصیه های زیادی شنیدید که همشون به جای خودشون مفیدن. ولی توی این پست روش آسون، پر تاثیر و کمتر توجه شده ای رو می خوام بگم.
بیشتر وب سرورها (Apache ، Nginx و ...) به طور پیش فرض از نسخه قدیمی HTTP استفاده می کنن(نسخه ۱.۱)، اما اخیرا HTTP 2 معرفی شده که پرفورمنس بالاتری نسبت به نسخه قدیمی تر خودش داره. آزمایش ها نشون می ده که HTTP 2 نسبت به HTTP 1.1 بدون هیچ تنظیمات خاصی حدود ۱۴% سریعتره:

https://link.medium.com/ZgfTN6bof0

علاوه بر این، HTTP 2 امکانی به اسم Server Push داره که با استفاده از اون، وقتی مثلا فایل index.html از سرور خواسته می شه، فایل های استایل، جاوااسکریپت و ... ای که index.html نیاز داره رو بدون این که براوزر درخواستی بفرسته، برای کلاینت می فرسته. این امکان اگه درست استفاده بشه به شدت می تونه روی سرعت لود صفحه تاثیر بذاره.
در آخر از اونجا که HTTP 2 فقط با رمزنگاری قوی توسط براوزر ها ساپورت می شه، پیشنهاد می شه که از TLS 1.3 استفاده کنید که سرعت و امنیت بیشتری نسبت به TLS 1.2 داره

#HTTP2 #Performance
شما نمی تونید از یه ابزار به خوبی استفاده کنید وقتی نمی دونید اون ابزار چطوری کار می کنه. خیلی از ما ها با انگولار کار می کنیم ولی از ساختار داخلی انگولار خبر نداریم، این باعث می شه که توی خیلی مسائل گیر بکنیم یا با یه روش غیر حرفه ای و غیر بهینه مساله رو حل کنیم. این پست در مورد قلب انگولار یعنی مکانیزم Change Detectionه.
تا حالا فکر کردید انگولار از کجا می فهمه وقتی یه متغیر مقدارش تغییر می کنه باید یه قسمت از صفحه رو تغییر بده؟ این هوشمندی از کجا میاد؟ آیا دائما DOM داره آپدیت می شه؟ اصلا خطای مشهور Expresion Change واسه چیه و چطوری حل می شه؟ وب اپلیکیشنتون بزرگ شده و به مشکل پرفورمنس بر خوردید؟
لینک زیر و لینک های داخل متن رو مطالعه کنید تا جواب سوالای بالا و کلی اطلاعات مفید دیگه کسب کنید:

#Angular #ChangeDetection

https://link.medium.com/3aUmKZ51g0
توی سایت زیر می تونید کدهای جاوااسکریپت رو از نظر پرفورمنس با هم مقایسه کنید و در صورتی که بخواید نتیجش رو با دیگران به اشتراک بذارید:

https://jsperf.com

این سایت داره از یه پکیج به اسم benchmark.js استفاده می کنه. اگه ترجیح می دید می تونید مستقیما از این پکیج تو پروژتون استفاده کنید.

#Javanoscript #Performance
احتمالا شما هم مثل بیشتر انگولار کار ها از دکوریتور @Input برای تعریف ورودی کامپوننت استفاده می کنید، اما همونطور که توی پست مربوط به مکانیزم Change Detection گفته شد، با این کار توی هر چرخه کاری انگولار، مقدار فعلی ورودی با مقدار قبلی ورودی مقایسه می شه. وقتی حجم پروژه زیاد بشه، تعداد این مقایسه ها زیاد می شه و پرفورمنس افت می کنه.
خیلی وقت ها ورودی یه کامپوننت فقط در زمان لود شدن کامپوننت قراره پر بشه و در طول حیات کامپوننت قرار نیست تغییر کنه، در اینجور مواقع به جای دکوریتور @Input می تونید از دکوریتور @Attribute استفاده کنید که دچار افت پرفورمنس نشید.
توی مقاله زیر می تونید در این باره بیشتر مطالعه کنید:

#Angular #Performance #ChangeDetection

https://link.medium.com/5NCYMMK4j0
امروز می خوام یه پکیج کوچیک ولی خیلی کاربردی معرفی کنم، ولی قبلش نیازه یه مقدمه بگم.
اگه با انگولار کار کرده باشید می دونید که انگولار به شدت به rxjs وابستست، از الگوریتمهای داخلی تا output ها تا ریکوئست های AJAX و ... . پس کار با rxjs جزء جدا نشدنی یه اپلیکیشن انگولاریه. اگه استفادتون از rxjs محدود به output و ریکوئست های AJAX می شه، بدونید که تا حالا از دنیای rxjs غافل بودید و نیاز دارید که قبل از خوندن ادامه این مطلب، در مورد rxjs مطالعه کنید.
همونطور که احتمالا می دونید، بسیاری از Observable ها بر خلاف ریکوئست های AJAX بعد از اولین event به طور خودکار unsubscribe نمی شن و تا وقتی که شما اونها رو unsubscribe نکنید به event های جدید واکنش نشون می دن. نمونه معروف این قضیه output های یه کامپوننته که تا وقتی که کامپوننت در قید حیاته، در صورت emit شدن یه مقدار، کامپوننت والد با خبر می شه. در واقع انگولار هنگام از بین رفتن کامپوننت فرزند، تابع unsubscribe رو صدا می زنه. اما انگولار این کار رو فقط در مورد output ها انجام می ده و در صورتی که شما یک subject داشته باشید و اونو subscribe کنید، حتی بعد از مرگ کامپوننت همچنان نسبت به event های اون subject واکنش نشون داده می شه. این قضیه هم باعث افت پرفورمنس و هم اختلال توی اپلیکیشن می شه. یه نمونه ساده رو می تونید توی این لینک ببینید:
https://link.medium.com/ZJcz4B83l0

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

https://www.npmjs.com/package/ngx-take-until-destroy


#Performance #rxjs