آموزش React - اجرای اولین برنامه بدون JSX

در دومین ویدیو پلی لیست آموزش React - اجرای اولین برنامه بدون JSX را بررسی می‌کنیم. برای این منظور ابتدا یک تکه کد را با استفاده از HTML میسازیم و سپس معادل آن را در React و با استفاده از element ها پیاده میکنیم

Link: https://youtu.be/kUdKfetGLrg

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

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

JSX چیست ؟

در سومین ویدیو پلی لیست آموزش React بررسی کردیم که JSX چیست‌؟ برای این منظور ابتدا به بررسی مفهوم و ساختار JSX پرداختیم و بعد مثال جلسه قبلی را با استفاده از JSX باز نویسی کردیم.
همچنین برخی از اصول و قواعد JSX را مطرح و دلیل استفاده از Fragment را شرح دادیم.


Link: https://youtu.be/jMrxVapepsE

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

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

جلسه چهارم: تاریخچه ابزارهای Frontend
https://youtu.be/1RUq8gAut0g

جلسه پنجم: ساخت پروژه ریاکت با Webpack
https://youtu.be/pO1JxsRyGD8

جلسه ششم: ساخت پروژه با Parcel و Vite و CRA
https://youtu.be/_7zlouzkVxg

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

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

آموزش TailwindCSS و Vite

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

Link: https://youtu.be/aE9lckQip2Y

PlayList: https://youtube.com/playlist?list=PLJ9zDGwhhsBzNRzQmVENfCPU1umUYm1pk

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

انواع کامپوننت ها در React

در این ویدیو از پلی لیست آموزش React کامپوننت را تعریف و میگوییم React Component چیست؟ سپس انواع کامپوننت ها را در ریاکت تعریف و بررسی کردیم و در نهایت یک کامپوننت ساده ریاکت ایجاد کردیم.

Link: https://youtu.be/1Q6bvttNRMU

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

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

Flutter State چیست؟

در اولین ویدیو از سری آموزش State Management در Flutter به این سوال پاسخ می‌دهیم که Flutter State چیست؟ و فلاتر چگونه تفکر Reactive و برنامه نویسی Declarative را ترکیب و یک پلتفرم جذاب برای طراحی واسط کاربری ارایه داده است. در ادامه ابزارهای دیگری که برای مدیریت State در فلاتر وجود دارد را مطرح کردیم.


Link: https://youtu.be/0lM6YPK6GwQ

PlayList: https://youtube.com/playlist?list=PLJ9zDGwhhsBwoDOzFdlHBa6H7w8ExoeKV
〰️〰️〰️〰️〰️
© @microfrontend_ir

Flutter Stateful Widget vs Stateless Widget

در دومین ویدیو از سری آموزش State Management در Flutter به این سوال پاسخ می‌دهیم که ویجت‌ها در فلاتر چند نوع هستند و چه تفاوتی با هم دارند؟ برای این کار ابتدا Widget Tree در فلاتر را شرح.و بعد انواع ویجت های Stateful و Stateless را ایجاد کردیم و lifecycle ویجت را بررسی کردیم.

Link: https://youtu.be/-R4FPPJiUXk

PlayList: https://youtube.com/playlist?list=PLJ9zDGwhhsBwoDOzFdlHBa6H7w8ExoeKV
〰️〰️〰️〰️〰️
© @microfrontend_ir

۴ نکته مهم در مورد استفاده از setState در Flutter

در سومین ویدیو از سری آموزش مبانی State Management در Flutter به سراغ متد setState رفتیم. ابتدا مکانیزم رندرینگ در فلاتر را بررسی و سپس سورس کد متد setState را مطالعه و نکات مهم و کمتر گفته ای شده ای در مورد این متد را بررسی کردیم


Link: https://youtu.be/SZ8DUwVAxdM

PlayList: https://youtube.com/playlist?list=PLJ9zDGwhhsBwoDOzFdlHBa6H7w8ExoeKV
〰️〰️〰️〰️〰️
© @microfrontend_ir

استفاده از Callback در Flutter

در چهارمین ویدیو از سری آموزش مبانی State Management در Flutter رویکرد استفاده از Callback در Flutter برای انتقال دیتا از child به parent را بررسی کردیم.

