آموزش React useEffect Hook

در این ویدیو از سری آموزش ریاکت به بررسی و آموزش React useEffect Hook پرداختیم. useEffect مکانیزم مدیریت منابع خارجی و Side Effect هاست. روش‌های مختلفی از استفاده از هوک useEffect قابل پیاده سازی است. اجرا به ازای هر رندر، اجرا بعد از اولین ماونت و اجرا وابسته به مقادیر و نهایتا cleanup کردن منابع. در انتهای ویدیو هم بامثالی شیوه گرفتن ابعاد صفحه از طریق useEffect را بررسی کردیم.

https://youtu.be/e4_9IHQFwSk

〰️〰️〰️〰️〰️〰️
© | @microfrontend_ir

آموزش ری اکت - بررسی وضعیت اتصال شبکه به کمک React useEffect Hook

در این ویدیو آموزش ری اکت - بررسی وضعیت اتصال شبکه به کمک React useEffect Hook پرداختیم. برای این کار از از API مرورگر برای بررسی وضعیت استفاده کردیم و به کمک هوک useEffect اتصال و قطع شدن را مانیتور کردیم و نهایتا آن را تبدیل یک custom hook کردیم که بتوانیم در جاهای مختلف از آن استفاده کنیم.


https://youtu.be/jGILiWKghlU


〰️〰️〰️〰️〰️〰️
© | @microfrontend_ir

آموزش ری‌اکت - اتصال به وب سرویس با React useEffect Hook



در این ویدیو از پلی لیست آموزش React شیوه اتصال به وب سرویس از طریق React و useEffect hook را بررسی کردیم . ابتدا شیوه تعریف دیتا مدل را بررسی سپس برای استایل دهی کامپوننت ها TailwindCSS را به پروژه اضافه کردیم و یک اسپینر ساده ایجاد کردیم و برای اضافه کردن انیمیشن از react-spring استفاده کردیم. در نهایت یک Custom Hook ایجاد کردیم که برای ارسال درخواست های وب از آن استفاده کنیم

https://youtu.be/i1ciUZcr97o

〰️〰️〰️〰️〰️〰️
© | @microfrontend_ir

آموزش React - بهینه سازی درخواست‌های وب با Debounce

بهینه سازی درخواست‌های وب با Debounce
در ادامه آموزش React و ادامه ویدیو قبلی پلی لیست در این ویدیو امکان جستجو در محتوا را با ارسال پارامتر به سرویس را پیاده سازی کردیم. اما مشکلی که در فرایند جستجو حجم عظیمی از  درخواست سرویس هاست که بایستی تا حد امکان بهینه باشد. برای این منظور رویکرد بهینه سازی درخواست‌های وب با Debounce
از پکیج lodash را معرفی کردیم

https://youtu.be/ICP0Qi3xNqQ

〰️〰️〰️〰️〰️〰️
© | @microfrontend_ir

مصاحبه فنی جاوا اسکریپت: Debounce چیست؟

در اغلب مصاحبه‌های فنی جاوا اسکریپت سوالی مطرح می شود که Debounce چیست؟ در این ویدیو ابتدا مفهوم Debounce را برای به تاخیر انداختن اجرای اکشن ها معرفی و سپس Leading Debounce برای اجرای اولین اکشن در یک بازه و Trailing Debounce برای اجرای همواره آخرین اکشن مطرح و با یک مثال آن را پیاده سازی کردیم


https://youtu.be/zu0Yzjg3Bs4

〰️〰️〰️〰️〰️〰️
© | @microfrontend_ir

آموزش پیشرفته CSS - اولویت اعمال سلکتورها با Specificity



در این ویدیو از آموزش پیشرفته CSS اولویت اعمال سلکتورها با Specificity را بررسی و شرح دادیم. مرورگر برای اعمال استایل‌ها به ازای هر سلکتور مقدار Specificity را محاسبه و به بیشترین مقدار بالاترین اولویت می‌دهد. در این ویدیو شیوه محاسبه Specificity را شرح دادیم.

