توی این پست درباره دستور
@techstuff100
git commit --amend صحبت کردم. این دستور وقتی بدرد میخوره که بخوایم آخرین کامیت رو اصلاح کنیم، مثلا پیامش رو عوض کنیم یا فایل جاافتاده رو بهش اضافه کنیم.@techstuff100
❤12👏5
استراتژیهای Caching با Workbox
ورکباکس (Workbox) یک کتابخونه قدرتمند برای ساخت PWA هست که توسط گوگل توسعه داده شده و پکیجهای معروفی مثل next-pwa هم ازش استفاده میکنن. Workbox استراتژیهای کشینگ، background sync، پشتیبانی از حالت آفلاین و ... رو خیلی ساده کرده.
توی این ویدئو Workbox رو به پروژه اضافه میکنیم، فایلها و روتهای مهم رو precache میکنیم، فرایند routing رو بررسی میکنیم، assetهای استاتیک و APIهامون رو با استراتژیهای caching، کش و درنهایت background sync رو اضافه میکنیم.
ویدئوی یوتوب:
https://www.youtube.com/watch?v=-dVW58yqtHQ&list=PL1bBcWODwsLMUPOu1Vz7orH2brAgKlWAU
@techstuff100
ورکباکس (Workbox) یک کتابخونه قدرتمند برای ساخت PWA هست که توسط گوگل توسعه داده شده و پکیجهای معروفی مثل next-pwa هم ازش استفاده میکنن. Workbox استراتژیهای کشینگ، background sync، پشتیبانی از حالت آفلاین و ... رو خیلی ساده کرده.
توی این ویدئو Workbox رو به پروژه اضافه میکنیم، فایلها و روتهای مهم رو precache میکنیم، فرایند routing رو بررسی میکنیم، assetهای استاتیک و APIهامون رو با استراتژیهای caching، کش و درنهایت background sync رو اضافه میکنیم.
ویدئوی یوتوب:
https://www.youtube.com/watch?v=-dVW58yqtHQ&list=PL1bBcWODwsLMUPOu1Vz7orH2brAgKlWAU
@techstuff100
❤11👍1🤔1
Tech Stuff
Building Micro-Frontends Chapter 8.pdf
Building Micro-Frontends Chapter 9.pdf
3.3 MB
کتاب Building Micro-Frontends فصل ۹: مهاجرت از Monolith به میکروفرانتاند
مطالبی که توی فصل نهم صحبت شده:
- زمینه (context) پروژه
- استراتژیهای مهاجرت
- جزئیات پیادهسازی (وظایف app shell، ادغام بکاند، پیادهسازی Canary Release، چندزبانه و ...)
پ.ن: خلاصه فصلهای قبل رو با این هشتگ میتونین پیدا کنین:
#Building_Micro_Frontends
@techstuff100
مطالبی که توی فصل نهم صحبت شده:
- زمینه (context) پروژه
- استراتژیهای مهاجرت
- جزئیات پیادهسازی (وظایف app shell، ادغام بکاند، پیادهسازی Canary Release، چندزبانه و ...)
پ.ن: خلاصه فصلهای قبل رو با این هشتگ میتونین پیدا کنین:
#Building_Micro_Frontends
@techstuff100
❤9🤔3
مهاجرت تدریجی با Strangler Fig
این پست درباره برای مهاجرت از سیستمهای Legacy به سیستم جدیده. Strangler Fig pattern کمک میکنه بخش به بخش سیستم رو جایگزین کنیم و همزمان سیستم قدیمی هم کار کنه.
@techstuff100
این پست درباره برای مهاجرت از سیستمهای Legacy به سیستم جدیده. Strangler Fig pattern کمک میکنه بخش به بخش سیستم رو جایگزین کنیم و همزمان سیستم قدیمی هم کار کنه.
@techstuff100
❤9👍4🔥1
توی فرایند توسعه نرمافزار، به ابزارهایی نیاز داریم که باهاش بتونیم بر اساس دیتا تصمیمگیری کنیم. مثلا ببینیم کدوم رنگ دکمه بیشتر کلیک میخوره، کدوم layout فروش بیشتری داره، یا کدوم نسخه از اپلیکیشن engagement بهتری ایجاد میکنه. Statsig یکی از پلتفرمهایی است که این فرایند رو خیلی آسون کرده. علاوه بر A/B Testing، قابلیتهای دیگهای مثل Analytics، Feature Gates، Session Replays و خیلی چیزهای دیگه بهمون میده که سرعت توسعه رو بالا میبره.
توی این ویدیو بطور کامل این موارد به همراه قابلیتهای دیگه Statsig مثل Dynamic Configs، Layers و Holdouts رو بررسی میکنم.
ویدئوی یوتوب:
https://www.youtube.com/watch?v=kVd4OP6hgAw&list=PL1bBcWODwsLOgA1PLZ8tNca7VMFNPPdm-
@techstuff100
توی این ویدیو بطور کامل این موارد به همراه قابلیتهای دیگه Statsig مثل Dynamic Configs، Layers و Holdouts رو بررسی میکنم.
ویدئوی یوتوب:
https://www.youtube.com/watch?v=kVd4OP6hgAw&list=PL1bBcWODwsLOgA1PLZ8tNca7VMFNPPdm-
@techstuff100
❤9🔥3
Tech Stuff
Building Micro-Frontends Chapter 9.pdf
Building Micro-Frontends Chapter 10.pdf
2.5 MB
کتاب Building Micro-Frontends فصل ۱۰ (فصل آخر): معرفی میکروفرانتاند در سازمان شما
مطالبی که توی فصل دهم صحبت شده:
- چرا باید از میکروفرانتاند استفاده کنیم؟
- ارتباط بین سازمانها و معماری نرمافزار
- پیادهسازی حاکمیت (Governance) برای روانتر شدن ارتباطات
- تکنیکهایی برای بهتر کردن جریان ارتباطات
- سازمان غیرمتمرکز (Decentralized)
پ.ن: خلاصه فصلهای قبل رو با این هشتگ میتونین پیدا کنین:
#Building_Micro_Frontends
@techstuff100
مطالبی که توی فصل دهم صحبت شده:
- چرا باید از میکروفرانتاند استفاده کنیم؟
- ارتباط بین سازمانها و معماری نرمافزار
- پیادهسازی حاکمیت (Governance) برای روانتر شدن ارتباطات
- تکنیکهایی برای بهتر کردن جریان ارتباطات
- سازمان غیرمتمرکز (Decentralized)
پ.ن: خلاصه فصلهای قبل رو با این هشتگ میتونین پیدا کنین:
#Building_Micro_Frontends
@techstuff100
❤9🤔2
Tech Stuff
Building Micro-Frontends Chapter 10.pdf
Building Micro-Frontends.pdf
25.2 MB
خلاصه همه فصلهای کتاب رو توی این فایل گذاشتم. اگه خواستین نسخه اصلیشو بخونین، تا چند وقت دیگه ویرایش دومش میاد که خیلی کاملتر از این نسخهست.
#Building_Micro_Frontends
@techstuff100
#Building_Micro_Frontends
@techstuff100
❤9👍2🤷♂1🤔1
سوال مصاحبه React: پیادهسازی useEffect از صفر
توی این چالش از شما خواسته میشه useEffect رو از صفر پیادهسازی کنید. تمرکز اصلی روی مدیریت dependencyهاست؛ اینکه بر اساس آرایه dependencyها چه زمانی افکت اجرا بشه و چه زمانی تابع cleanup فراخوانی بشه. مصاحبهکننده برای روشنتر شدن سوال، به چندتا نکته اشاره کرده: پیادهسازی باید رایجترین موارد رو پوشش بده، زمان مصاحبه یک ساعته، تاکید روی dependency handling هست (نه روی جزئیات زمانبندی اجرای افکت) و ترجیح داده شده که کد با TypeScript نوشته بشه.
بهجای پریدن مستقیم به کدنویسی، توصیه میشه اول مسئله رو تحلیل کنید: روی وایتبورد یا با یک دیاگرام جریان وابستگیها و lifecycle افکتها رو رسم کنید، edge caseها (مثل آرایه dependency خالی یا undefined، نیاز به cleanup و ...) رو مشخص کنید و بعد وارد پیادهسازی بشید.
مقاله:
https://freedium.cfd/https://levelup.gitconnected.com/interview-challenge-could-you-write-useeffect-from-scratch-e2fe0f12b7e7
@techstuff100
توی این چالش از شما خواسته میشه useEffect رو از صفر پیادهسازی کنید. تمرکز اصلی روی مدیریت dependencyهاست؛ اینکه بر اساس آرایه dependencyها چه زمانی افکت اجرا بشه و چه زمانی تابع cleanup فراخوانی بشه. مصاحبهکننده برای روشنتر شدن سوال، به چندتا نکته اشاره کرده: پیادهسازی باید رایجترین موارد رو پوشش بده، زمان مصاحبه یک ساعته، تاکید روی dependency handling هست (نه روی جزئیات زمانبندی اجرای افکت) و ترجیح داده شده که کد با TypeScript نوشته بشه.
بهجای پریدن مستقیم به کدنویسی، توصیه میشه اول مسئله رو تحلیل کنید: روی وایتبورد یا با یک دیاگرام جریان وابستگیها و lifecycle افکتها رو رسم کنید، edge caseها (مثل آرایه dependency خالی یا undefined، نیاز به cleanup و ...) رو مشخص کنید و بعد وارد پیادهسازی بشید.
مقاله:
https://freedium.cfd/https://levelup.gitconnected.com/interview-challenge-could-you-write-useeffect-from-scratch-e2fe0f12b7e7
@techstuff100
❤8🤔2
استفاده از act API در تستهای React
توی React، تابع act برای شبیهسازی رفتار واقعی مرورگر توی تست استفاده میشه. جزئیاتش رو توی این پست بخونید.
@techstuff100
توی React، تابع act برای شبیهسازی رفتار واقعی مرورگر توی تست استفاده میشه. جزئیاتش رو توی این پست بخونید.
@techstuff100
❤12👏1