Link: https://youtu.be/rrrCzcpYb_8

PlayList: https://youtube.com/playlist?list=PLJ9zDGwhhsBwoDOzFdlHBa6H7w8ExoeKV
〰️〰️〰️〰️〰️
© @microfrontend_ir

Flutter Key چیست و چه کاربردی دارد؟

در پنجمین ویدیو از سری آموزش State Management در Flutter به این سوال پاسخ می‌دهیم که Flutter Key چیست و چه کاربردی دارد؟ برای این کار مثالی را مطرح کردیم که در آن لیستی از آیتم ها داریم و و میخواهیم ترتیب آنها را عوض کنیم. وقتی از Stateful Widget استفاده میکنیم بدون استفاده از Key ترتیب به درستی عوض نمی‌شود. دلیل این اتفاق را از طریق توضیح مکانیزم داخلی فلاتر بررسی کردیم و سپس انواع Key ها در شرح دادیم.


Link: https://youtu.be/Bg9OL5Zt8ZQ

PlayList: https://youtube.com/playlist?list=PLJ9zDGwhhsBwoDOzFdlHBa6H7w8ExoeKV
〰️〰️〰️〰️〰️
© @microfrontend_ir

کاربرد InheritedWidget در Flutter

در ششمین ویدیو از سری آموزش State Management در Flutter به بررسی کاربرد InheritedWidget در Flutter پرداختیم. یکی از اصلی ترین روش‌هایی که State Management در فلاتر Lift up کردن State است. به این معنی که State را به بالاترین سطح مورد نیاز خود بالا بکشیم و آن را با تمام فرزندان درخت یا یا بخشی از درخت به اشتراک بگذاریم. فلاتر این امکان را از طریق InheritedWidget به برنامه نویس ارایه می‌دهد. درک InheritedWidget کلید درک سایر رویکردهای State Management در اکوسیستم فلاتر است.


Link: https://youtu.be/sfqfkTCFQ1A

PlayList: https://youtube.com/playlist?list=PLJ9zDGwhhsBwoDOzFdlHBa6H7w8ExoeKV
〰️〰️〰️〰️〰️
© @microfrontend_ir

استفاده از State در Flutter InheritedWidget

در هفتمین ویدیو از سری آموزش State Management در Flutter به بررسی شیوه استفاده از State در Flutter InheritedWidget پرداختیم. یکی از اصلی ترین روش‌هایی که State Management در فلاتر Lift up کردن State است. به این معنی که State را به بالاترین سطح مورد نیاز خود بالا بکشیم و آن را با تمام فرزندان درخت یا یا بخشی از درخت به اشتراک بگذاریم. فلاتر این امکان را از طریق InheritedWidget به برنامه نویس ارایه می‌دهد. درک InheritedWidget کلید درک سایر رویکردهای State Management در اکوسیستم فلاتر است. در این ویدیو و در ادامه ویدیو قبلی سعی میکنیم یک وبجت فلاتری بسازیم که در آن یک StatefulWidget را از طریق InheritedWidget در درون درخت ویجت ها به اشتراک بگذاریم.

Link: https://youtu.be/sKvNs82QLfE

PlayList: https://youtube.com/playlist?list=PLJ9zDGwhhsBwoDOzFdlHBa6H7w8ExoeKV
〰️〰️〰️〰️〰️
© @microfrontend_ir

بهینه سازی فلاتر با InheritedModel

مهمترین مساله و معضل با InheritedWidget این است که به ازای هر تغییری تمام ویجت هایی که از آن ارث گرفته‌اند بایستی مجددا build شوند. InheritedModel کلاسی است که از InheritedWidget ارث گرفته است و امکانی را ارایه می‌دهد که از طرق مفهوم aspect بین ویجت‌های که نیاز به build دارند و ویجت هایی که نیاز ندارند فرق گذاشت و به ازای تغییر صرفا ویجت هایی build شوند که نیاز دارند.


Link: https://youtu.be/qNzzVTsKnkw

