👋 Welcome to Foad Labs

اینجا قراره درباره:

- Frontend Engineering
- React & Next.js
- UI/UX Details
- Modern Web Development
- و روند ساخت پروژه‌ها محتوا بذارم.

نه صرفاً آموزش‌های تکراری،
بیشتر چیزایی که خودم واقعاً موقع build کردن پروژه‌ها باهاشون درگیر میشم.

اگر به دنیای مدرن فرانت‌اند علاقه داری، احتمالاً اینجا رو دوست خواهی داشت ⚡️

در حال آماده‌سازی نسخه جدید وبسایت شخصیم هستم 👀

به‌زودی داخل چنل درباره :

- روند طراحی
- جزئیات UI
- ساختار پروژه
- و ایده‌هایی که پشتش بوده

هم محتوا میذارم 🩵

به نظرم یکی از underrated ترین مهارت‌ها توی فرانت‌اند :
سادگیه.

خیلی وقتا مشکل UI این نیست که چیزی کم داره،
مشکل اینه که بیش از حد شلوغه.

هرچی بیشتر جلو رفتم،
بیشتر فهمیدم طراحی خوب،
بیشتر درباره حذف کردنه تا اضافه کردن.

#Labs_Notes

ترجمه :
اون کلید اصلی من بود. منحصر به فرد، غیرقابل جایگزین. سپس او در جدول شخص دیگری به
یک کلید خارجی تبدیل شد.

پ.ن : دیتابیس کارا درک میکنن 😂

#Labs_fun

⚠️ چرا این کد توی React/Next.js یک فاجعه‌ست؛ حتی وقتی Dependency Array درسته؟

مشکل از اینجاست که React فقط Reference رو مقایسه می‌کنه، نه محتوای Object رو.

یعنی:
هر Render = یک Object جدید داخل Memory

و نتیجه؟
useEffect دوباره اجرا میشه → setState → Re-render → Loop ∞

همین چرخه کوچیک می‌تونه:
🔥 Performance رو نابود کنه
🔥 Browser رو Lag کنه
🔥 و Debug کردن رو تبدیل به کابوس کنه

✅ راه‌حل:

- اگر مقدار ثابته → خارج از کامپوننت تعریفش کن
- اگر وابسته به props/state هست → useMemo

(React 19 تا حدی خودش این Optimization رو انجام میده)

#Labs_bug
#Labs_Tips

کامیونیتی نکست و شرکت بنیانگذار اون یعنی ورسل داره توی ۳ کشور اروپایی ایونت برگزار میکنه
که مهموناش از خفنای تیم نکست هستن 🤌🏻

پ.ن : سایتشون آدمو به هوس میندازه شرکت کنی 😂

🌐 https://nextjs.org/nights

به نظرم یکی از underrated ترین مهارت‌ها برای یه دولوپر،
اینه که بدونه کِی باید چیزی رو rebuild نکنه.

#Labs_Notes

بیاین باهم صادق باشیم 🥸

کدوم یکی از ما وقتی یه پکیج جدید نصب می‌کنیم،
واقعا میریم Bundle Size یا حجم نهایی‌ ای که قراره وارد پروژه کنه رو چک کنیم؟ 😶

همه‌چی خوبه…
تا وقتی که پروژه رو ران می‌کنی و یهو با خودت میگی :
داش این چرا اینقدر دیر لود میشه؟! 💀

و بعد تازه داستان شروع میشه 😵‍💫

همین سناریوهای دردناک باعث شد با experimental-analyze آشنا بشم توی Next.js.

و واقعا چیز خفنیه 👀

نه فقط میگه پروژه سنگینه،
دقیقا لو میده :

- کدوم Route داره باندل رو منفجر می‌کنه
- کدوم Package مقصره
- و این حجم دقیقا از کجا وارد پروژه شده

لطفاً قبل اینکه سرورهای بیچاره‌تون Knock Out بشن برید امتحانش کنید 😭😂

🔗 https://nextjs.org/docs/app/guides/package-bundling

#Labs_Inside
#Labs_Package

ظهر بخیر به اونایی که ☕️

هنوز کامل بیدار نشدن،
ولی از روی عادت لپ‌تاپ رو باز کردن 😅

یه سر به پروژه زدن...

یه سر به پیام‌های دیشب...

یه سر به تسک‌هایی که قرار بود فردا انجامشون بدن 😭

و حالا دارن به مانیتور نگاه می‌کنن و از خودشون می‌پرسن :

خب... امروز از کجا خرابکاری رو شروع کنیم؟ 😂

روزتون پر از باگ‌های کوچیک و کامیت‌های بزرگ ✌️

#Labs_Life