📌What is PWA?
✅به برنامه‌هایی که با استفاده از زبان‌های HTML، CSS و JavaScript توسعه داده شده‌اند PWA (Progressive Web App) اما این قابلیت را در اختیار ما قرار می‌دهند که برنامه‌های وب را با بهره بردن از APIهای مدرن مرورگر مانند یک برنامه‌ی Native بر روی تلفن‌های همراه نصب کنیم و فرقی ندارد کاربر از چه سیستم‌عاملی استفاده می‌کند.
✅برای بهره بردن از PWA، کافیست قابلیت اپلیکیشن های Native و تحت وب رو یکجا داشته باشیم. این فناوری از اوایل سال 2015 توسط شرکت گوگل معرفی شد.
✅مزایا
🔹کاملا Responsive هستند و بر روی تمام دستگاه ها قابل نمایش و استفاده میباشند.
🔹با کمک Service Workerها PWA میتواند در شرایط ارتباطی ضعیف حتی بدون اینترنت هم سرویس دهی کند.
🔹خدمات PWAها همواره از طریق HTTPS ارائه میشود تا با بکارگیری رمزگذاری، هیچ شخصی بدون مجوز مناسب قادر به ایجاد اختلال در برنامه نباشد.
🔹قابلیت نصب بر روی دستگاه ها مانند اپ های Native و اجرای Fullscreen آنها
🔹هماهنگی با مرورگرهای مختلف
https://www.freecodecamp.org/news/what-are-progressive-web-apps/
@alithecodeguy

📌what is CDN (Content Delivery Network)?
✅در واقع CDN یک شبکه توزیع محتوا است. سرورهایی در نقاط مختلف جهان قرار می گیرند و با توجه به اینکه کدام سرور به موقعیت بازدیدکننده سایت نزدیک تر است به درخواست ها پاسخ میدهد. در واقع اطلاعات سایت از سروری دریافت میشود که به موقعیت کاربر نزدیک تر است. بدین ترتیب سایت با سرعت بیشتر لود خواهد شد.
✅وجود CDN باعث افزایش سرعت دسترسی به اطلاعات می شود. هنگامیکه یک شبکه CDN ساخته میشود سرورهایی در نقاط مختلف جهان مستقر می شوند در با دریافت داده ها از سرور اصلی و ذخیره آن به صورت کش شده بر اساس موقعیت جغرافیایی بازدیدکننده که بر اساس ISP مخابراتی کاربر شناسایی میشود، داده ها را از نزدیک ترین CDN به کاربر تحویل خواهند داد تا کاربر با سرعت بیشتری به داده ها دسترسی داشته باشد.
✅به عنوان مثال گوگل را که از CDN استفاده می کنند باز کنید می بینید که در کوتاه ترین زمان ممکن در دسترس قرار می گیرد اما در مقابل سایتی که سرور آن در نقطه جغرافیایی دورتری قرار دارد با سرعت کمتری لود می شود.
✅برای دریافت اطلات بیشتر درباره CDN پیشنهاد میشود وبسایت زیر را مطالعه نمایید.
https://www.akamai.com/our-thinking/cdn/what-is-a-cdn
@alithecodeguy

📌مفهوم Destructuring در جاوااسکریپت
✅روشی در جاوااسکریپت است که این امکان را میدهد که مقادیر داخل آرایه‌ها، ویژگیهای داخل آبجکت‌ها را به متغیرهای مجزا اختصاص داده و اجرای آنها را در چند متغیر ذخیره نمایید. Destructuring یک روش ساده و سریع برای ایجاد متغیر است.
✅این روش در ES6 در جاوااسکریپت معرفی شد.
✅مزایای Destructuring :
🔹دسترسی به اعضای آرایه و آبجکت نسبت به روش قدیمی آسان‌تر است.
🔹ذخیره اعضای آرایه و آبجکت در متغیرها آسان‌تر انجام میگیرد.
🔹برنامه‌نویسی خواناتر و خلاصه‌تر میباشد.
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment
@alithecodeguy

📌مدیریت خطا در جاوااسکریپت (try/catch)
✅هنگام اجرای کد جاوااسکریپت ممکن است خطاهای مختلف رخ دهد که ممکن است خطاهای برنامه نویسی، خطاهای سرور یا سایر موارد غیر قابل پیش بینی باشد.
✅استفاده از مدیریت کننده خطا در جاوا اسکریپت، اگر خطایی در برنامه رخ دهد، اجرای برنامه متوقف نمیشود و مطابق با دستوراتی که برای خطاها تعیین شده است کد نوشته شده ادامه پیدا میکند.
✅دستورات مدیریت خطا به صورت زیر میباشند:
🔹try
در این بخش کدی که احتمال می دهیم خطا تولید کند را قرار داده میشود
🔹catch
مدیریت خطا در این قسمت انجام می شود
🔹throw
این دستور کنک میکند که خطا سفارشی ایجاد کنیم. در واقع با دستور throw به جاوا اسکریپت می گوییم که این قطعه کد ممکن است خطا تولید کند
🔹finally
بعد از بلوک try و catch بدون توجه به نتیجه اجرا می شود
@alithecodeguy