PlayList: https://youtube.com/playlist?list=PLJ9zDGwhhsBwoDOzFdlHBa6H7w8ExoeKV
〰️〰️〰️〰️〰️
© @microfrontend_ir

پیاده سازی Django Soft Delete

چندی پیش خبری منتشر شد که در توییتر حذف داده‌ها به درستی انجام نمی‌شود. واقعیت این است که در اغلب نرم‌افزارهای مدرن داده‌ها به صورت فیزیکی حذف نمی‌شوند و صرفا برچسپ حذف شده می‌گیرند. در این ویدیو با هدف آشنایی بیشتر با مدل‌های abstract و proxy در جنگو و همچنین ایجاد Custom Queryset و Custom Manager و Custom Admin Action مدلی را طراحی کردیم که در صورت ارث بری از آنها داده‌ها با دستور حذف به صورت فیزیکی پاک نشوند و در صورت لزوم برگردانده شوند. برای توضیح بیشتر نیز به جنگو ادمین یک اکشن اضافه کردیم که داده‌هایی که حذف شده اند را برکردانیم


Link: https://youtu.be/I_23u4xj1Ws

PlayList: https://youtube.com/playlist?list=PLJ9zDGwhhsBwdrfdaoOqbYev3_ocuBOfv

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

یکی از دوستان کامنت بسیار مهمی تو یوتیوب نوشته بودند و دیدم خالی از لطف نیست اینجا هم پست کنم.

سوال :
Vessal Daneshvar
برای فیلد های یونیک هم میشه راهنمایی بکنید که soft delete چجوی باشه بهتره ، معمولا یه مقدار پیچیدگی ایجاد میشه موقع پیاده سازی کردن مواردی که باید یونیک باشن و حذف شده اند و مجدد میخوان ایجاد بشن

جواب:
میدونید که یونیک در واقع یک کانستراینت و ایندکس سمت دیتابیسه. یکی از ویژگی های بسیار مهم و جذابی که ارایه میده تعریف conditional constraint که مثلا تو سناریو این ویدیو میتونید بگید ایندکس یونیک صرفا رو مواردی که is_deleted فالس هست اعمال شوند. مثلا به این صورت
UniqueConstraint(fields=['user'], condition=Q(status='DRAFT'), name='unique_draft_user')
جزییات کاملتر تو داکیومنتیشن اینجاست.
https://docs.djangoproject.com/en/4.1/ref/models/constraints/#condition


پی نوشت: از منظر مدیریت ایندکس و کانستراینت‌ها به جرات میتونم بگم جنگو یه سر و گردن از سایر ORM ها مثل لاراول بالاتره.البته دلیلش خود جنگو یا لاراول نیست. دلیلش فرهنگ حاکم بر کامیونیتشونه. تو کامیونیتی php انتخاب اول دیتابیس عموما MySQL و مشتقاتشه اما تو پایتون معمولا انتخاب اول PostgreSQL هستش و نکته اینجاست که مای اس کیو برای ایندکس تمرکزش بر ایندکس های مبتنی بر درخته و خیلی خوب این کارو میکنه. تو پستگرس علاوه بر ایندکس های مبتنی بر درخت، طیف گسترده ای از ایندکس ها شامل expression و partial رو ساپورت میکنه

در ادامه نکته‌ها و ترفندهای جنگو و آموزش Django - پیاده سازی Rating با ٖGeneric Relation را بررسی کردیم.
فرض کنید با Django درحال توسعه نرم افزاری هستید که مدل‌های مختلفی مانند محصولات، مطالب وبلاگ، نظرات و ... در آن وجود دارد و مدیر پروژه از شما می‌خواهد که امکان رتبه بندی یا Rating به همه آن مولفه‌ها اضافه کنید. یک انتخاب این است که به ازای هر کدام از این مولفه‌ها یک مدل Rate اضافه کنید که بدیهی است نگه داری همه آنها پیچیدگی‌های خاص خود را دارد. بسیار ایده‌ال خواهد بود اگر بتوانیم یک مدل Rate داشته باشیم و در همه مدل‌های دیگر از آن استفاده کنیم. به عبارت دیگر به صورت چند ریختی یا Polymorphism و یا Generic رابطه خود را پیاده کنیم. Generic Relation یکی از ویژگی‌های جذابی است که Django ارایه می‌دهد. در این ویدیو به بررسی Content Type در Django پرداختیم و امکانات مهمی که برای چندریختی در مدل‌ها ارایه ‌می‌دهدپرداختیم.
Link: https://youtu.be/VOnRkXjlfVI