https://youtu.be/MBVLDoGj_WE


〰️〰️〰️〰️〰️〰️
© | @microfrontend_ir

آموزش React - تفاوت useEffect و useLayoutEffect

در این ویدیو از آموزش React تفاوت useEffect و useLayoutEffect را بررسی کردیم و توضیح دادیم که چگونه useEffect پس از ماونت شدن کامپوننت اجرا می شود و چگونه قبل از پرینت با استفاده از useLayoutEffect تغییرات مورد نظر خود را اجرا کنیم.


https://youtu.be/SvTxbYlb2zw

آموزش PostgreSQL

در اولین ویدیو و مقدمه پلی لیست آموزش PostgreSQL به بررسی تاریخچه و روند شکل گیری پستگرس پرداختیم. از پروژه مادر یعنی Ingres و سپس اضافه شدن امکانات object-relational از طریق پروژه Post-Ingres صحبت کردیم و چند اکستنشن مهم پستگرس یعنی PostGIS و Timescale صحبت کردیم.

Video: https://youtu.be/2f9RAkpQGj4


playlist: https://www.youtube.com/playlist?list=PLJ9zDGwhhsByAI0AbbJ4oUTziNsaffKnq
〰️〰️〰️〰️〰️〰️
© | @microfrontend_ir

آموزش PostgreSQL - نسخه ها و اصطلاحات مهم پستگرس

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

Video: https://youtu.be/SkVtPmMk6YY


playlist: https://www.youtube.com/playlist?list=PLJ9zDGwhhsByAI0AbbJ4oUTziNsaffKnq
〰️〰️〰️〰️〰️〰️
© | @microfrontend_ir

راه اندازی ماشین مجازی محبط توسعه با Vagrant

داشتن یک محیط توسعه برنامه نویسی که ایزوله و قابل اشتراک گذاری باشد یکی از ضرورت‌های هر محیط برنامه نویسی است بویژه اگر نرم افزار در حال توسعه دارای وابستگی و نیازمندی‌های پیچیده باشد. در این ویدیو شیوه راه اندازی ماشین مجازی با Vagrant که یک ابزار خودکار سازی رویدادهای مجازی سازی است را بررسی و سپس شیوه ساخت یک پروژه جنگو بر این بستر را شرح دادیم

ٰVideo: https://youtu.be/a1FDaLS4Exs

دلیل اصلی انتشار ویدیو این است که پستگرس رو بر این بستر بررسی خواهیم کرد

〰️〰️〰️〰️〰️〰️
© | @microfrontend_ir

آمورش پستگرس - نصب PostgreSQL


در این ویدیو از پلی لیست آموزش پستگری به بررسی شیوه‌های مختلف نصب PostgreSQL پرداختیم. به شکل کلی برای استفاده از دیتابیس PostgreSQL میتوان روش‌های مختلف زیر را دنبال کرد. در حال اول میتوان سورس کرد پستگرس را به صورت لوکال کامپایل کرد که قاعدتا میتوان پارامترهای زمان کامپایل رو بهینه کرد. همچنین میتوان از طریق pgenv نسخه‌های مختلفی از پستگرس کامپایل و مدیریت کرد تا در صورت نیاز بین نسخه های مختلف آن سوییچ کرد. اما از طریق ابزارهای مدیریت پکیج به راحتی باینری پستگرس را دانلود و نصب کرد و در نهایت از ابزارهای مبتنی بر کانتینر مانند docker postgresql به شیوه راحت تری از پستگرس استفاده کرد.

Video: https://youtu.be/vpuGAcCrRc4


playlist: https://www.youtube.com/playlist?list=PLJ9zDGwhhsByAI0AbbJ4oUTziNsaffKnq
〰️〰️〰️〰️〰️〰️
© | @microfrontend_ir

useRef React Hook - آموزش React