وبینار فرانت اند با محوریت React
اطلاعات بیشتر در تصویر.
لینک اسکایپ :
https://join.skype.com/K6vkgkVUtzED
#react #alithecodeguy #webinar #frontend

📌فونت‌ها در CSS
✅به طور کلی، فونت ها به 5 خانواده تقسیم می‌شوند که پرکاربردترین آنها 2 مورد زیر می‌باشند:
🔹serif
فونت با گوشه
🔹sans-serif
فونت بدون گوشه
✅فونت‌های serif، گوشه‌های تیز دارند اما فونت‌های sans-serif بدون گوشه تیز هستند.
✅فونت‌ها فرمت‌های متفاوتی دارند که شامل woff ،woff2 ، noscript ،EOT، OTF و TTF می‌باشند.
🔹فرمت‌های woff و woff2
این فرمت از فونت‌ها، برای استفاده در فضای وب طراحی شدند و سرعت بارگذاری بالاتری نسبت به باقی فونت‌ها دارند. همچنین این فونت‌ها توسط تمام مرورگرها ساپورت میشوند.
🔹فرمت‌های SVG و SVGZ
این فرمت‌ها، مخصوص موبایل میباشند. در حال حاضر فقط در ورژن ۴.۱ و بالاتر مرورگر سافاری مخصوص ios مورد استفاده هستند و توسط firefox و internet explorer ساپورت نمی‌شند.
🔹فرمت‌ EOT
این فونت توسط مایکروسافت طراحی شده و تنها فونتی میباشد که در اینترنت اکسپلورر ۸، در دستور font-face@ ساپورت می‌شود.
🔹فرمت‌های OTF و TTF
فونت‌هایی که به سادگی می‌توانند مورد کپی و حتی دزدی قرار بگیرند. به همین دلیل فونت های woff و woff2 برای اصلاح این دو فونت طراحی شدند.
https://www.w3schools.com/css/css_font.asp
https://www.w3schools.com/css/css3_fonts.asp
@alithecodeguy

دوستان گرامی ، وبینار ۵ دقیقه دیگه شروع میشه

یکی از ویژگی های جالب MongoDB 👏👏

محدود کردن تعداد خطهای یک متن با css

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

از این مخزن برای آموزش به دوستان استفاده میشه. امیدوارم برای شما هم مفید واقع شه

https://github.com/alithecodeguy/redux-class

#redux #react #alithecodeguy

چندتا پوزیشن شغلی برای یکی از قویترین شرکتای ایرانی فراهم شده. قطعا میشه گفت جزو ۱۰ تای اول ایران هستش. حقوق مزایا و ساعت کاریش هم خیلی خوبه.
کار حضوری و تمام وقته داخل تهرانه.
سپردن که چندتا نیروی میدل قوی یا سنیور براشون پیدا کنم.
تقریبا توی هر رده شغلی برنامه نویسی هم نیرو میخوان.
Front , Back , Mobile , DevOps
با
JavaScript , Java , …
اسمش رو فعلا نمیتونم بگم چون از طرف بنده میخواید معرفی شید میخوام ابتدا از بابت رزومه و تخصصتون مطمن شم.
این کار رو هم صرفا برای این دارم انجام میدم که چند نفر یه جای خوب مشغول به کار شن ، وگرنه هیچ مزیتی برای خود من نداره.
اگر تمایل دارید خصوصی پیام بدید:
@codewithali

هزینه دوره‌های آنلاین alithecodeguy در ۱۴۰۱
@alithecodeguy
(این پست قدیمی هستش و مبالغ تغییر کرده)

توی لینکدین یه قسمتی هست که تایید میکنید نفر مد نظرتون چه تکنولوژی رو بلد هست یا نه.
اگر از مطالبی که میگم راضی هستید یا حس میکنید توی موضوعی حرفی برای زدن دارم ، ممنون میشم توی لینکدین تاییدم کنید. (endorse)
پاورقی : تصویر بالا از پروفایل خودم نیست
آدرس پروفایلم :
https://www.linkedin.com/in/alithecodeguy/

اگر شرکت دارید یا انشالله روزی شرکت زدید ، اینو ببینید اینطوری نباشید.

از سری دورهمی‌های قدیمی جاوا اسکریپت که هیچوقت قدیمی نمیشه. همچنان جذاب و پرنکته.
دل و روده جاوا اسکریپت رو کشیدیم بیرون که async چطوری کار میکنه. ویدیوهای قبل و بعدش هم تکمیل کنندشن.
https://www.youtube.com/watch?v=pHrNnkrC_6M

آموزش context api در react
ویدیو ۱ از ۳
(ویدیو‌ها مستقل از هم دیگه هستن و از سه تا کانال یوتیوب مختلف برداشته شدن)
#react #context #contextapi