PlayList: https://youtube.com/playlist?list=PLJ9zDGwhhsBwdrfdaoOqbYev3_ocuBOfv

〰️〰️〰️〰️〰️
© @Microfrontend_ir

مصاحبه فنی - CAP Theorem چیست؟
در این ویدیو به ضرورت استفاده از Distributed System در System Design و ملاحظات مرتبط با CAP Theorem پرداختیم. ابتدا سیستم های توزیع شده و چالش‌های آن را معرفی سپس به بررسی تفاوت‌های ACID و BASE پرداختیم. پس از آن نظریه CAP را مطرح کردیم. بر اساس CAP Theorem در سیستم‌های توزیع شده ما همواره از سه خصوصیت Consistency و Availability و Partition Tolerance تنها می‌توانیم دو مورد آن ها را همزمان داشته باشیم. این نظریه پایه و اساس بسیاری از سیستم ها بویژه دیتابیس های توزیع شده است و در انتخاب تکنولوژی بایستی این نکته را مد نظر داشته باشید و ابزار مناسب مساله خود را انتخاب کنید.

Link: https://youtu.be/nDS5ZUS3LmM


〰️〰️〰️〰️〰️
© @Microfrontend_ir

Git چیست و چگونه کار می کند؟

در این ویدیو ابتدا به تاریخچه پیدایش Git در فضای لینوکس پرداختیم سپس شیوه ذخیره سازی فایل ها در git در سطوح پایین پرداختیم و نشان دادیم که گیت داده ها را چگونه مدیریت می‌کند و با تغییرات چگونه رفتار می‌کند؟ گیت را در لایه ذخیره سازی میتوان یک دیتابیس Key/Value دانست که از مقادیر مختلفی پشتیبانی و برای همه آنها کلید مشخصی تولید می‌کندو برای هر تغییری تاریخچه آن را نگه می‌دارد


Link: https://youtu.be/bLgIXTORzrA



〰〰〰〰〰〰〰
© @Microfrontend_ir

ویرایش چهارم کتاب بسیار مهم سیستم‌های توزیع شده اثر ون استین و تتنباوم اخیرا منتشر شده که به نظرم بسیار کتاب خوبیه و به عمق بخشیدن به دانشتون خیلی کمک میکنه. مخصوصا اینکه مثال ها سعی شده ساده و به زبان پایتون پیاده بشه.


https://www.distributed-systems.net/index.php/books/ds4/

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

〰〰〰〰〰〰〰
© @Microfrontend_ir

ChatGPT چیست و نحوه استفاده از چت جی پی تی چگونه است؟

در این ویدیو به این سوال پاسخ دادیمChatGPT چیست و استفاده از چت جی پی تی چگونه است؟ ابتدا شیوه ثبت نام در سایت OpenAI ChatGPT رو توضیح دادیم و سپس انوع نسخه های GPT و ساختار آن را توضیح دادیم. سپس از آن خواستیم که برخی سوالات برنامه نویسی و الگوریتمی را پاسخ دهد و برای ورود به جزییات از آن خواستیم که یک مدل جنگو را با جزییات تعریف و ویو آن را برایمان بسازد. سپس به بررسی تاثیر اجتماعی تکنولوژی‌های هوش مصنوعی مانند IBM Deep Blue و شکست تاریخی گری کاسپاروف استاد بزرگ شطرنج از ماشین و همچنین اتفاقات مرتبط با جنبش لودیت‌ها در دوره انقلاب صنعتی را معرفی کردیم.
لودیت‌های آنارشیست سرکوب شدند، گری کاسپاروف افسانه‌ای به دیپ بلو باخت و روی دیدن مادرشو نداشت. ولی ما ماندیم، حتی خندیدیم!

Link: https://youtu.be/D0JAtjP8BpI

〰〰〰〰〰〰〰
© @Microfrontend_ir