در این ویدیو از آموزش React به بررسی useRef React Hook پرداختیم. تغییر در مقادیر state همواره باعث فراخوانی مجدد تابع کامپوننت می شود و تابع از اول اجرا می شود و اگر مقادیری در آن وجود داشته مجدد مقداردهی می شوند و مقادیر قبلی را از دست می دهند. از طریق useRef میتوان مقادیر را در فرایند رندر مجدد حفظ کرد و استیت هایی داشت که با تغییر آن کامپوننت دوباره ساخته نشود. در کنار این میتوان از useRef برای اتصال مستقیم به DOM نیز استفاده کرد.

Video: https://youtu.be/Buv3QdfohEc

playlist: https://www.youtube.com/playlist?list=PLJ9zDGwhhsByPAaNxIYX26M3ZpWkSzVz-

〰️〰️〰️〰️〰️〰️
© | @microfrontend_ir

آمورش پستگرس - اجرای PostgreSQL


در این ویدیو از آموزش پستگرس به بررسی مفهوم اجرای PostgreSQL پرداختیم. به شکل فرایند مدیریت راه اندازی و اجرای پستگرس از طریق دستور pg_ctl اتفاق می افتد که پارامترهای مختلفی برای این کار در اختیار ما قرار می دهد. به عنوان مثال از طریق مودهای مختلف smart, fast, immediate میتوان شیوه stop postgresql را مدیریت کرد. همچنین پس از اجرا پستگرس پروسس های مختلفی را ایجاد میکند که در این ویدیو به بررسی این پروسس ها پرداختیم.

Video: https://youtu.be/pBIu12mekjU


playlist: https://www.youtube.com/playlist?list=PLJ9zDGwhhsByAI0AbbJ4oUTziNsaffKnq
〰️〰️〰️〰️〰️〰️
© | @microfrontend_ir

آموزش پستگرس کیوال - اتصال به PostgreSQL

آموزش پستگرس کیوال شیوه اتصال به PostgreSQL را بررسی کردیم. با مقداردهی اولیه PG_DATA دو دیتابیس template ساخته می شود که پستگرس از آن به عنوان الگوی اصلی ساخت دیتابیس استفاده می‌کند. برای اتصال به شیوه لوکال از ابزار psql استفاده می شود اما اگر بخواهیم به صورت ریموت و از سایر ماشین نیاز به ملاحظات و پیکربندی‌هایی هست که در مورد آن صحبت شد و دو ابزار مهم pgAdmin و Datagrip نیز به عنوان کلاینت های قدرتمند PostgreSQL معرفی شدند.

Video: https://youtu.be/DpQGRv6DvL8

playlist: https://www.youtube.com/playlist?list=PLJ9zDGwhhsByAI0AbbJ4oUTziNsaffKnq
〰️〰️〰️〰️〰️〰️
© | @microfrontend_ir

آمورش پستگرس - ساختار PG_DATA

در این ویدیو از آموزش پستگرس به بررسی ساختار PG_DATA یا مسیری که پستگرس داده ها را در آن ذخیره می کند پرداختیم. پستگرس معمولا برای ابجکت های کاربر یک شناسه به عنوان object identifier ایجاد و متناظر آن یک filenode ایجاد میکند. همچنین یکی از ویژگی های بسیار مهم پستگرس پشتیبانی از مفهوم Tablespace است که به کاربر این امکان را می‌دهد که داده ها را در مسیرهای مختلف و بویژه در دیسک های متفاوتی ذخیره کند تا مثلا داده های با اهمیت در دیسک های احتمالا سریعتر و گرانتر ذخیره و داده های کم اهمیت در دیسک های ارزان تر ذخیره شوند و به طبع آن دسترسی به داده ها بهینه شوند

Video: https://youtu.be/7fMuLCsT4q8

playlist: https://www.youtube.com/playlist?list=PLJ9zDGwhhsByAI0AbbJ4oUTziNsaffKnq
〰️〰️〰️〰️〰️〰️
© | @microfrontend_ir

