و این مدل سنیورش😁

دوس دارید براتون قشنگ توضیح بدم که چی به چیه؟ و بدونید که یه سنیور چه چیزایی رو در نظر میگیره؟

اینم از توضیحات کد senior level که براتون فرستادم😁
عکس کد رو باز کنید و ویس هارو گوش بدید
قطعا کلی نکته گفتم که توی این سطح هم کمکتون میکنه و شمارو حتی یه لول میکشونه بالا😍✌🏻

با توجه به این نقشه راهی که براتون گذاشتم
وقتی به مرحله advanced ریکت میرسید باید این موارد رو به خوبی بدونید:
Virtual DOM
Reconciliation algorithm
Diffing algorithm
Fiber reconciler
Stack reconciler
Fiber VS. stack
State batching
State transition
Reusable components
SOLID principles in react components

و یه سری design pattern:
Custom hooks
Context api
Compound components
HOC

Provider pattern
State management with useReducer
Props combination
ForwardRef
useImperativeHandle

واسه کسایی میگم که ریکت رو یاد گرفتن و میخوان مباحث عمیق تری رو ازش بدونن🤍

جایی اگه سوالی براتون پیش اومد حتما بپرسید❤️

مهندس ارشد فرانت اند توی دیجیکالا😁
همایش فرانت چپتر هستیم جاتون خالیه✌🏻🔥

بچه ها بیاین یه چالش جاوا اسکریپتی باهم حل کنیم!
نظرتونه؟

یه همچین دیتای مسخره ای داریم

const items = [
  [1, 2, 3],
  [4, 5, [[[[[[[[[[[[[[[[[[[[[6]]]]]]]]]]]]]]]]]]]]]],
];

یه فانکشن بنویسید که این دیتارو بگیره و اگه عدد 6 هرجایی ازش وجود داشت true برگردونه، در غیر این صورت false

فانکشنتونم بیشتر از 10 12 خط نباید بشه (تو حالت ترو تمیز و خوانا)

برای اولین کسی که حلش کنه هم یه جایزه خوب در نظر دارم😁 ببینم چه میکنید

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

چیزی که معمولا توی اینطور سوالای الگوریتمی ازتون خواسته میشه اینه که بتونید به کمک دستورات pure برنامه نویسی یک الگوریتم برای حل این مسئله بنویسید که فقط (در صورت لزوم) با تغییر سینتکس توی تموم زبان های برنامه نویسی قابل پیاده سازی باشه
یعنی استفاده از مواردی مثل توابع، حلقه ها، متغیر ها و ... . به اینا دستورات pure برنامه نویسی میگن

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

راه حل درستی که برای این قضیه وجود داره تا ما نخوایم کلی حلقه های تو در تو و کلی کد ناخوانا داشته باشیم استفاده از دوتا مفهومه
یکیش isArray که هر مرحله چک کنیم دیتامون آرایه هست یا نه. و یکیشم recursive functions یا توابع بازگشتی

به این صورت که تابع رو برای تکرار لاجیک (منطق) داخل خودش صدا میزنیم و این کمک میکنه بهمون که نخوایم حلقه های خیلی زیادی رو داخل کدمون تکرار کنیم

اینم کدشون

و اما اینم نسخه ای که خودم نوشتم

یه نکته ریکتی که خیلی مهمه رعایتش کنید توی کامپوننت هاتون

وقتی از هوک useEffect استفاده میکنید و داخلش به window یا document یک ایونت رو اضافه میکنید مثلا برای انجام یه حرکتی داخل اپلیکیشن
حتما توی clean up function اون ایونت رو remove کنید

این کار باعث میشه وقتی کامپوننت از صفحه پاک میشه، یا اصطلاحا unmount میشه، ایونت مربوط بهش هم پاک بشه و الکی کلی ایونت و پردازش روی window یا document نباشه

مخصوصا این مدل ایونت هایی که فانکشن مربوط بهشون خیلی زیاد صدا زده میشن، مثلا اینجا همش با اسکرول کردن کاربر این ایونت صدا زده میشه و خب call stack رو درگیر میکنه

میخوام ببینم بیشتر براتون توی چه زمینه ای نکته و تجربه بذارم😎