بهینه سازی مدل‌های Django با PostgreSQL Tablespace

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


Video Link: https://youtu.be/1gBizdUgzBw

Django Tips Playlist:
https://www.youtube.com/playlist?list=PLJ9zDGwhhsBwdrfdaoOqbYev3_ocuBOfv

〰️〰️〰️〰️〰️〰️
© | @microfrontend_ir

کاربرد forwardRef و useImperativeHandle در React

در این ویدیو به بررسی کاربرد forwardRef و useImperativeHandle در React پرداختیم. اگر بخواهیم ref را به کامپوننت های فرزند ارسال کنیم اگر آن به مانند سایر props ها ارسال کنیم مشکلاتی دارد که در مورد آن توضیح دادیم. تابع forwardRef این امکان را به برنامه نویس می دهد تا به شیوه درست تری این کار را انجام دهد همچنین میتوان از طریق useImperativeHandle Hook چیزی که برای کامپوننت تحت ref قابل دسیتیابی است را سفارشی و کاستوم کرد تا کامپوننت تمیزتری داشته باشیم

Video: https://youtu.be/7OojXkSDoe8

playlist: https://www.youtube.com/playlist?list=PLJ9zDGwhhsByPAaNxIYX26M3ZpWkSzVz-

〰️〰️〰️〰️〰️〰️
© | @microfrontend_ir

در این ویدیو از آموزش React به بررسی بهینه سازی کامپوننت های React با useMemo Hook پرداختیم. ابتدا یک مساله محاسباتی سنگین را مطرح کردیم و پس از پیاده سازی نشان دادیم که useMemo چگونه می‌تواند فرایند رندر شدن کامپوننت را بهینه نماید

Video: https://youtu.be/gMQlSE4o7uE

playlist: https://www.youtube.com/playlist?list=PLJ9zDGwhhsByPAaNxIYX26M3ZpWkSzVz-

〰️〰️〰️〰️〰️〰️
© | @microfrontend_ir

بهینه سازی React با useCallback Hook

در این ویدیو بهینه سازی React با useCallback Hook و memo را بررسی کردیم. پس از تغییر مقادیر state کامپوننت مجددا رندر می شود. این رندر مجدد حتی زمانی که مقادیر ورودی تغییری نکرده است اتفاق می افتد که اضافی به نظر می آید. React از طریق تابع memo به برنامه نویس این امکان را می دهد که کامپوننت و مقادیر ورودی را کش کرده و در صورتی که مقادیر یکسان است از تکرار رندر جلوگیری کند. تابع Object.is مکانیزم اصلی ری‌اکت برای مقایسه است. اگر از تابع به عنوان props استفاده کنیم و این تابع در بدنه کامپوننت تعریف شده باشد بدلیل اینکه هر بار از نو اعلان می‌شود memo هم نمیتواند مشکل مارا حل کند. برای اینکه اعلان تابع را نیز کش کنیم که هر بار از نو اعلان نشود میتوانیم از useCallback Hook استفاده کنیم.

Video: https://youtu.be/msuJAbqDXy8

playlist: https://www.youtube.com/playlist?list=PLJ9zDGwhhsByPAaNxIYX26M3ZpWkSzVz-

〰️〰️〰️〰️〰️〰️
© | @microfrontend_ir

تولید داده تست برای هر پروژه نرم افزاری یکی از ضرورت های اساسی است. در این ویدیو شیوه تولید داده‌های Fake و تصادفی در پایتون را به کمک پکیج Faker بررسی کردیم. این داده های می‌توانند در فرایند بررسی ساختار اپلیکیشن و یا استرس تست و حتی برای آموزش مدل‌های یادگیری ماشین استفاده شوند

Link: https://youtu.be/13S9cQ4_71o

Python Tips Playlist: https://www.youtube.com/playlist?list=PLJ9zDGwhhsBwZcy2wRRBNqXZP8wf--TmF

〰️〰️〰️〰️〰️〰️
© | @microfrontend_ir