Forwarded from 🎄 DevTwitter | توییت برنامه نویسی
ترد (Thread) تو فرانت یعنی چی؟
ترد (Thread) یعنی یه خط یا مسیر اجرای کد توی برنامه یا مرورگر.
تصور کن برنامه یا مرورگر مثل یه آشپزخونه بزرگه:
- هر ترد مثل یه سرآشپز یا کارمند توی آشپزخونهست که یه کار مشخصو انجام میده.
- وقتی یه ترد مشغول یه کار سنگین میشه، فقط همون مسیر (یا سرآشپز) تحت تأثیر قرار میگیره، نه همه چیز.
چندین نوع ترد داریم که خوبه باهاشون اشنا باشیم و بدونیم از هرکدوم باید برای چه کاری استفاده کنیم:
1- ترد اصلی (Main Thread)
- که مسئول همه چیزای اصلی صفحه است: DOM، CSS، رندر و eventها
- هر چیزی که با کاربر در تعامله، اینجا اجرا میشه
2- ترد وب وورکر (Web Worker)
- کارهای سنگین و طولانی مثل پردازش دادههای بزرگ رو با این ترد انجام میدن
- مستقیم نمیتونه با DOM کار میکنه و فقط با پیام با main thread حرف میزنه
3- ترد سرویس وورکر (Service Worker)
- مخصوص PWA: کش، fetch، push notification
- مستقل از main thread و UI رو قفل نمیکنه
برای اینکه کار با main thread خوب و روان باشه، مهمه که کارای سنگین و طولانی رو مستقیم توش نذاریم. همه چیزای مربوط به DOM، رندر و تعامل با کاربر باید سریع اجرا بشه تا صفحه لگ نزنه. کارای پردازشی بزرگ رو بهتره به Web Worker بسپاریم و فقط نتیجه رو برگردونیم. همینطور از تکنیکهایی مثل debounce و throttle برای کنترل eventها استفاده کنیم تا main thread شلوغ نشه. وقتی این نکات رو رعایت کنیم، UIامون همیشه روون و بدون لگ میمونه
@DevTwitter | <Reihaneh SadatShokouhi/>
ترد (Thread) یعنی یه خط یا مسیر اجرای کد توی برنامه یا مرورگر.
تصور کن برنامه یا مرورگر مثل یه آشپزخونه بزرگه:
- هر ترد مثل یه سرآشپز یا کارمند توی آشپزخونهست که یه کار مشخصو انجام میده.
- وقتی یه ترد مشغول یه کار سنگین میشه، فقط همون مسیر (یا سرآشپز) تحت تأثیر قرار میگیره، نه همه چیز.
چندین نوع ترد داریم که خوبه باهاشون اشنا باشیم و بدونیم از هرکدوم باید برای چه کاری استفاده کنیم:
1- ترد اصلی (Main Thread)
- که مسئول همه چیزای اصلی صفحه است: DOM، CSS، رندر و eventها
- هر چیزی که با کاربر در تعامله، اینجا اجرا میشه
2- ترد وب وورکر (Web Worker)
- کارهای سنگین و طولانی مثل پردازش دادههای بزرگ رو با این ترد انجام میدن
- مستقیم نمیتونه با DOM کار میکنه و فقط با پیام با main thread حرف میزنه
3- ترد سرویس وورکر (Service Worker)
- مخصوص PWA: کش، fetch، push notification
- مستقل از main thread و UI رو قفل نمیکنه
برای اینکه کار با main thread خوب و روان باشه، مهمه که کارای سنگین و طولانی رو مستقیم توش نذاریم. همه چیزای مربوط به DOM، رندر و تعامل با کاربر باید سریع اجرا بشه تا صفحه لگ نزنه. کارای پردازشی بزرگ رو بهتره به Web Worker بسپاریم و فقط نتیجه رو برگردونیم. همینطور از تکنیکهایی مثل debounce و throttle برای کنترل eventها استفاده کنیم تا main thread شلوغ نشه. وقتی این نکات رو رعایت کنیم، UIامون همیشه روون و بدون لگ میمونه
@DevTwitter | <Reihaneh SadatShokouhi/>
🔥6⚡1💯1
Forwarded from 🎄 DevTwitter | توییت برنامه نویسی
قبلا سایت ایرنیک لیست دامنه هایی که تازه آزاد شده بود رو تو سایتش میذاشت اما خیلی وقته که لیستشو نمیذاره
بجاش میتونید از سایت زیر لیست دامنه های تازه آزاد شده رو ببینید
http://free-domains.ir
پ.ن: اگه دنبال ایده برای اسم دامنه هستید میتونه کاربردی باشه
@DevTwitter | <ixAbolfazl/>
بجاش میتونید از سایت زیر لیست دامنه های تازه آزاد شده رو ببینید
http://free-domains.ir
پ.ن: اگه دنبال ایده برای اسم دامنه هستید میتونه کاربردی باشه
@DevTwitter | <ixAbolfazl/>
🔥4🎉1
Forwarded from Dev Feed
امروز، سازمان امنیت سایبری Aikido Security اعلام کرده که حساب maintainer شناختهشدهای به نام qix- در اثر یک حمله فیشینگ به دست مهاجمان افتاده است. مهاجمان موفق شدند ۱۸ بستهی محبوب npm مانند chalk، debug و ansi-styles را دستکاری کنند. این بستهها در مجموع بیش از دو میلیارد بار دانلود هفتگی دارند
NPM) مخفف Node Package Manager هست.
این ابزار یکی از اصلیترین بخشهای اکوسیستم Node.js به حساب میاد.
(وقتی شک داریم سیستم یا پروژه ممکنه آلوده باشه)
تراکنش مالی/کریپتو نزنیم
چون بدافزار میتونه آدرس گیرنده رو عوض کنه.
سیستم آلوده رو روشن یا آنلاین نکنیم
روشن کردن = اجرای کد مخرب (post-install noscripts).
آنلاین شدن = اتصال به C2 server و لو رفتن دادهها.
بهروزرسانی خودکار بدون بررسی نزنیم
ممکنه آخرین نسخهی یک پکیج مخرب باشه.
از ریجستریهای غیررسمی یا پکیجهای ناشناخته نصب نکنیم
مخصوصاً بستههایی با اسم شبیه
ایمیل یا پیامهای مشکوک رو باز نکنیم
خیلی از این حملات با فیشینگ شروع میشن (مثل ایمیل جعلی npm).
پسوردهای قدیمی رو دوباره استفاده نکنیم چون اگه لو رفته باشه، مهاجم راحت وارد حساب میشه.
________________________________________________________________________
اپهای دسکتاپ (Slack, Discord, VS Code …) رو از سورس رسمی بگیر
نه از سایتهای ناشناس یا لینک تلگرام!
تراکنشهای کریپتو رو دوبار چک کن
قبل از تأیید، آدرس مقصد رو دستی مقایسه کن.
کیفپول سختافزاری (Hardware Wallet) استفاده کن
ولی تراکنش هارو با دقت بررسی کن
سیستم رو بهروز نگه دار ولی با تأخیر
بذار چند ساعت یا یک روز از انتشار آپدیت بگذره، تا اگه مخرب بود خبرش دربیاد.
موقع شک → سیستم رو روشن نکن یا کلا قطع اینترنت
تا بدافزار نتونه به C2 Server وصل بشهم Node.js به حساب میاد.
مدیریت اکانت
FA (Two-Factor Auth)۲ روی حساب npm و GitHub فعال کن (الزامی هم شده).
پسوردها رو با مدیر پسورد (مثل Bitwarden یا 1Password) نگه دار، نه مرورگر.
از کلید امنیتی سختافزاری برای ورود استفاده کن، مخصوصاً اگر maintainer هستی.
مدیریت Dependency
از package-lock.json یا yarn.lock استفاده کن → مطمئن میشه همیشه همون نسخه نصب میشه.
به جای ^1.2.3 بنویس 1.2.3 تا آپدیت ناخواسته نیاد.(خلاصه نسخه ی شناور نصب نکن)
محیط امن
npm install رو توی VM یا Docker تست کن قبل از اینکه بیاری توی سیستم اصلی.
اگر پکیج ناشناس هست → سورس کدشو بررسی کن مخصوصاً پوشهی noscripts یا postinstall.
Buildها رو روی CI/CD امن (مثلاً GitHub Actions با secrets محدود) انجام بده.
برای پروژههای حساس از سیستم جداگانه یا VM اختصاصی استفاده کن.
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥2
وقتی حرف از طراحی دیتابیسها یا معماری سیستمهای توزیعشده میشه، اسم CAP theorem همیشه وسطه.
این قضیه میگه شما نمیتونید همزمان هر سه ویژگی رو با هم داشته باشید:
Consistency (سازگاری): همه نودها همون لحظه یک دادهی واحد رو ببینن.
Availability (دسترسپذیری): همیشه از سیستم پاسخ بگیری، حتی اگر کامل نباشه.
Partition Tolerance (تحمل شکست شبکه): وقتی ارتباط بین نودها قطع بشه، سیستم همچنان کار کنه.
نکته کلیدی اینجاست که در عمل همیشه باید بین این سه مورد تریدآف داشته باشید.
مثالها خیلی روشنه:
دیتابیسهای سنتی مثل SQL معمولاً روی Consistency + Availability تمرکز دارن.
دیتابیسهای NoSQL مثل Cassandra بیشتر سمت Availability + Partition tolerance میرن.
پس آینده بهجای فرار از محدودیت CAP، در یاد گرفتن هنر انتخاب درسته. هر پروژه باید بفهمه کدوم ضلع براش حیاتیتره.
این قضیه میگه شما نمیتونید همزمان هر سه ویژگی رو با هم داشته باشید:
Consistency (سازگاری): همه نودها همون لحظه یک دادهی واحد رو ببینن.
Availability (دسترسپذیری): همیشه از سیستم پاسخ بگیری، حتی اگر کامل نباشه.
Partition Tolerance (تحمل شکست شبکه): وقتی ارتباط بین نودها قطع بشه، سیستم همچنان کار کنه.
نکته کلیدی اینجاست که در عمل همیشه باید بین این سه مورد تریدآف داشته باشید.
مثالها خیلی روشنه:
دیتابیسهای سنتی مثل SQL معمولاً روی Consistency + Availability تمرکز دارن.
دیتابیسهای NoSQL مثل Cassandra بیشتر سمت Availability + Partition tolerance میرن.
پس آینده بهجای فرار از محدودیت CAP، در یاد گرفتن هنر انتخاب درسته. هر پروژه باید بفهمه کدوم ضلع براش حیاتیتره.
🔥2
Armin codes
وقتی حرف از طراحی دیتابیسها یا معماری سیستمهای توزیعشده میشه، اسم CAP theorem همیشه وسطه. این قضیه میگه شما نمیتونید همزمان هر سه ویژگی رو با هم داشته باشید: Consistency (سازگاری): همه نودها همون لحظه یک دادهی واحد رو ببینن. Availability (دسترسپذیری):…
مثلا:
بانکداری آنلاین (CP – قربانی Availability):
وقتی پول جابهجا میکنی، مهمترین چیز سازگاریه.
حتی اگه چند ثانیه سیستم در دسترس نباشه، اشکالی نداره؛ ولی نمیتونه یه بار نشون بده حسابت خالیه و چند لحظه بعد پر.
شبکههای اجتماعی (AP – قربانی Consistency):
مثلا توی اینستاگرام ممکنه وقتی پست میذاری، دوستت همون لحظه نبینه یا لایکها با تأخیر بشمارن.
اینجا Availability مهمتره؛ چون کاربر انتظار داره همیشه بتونه چیزی رو ببینه یا بذاره، حتی اگر کمی ناسازگاری وجود داشته باشه.
سیستمهای رزرو آنلاین (CA – قربانی Partition Tolerance):
مثلا رزرو بلیط هواپیما یا هتل: سیستم نمیتونه یه صندلی رو همزمان به دو نفر بفروشه.
اما اگر ارتباط بین دیتاسنترها قطع بشه، سیستم رزرو ممکنه برای مدتی در دسترس نباشه.
بانکداری آنلاین (CP – قربانی Availability):
وقتی پول جابهجا میکنی، مهمترین چیز سازگاریه.
حتی اگه چند ثانیه سیستم در دسترس نباشه، اشکالی نداره؛ ولی نمیتونه یه بار نشون بده حسابت خالیه و چند لحظه بعد پر.
شبکههای اجتماعی (AP – قربانی Consistency):
مثلا توی اینستاگرام ممکنه وقتی پست میذاری، دوستت همون لحظه نبینه یا لایکها با تأخیر بشمارن.
اینجا Availability مهمتره؛ چون کاربر انتظار داره همیشه بتونه چیزی رو ببینه یا بذاره، حتی اگر کمی ناسازگاری وجود داشته باشه.
سیستمهای رزرو آنلاین (CA – قربانی Partition Tolerance):
مثلا رزرو بلیط هواپیما یا هتل: سیستم نمیتونه یه صندلی رو همزمان به دو نفر بفروشه.
اما اگر ارتباط بین دیتاسنترها قطع بشه، سیستم رزرو ممکنه برای مدتی در دسترس نباشه.
🔥3🍾1
Forwarded from 🎄 DevTwitter | توییت برنامه نویسی
روز بدقولها، شب بیدارها، ساخته شده با قلب و قهوه، phpهای مرده، پایتونهای کند، باگهای لحظهی دمو، ددلاینهای رد شده، سورپرازهای جاوااسکریپت، اینو یه ساعته با ai نوشتم، استکاورفلوی تنها...
روز کیبوردهای خسته، wheelهای خراب موس، دورههای نیمهکاره مونده، کارفرما هنوز پولمو نداده، یه بازی 4K نوشتم یک بایت حجمشه، زبان هرمز و آقای هاشمی، Go کارهایی که دنیا رو قشنگ میکنن، دات نت کارای سن و سال دار، استرس لحظهی لانچ، هک با css تو صداسیما، اشتباهی پوش کردم، 403، کارآموز بدون حقوق، شان اجتماعی بالا و حقوق پایین، ده تا کار همزمان توی شرکت، تحریمه، فیلتره، کشه، از سروره، از بکه، از فرانته، چرخ رو دوباره ساختم، تا چهار صبح بیدار بودم تهش فهمیدم یه سمیکالن نذاشتم، کارکردنهای تو سفر و روز تعطیل، نارضایتی دائمی کارفرما و ...
این روز مخصوص ماست؛ ما که با خطاها زندگی میکنیم، با دیباگ رشد میکنیم و با یک "It works!" حال دنیامون خوب میشه.
روز برنامهنویس مبارک :))
@DevTwitter
روز کیبوردهای خسته، wheelهای خراب موس، دورههای نیمهکاره مونده، کارفرما هنوز پولمو نداده، یه بازی 4K نوشتم یک بایت حجمشه، زبان هرمز و آقای هاشمی، Go کارهایی که دنیا رو قشنگ میکنن، دات نت کارای سن و سال دار، استرس لحظهی لانچ، هک با css تو صداسیما، اشتباهی پوش کردم، 403، کارآموز بدون حقوق، شان اجتماعی بالا و حقوق پایین، ده تا کار همزمان توی شرکت، تحریمه، فیلتره، کشه، از سروره، از بکه، از فرانته، چرخ رو دوباره ساختم، تا چهار صبح بیدار بودم تهش فهمیدم یه سمیکالن نذاشتم، کارکردنهای تو سفر و روز تعطیل، نارضایتی دائمی کارفرما و ...
این روز مخصوص ماست؛ ما که با خطاها زندگی میکنیم، با دیباگ رشد میکنیم و با یک "It works!" حال دنیامون خوب میشه.
روز برنامهنویس مبارک :))
@DevTwitter
🍾12🔥4🍓1
این هفته یه چالش واقعی با تیم بکاند داشتیم: چطور API پایدار بسازیم بدون اینکه کار سرویسهای دیگه یا کاربران خراب بشه؟ 😅
چند نکته که وسط بحث پیش اومد:
Versioning (نسخهبندی)
بعضیها میخواستن تغییرات جدید رو همون نسخه موجود اعمال کنن، اما من اصرار داشتم: هر تغییر بزرگ = نسخه جدید (v1, v2).
دلیل؟ سرویسهای قدیمی باید بدون دردسر کار کنن و مشتریها کمکم به نسخه جدید مهاجرت کنن.
Backward Compatibility (سازگاری به عقب)
وقتی یه فیلد جدید اضافه میشد یا رفتار endpoint تغییر میکرد، باید نسخه قبلی هنوز کار میکرد. این یکی از بحثهای داغمون بود؛ چون تیم میخواست راحت تغییر بده، من میگفتم: «نه، نباید چیزی رو بشکنیم!»
Change Management (مدیریت تغییرات)
مستندسازی و changelog، تستهای اتوماتیک و قوانین سخت برای حذف فیلدها یا تغییر رفتارها. اول هشدار، بعد تغییر. این مرحله باعث شد همه تیمها روی یک خط باشن و کسی غافلگیر نشه.
چند نکته که وسط بحث پیش اومد:
Versioning (نسخهبندی)
بعضیها میخواستن تغییرات جدید رو همون نسخه موجود اعمال کنن، اما من اصرار داشتم: هر تغییر بزرگ = نسخه جدید (v1, v2).
دلیل؟ سرویسهای قدیمی باید بدون دردسر کار کنن و مشتریها کمکم به نسخه جدید مهاجرت کنن.
Backward Compatibility (سازگاری به عقب)
وقتی یه فیلد جدید اضافه میشد یا رفتار endpoint تغییر میکرد، باید نسخه قبلی هنوز کار میکرد. این یکی از بحثهای داغمون بود؛ چون تیم میخواست راحت تغییر بده، من میگفتم: «نه، نباید چیزی رو بشکنیم!»
Change Management (مدیریت تغییرات)
مستندسازی و changelog، تستهای اتوماتیک و قوانین سخت برای حذف فیلدها یا تغییر رفتارها. اول هشدار، بعد تغییر. این مرحله باعث شد همه تیمها روی یک خط باشن و کسی غافلگیر نشه.
💯7🍾1
Forwarded from FullstacksJS — Academy
چرا Bun انتخاب منطقی برای پروداکشن نیست؟
- چطور تشخیص بدیم یک ابزار برای استفاده توی شرکت خوبه؟
- مقایسه Bun و Deno
- مقایسه Bun و Node.JS
- چرا Deno گزینه بهتری از Node.JS هست؟
#exp #bun #deno
- چطور تشخیص بدیم یک ابزار برای استفاده توی شرکت خوبه؟
- مقایسه Bun و Deno
- مقایسه Bun و Node.JS
- چرا Deno گزینه بهتری از Node.JS هست؟
#exp #bun #deno
🔥6
Forwarded from Codespian | کدسپین
data_types.pdf
951.5 KB
مقالهی «Types» در JavaScript.info مروری مفید و کامل روی انواع دادهها در جاوااسکریپت است. در این مطلب موضوعات زیر به زبان ساده و کاربردی توضیح داده شدهاند:
🔢 انواع عددی (Number, BigInt) — شامل مقادیر ویژهای مثل Infinity، NaN و محدودیتهای عدد در جاوااسکریپت
🧵 نوع String — نحوهی استفاده از کوتیشنها، بکتیکها و قرار دادن عبارات در داخل ${…}
✅ نوع Boolean — نوع داده منطقی با دو مقدار true و false
🚫 نوع null و undefined — مفاهیم «هیچ چیز» و «تعریف نشده» و تفاوت بین آنها
🧱 نوع Object و Symbol — انواع پیچیدهتر و ساختارهایی که دادهها و رفتارها را در خود جای میدهند
🧮 اپراتور typeof — ابزار شناسایی نوع یک مقدار در زمان اجرا
🧪 تمرینها (Tasks) — بخش «Tasks» مقاله شامل مثالهایی تعاملی است که به شما کمک میکند مفاهیم را خودتان تست و تثبیت کنید
📌 منبع مقاله
🔢 انواع عددی (Number, BigInt) — شامل مقادیر ویژهای مثل Infinity، NaN و محدودیتهای عدد در جاوااسکریپت
🧵 نوع String — نحوهی استفاده از کوتیشنها، بکتیکها و قرار دادن عبارات در داخل ${…}
✅ نوع Boolean — نوع داده منطقی با دو مقدار true و false
🚫 نوع null و undefined — مفاهیم «هیچ چیز» و «تعریف نشده» و تفاوت بین آنها
🧱 نوع Object و Symbol — انواع پیچیدهتر و ساختارهایی که دادهها و رفتارها را در خود جای میدهند
🧮 اپراتور typeof — ابزار شناسایی نوع یک مقدار در زمان اجرا
🧪 تمرینها (Tasks) — بخش «Tasks» مقاله شامل مثالهایی تعاملی است که به شما کمک میکند مفاهیم را خودتان تست و تثبیت کنید
📌 منبع مقاله
🔥4
Forwarded from 🎄 DevTwitter | توییت برنامه نویسی
یه مینیاپ که متدهای استرینگ توی جاوااسکریپت رو با توضیح و مثال نشون میده.
دم دست و سریع، مخصوص وقتایی که یادت میره کدوم متد چی کار میکنه.
دموی آنلاین: https://js-string-methods.vercel.app
سورسکد:
https://github.com/DevTwitter/js-string-methods
@DevTwitter
دم دست و سریع، مخصوص وقتایی که یادت میره کدوم متد چی کار میکنه.
دموی آنلاین: https://js-string-methods.vercel.app
سورسکد:
https://github.com/DevTwitter/js-string-methods
@DevTwitter
🔥5
استریم (پخش) نسخهی اصلی فیلم Star Wars به صورت ASCII برای کلاینتهای خط فرمان از طریق SSH یا Telnet.
الهامگرفته از asciimation و پروژهی معروف towel.blinkenlights.nl، این بازنویسی با زبان Go یک رابط کاربری تعاملی جدید با پشتیبانی از کیبورد و ماوس معرفی میکند.
خیلی پروژه بانمکی بود
telnet starwarstel.net
https://github.com/gabe565/ascii-movie
الهامگرفته از asciimation و پروژهی معروف towel.blinkenlights.nl، این بازنویسی با زبان Go یک رابط کاربری تعاملی جدید با پشتیبانی از کیبورد و ماوس معرفی میکند.
خیلی پروژه بانمکی بود
telnet starwarstel.net
https://github.com/gabe565/ascii-movie
💯4🔥1🍾1
Forwarded from Tehran React Jobs
ریاکت ۱۹.۲ منتشر شد 🎉
ویژگیهای جالبی در این نسخه منتشر شده که پیشنهاد میکنم حتما بررسی کنید
- <Activity />
- useEffectEvent
- cacheSignal
- Performance Tracks
- Partial Pre-rendering
- and more...
اگر دوست دارین هر کدوم از قسمت رو با مثال و توضیحات خلاصه مطالعه کنید، مطلب زیر رو مطالعه کنید.
🚀 React 19.2 release highlights: here’s what changed! | لینک
امیدوارم مفید باشه 🫶
ویژگیهای جالبی در این نسخه منتشر شده که پیشنهاد میکنم حتما بررسی کنید
- <Activity />
- useEffectEvent
- cacheSignal
- Performance Tracks
- Partial Pre-rendering
- and more...
اگر دوست دارین هر کدوم از قسمت رو با مثال و توضیحات خلاصه مطالعه کنید، مطلب زیر رو مطالعه کنید.
🚀 React 19.2 release highlights: here’s what changed! | لینک
امیدوارم مفید باشه 🫶
Linkedin
"React 19.2: Boost Performance, Fix Pitfalls, Unlock New Patterns" | Mohammad Goldast posted on the topic | LinkedIn
🚀 Let’s explore the updates in *React 19.2*
This release packs with features that boost performance, fix common pitfalls, and unlock new patterns:
👉 <Activity> – hide subtrees, unmount effects, keep state, and render with lower priority. A game-changer…
This release packs with features that boost performance, fix common pitfalls, and unlock new patterns:
👉 <Activity> – hide subtrees, unmount effects, keep state, and render with lower priority. A game-changer…
🔥4
چند وقت پیش موقع توسعهی یک پروژه، به این فکر افتادم که ای کاش میشد تغییرات state رو دقیقتر روی یک timeline ببینم.
اینکه هر بار state تغییر میکنه، چه زمانی و به چه مقداری تغییر کرده، و حتی بتونم به عقب یا جلو برگردم.
همونجا بود که ایدهی ساخت یه ابزار ساده شکل گرفت.
ابزاری که نه تنها بتونه تاریخچهی state رو ذخیره کنه، بلکه بشه خیلی راحت:
🔄 Undo / Redo انجام داد
🕓 کل تغییرات رو به شکل یک timeline داشت
🎯 به هر جایی از timeline که خواستی بری
⚡ و در عین حال API ساده و سبک داشته باشه
نتیجه شد:
🚀 React State Timeline
این پکیج برای سناریوهای مختلفی میتونه مفید باشه:
وقتی روی formهای چند مرحلهای کار میکنید و میخواید بتونید به مقادیر قبلی برگردید.
وقتی در حال ساخت یک editor هستید (مثل ادیتور متن تصویر) و نیاز به undo/redo دارید.
یا هر جایی که نیاز دارید تاریخچهی state رو نگه دارید و مدیریت کنید.
📦 پکیج روی npm منتشر شده:
https://lnkd.in/dwEQEFzj
📖 داکیومنتیشن کامل اینجاست:
https://lnkd.in/dHZ3wyaR
💻 سورسکد و امکان مشارکت در گیتهاب:
https://lnkd.in/d_aAuykd
@nazari2079 ممد زده:
اینکه هر بار state تغییر میکنه، چه زمانی و به چه مقداری تغییر کرده، و حتی بتونم به عقب یا جلو برگردم.
همونجا بود که ایدهی ساخت یه ابزار ساده شکل گرفت.
ابزاری که نه تنها بتونه تاریخچهی state رو ذخیره کنه، بلکه بشه خیلی راحت:
🔄 Undo / Redo انجام داد
🕓 کل تغییرات رو به شکل یک timeline داشت
🎯 به هر جایی از timeline که خواستی بری
⚡ و در عین حال API ساده و سبک داشته باشه
نتیجه شد:
🚀 React State Timeline
این پکیج برای سناریوهای مختلفی میتونه مفید باشه:
وقتی روی formهای چند مرحلهای کار میکنید و میخواید بتونید به مقادیر قبلی برگردید.
وقتی در حال ساخت یک editor هستید (مثل ادیتور متن تصویر) و نیاز به undo/redo دارید.
یا هر جایی که نیاز دارید تاریخچهی state رو نگه دارید و مدیریت کنید.
📦 پکیج روی npm منتشر شده:
https://lnkd.in/dwEQEFzj
📖 داکیومنتیشن کامل اینجاست:
https://lnkd.in/dHZ3wyaR
💻 سورسکد و امکان مشارکت در گیتهاب:
https://lnkd.in/d_aAuykd
@nazari2079 ممد زده:
🔥9🍾2
Forwarded from 🎄 DevTwitter | توییت برنامه نویسی
هوک جدید Next.js که میتونه چند لول UX اپ شمارو بهتر کنه.
اسمش useLinkStatus هست و میاد و وضعیت لودینگ کامپوننت Link والدش رو مشخص میکنه و اگر درحال لودینگ بود pending رو true بر میگردونه.
به این صورت دغدغه بزرگ لودینگ پیج ها حل میشه و متونیم به راحتی در UI به کاربر نمایشش بدیم.
لینک رفرنس:
https://nextjs.org/docs/app/api-reference/functions/use-link-status
@DevTwitter | <Farzad Vahdati/>
اسمش useLinkStatus هست و میاد و وضعیت لودینگ کامپوننت Link والدش رو مشخص میکنه و اگر درحال لودینگ بود pending رو true بر میگردونه.
به این صورت دغدغه بزرگ لودینگ پیج ها حل میشه و متونیم به راحتی در UI به کاربر نمایشش بدیم.
لینک رفرنس:
https://nextjs.org/docs/app/api-reference/functions/use-link-status
@DevTwitter | <Farzad Vahdati/>
🔥8
Forwarded from FullstacksJS — Academy
حدف ۴ صفر از واحد پول کشور، چه چالشهایی برای مهندسان نرمافزار به وجود میاره و چطور مدیریتش کنیم؟
#exp
#exp
🔥5💯1
Forwarded from فرانت چپتر 🥕
🎮 ایونت حضوری منتینو: تقویت مهارتهای نرم برای برنامهنویسها
یه تجربه متفاوت و کاربردی برای برنامهنویسها و فعالای دنیای تکنولوژی!
توی این رویداد علاوه بر یه بازی گروهی جذاب که مخصوص تمرین مهارتهای نرم کلیدی برای برنامهنویسها طراحی شده، یه پنل گفتوگوی تخصصی هم داریم.
چی در انتظارتونه؟
✨ بازی گروهی تعاملی برای تمرین واقعی مهارتهایی مثل:
✨ کار تیمی
✨ ارتباط مؤثر
✨ حل مسئله
✨ تصمیمگیری درست
رو بهطور واقعی تمرین و تقویت میکنی.
👥 فرصت عالی برای شبکهسازی با آدمای همفکر و هممسیر توی حوزه برنامهنویسی و تکنولوژی
💬 پنل گفتوگو با چند نفر از افراد باتجربه حوزه نرمافزار درباره نقش مهارتهای نرم در رشد شغلی برنامهنویسها
🚀 چند ساعتی کنار هم بازی میکنیم، یاد میگیریم، تجربه ردوبدل میکنیم و کلی کانکشن حرفهای میزنیم.
📅 جمعه ۱۸ مهر
🕒 ساعت ۱۵ تا ۲۰
📍 تهران
🎟 ظرفیت محدوده — همین الان ثبتنام کن!
https://menteeno.app/fa/event/
منتظر حضور گرمتون در ایونت هستیم 🌱
یه تجربه متفاوت و کاربردی برای برنامهنویسها و فعالای دنیای تکنولوژی!
توی این رویداد علاوه بر یه بازی گروهی جذاب که مخصوص تمرین مهارتهای نرم کلیدی برای برنامهنویسها طراحی شده، یه پنل گفتوگوی تخصصی هم داریم.
چی در انتظارتونه؟
✨ بازی گروهی تعاملی برای تمرین واقعی مهارتهایی مثل:
✨ کار تیمی
✨ ارتباط مؤثر
✨ حل مسئله
✨ تصمیمگیری درست
رو بهطور واقعی تمرین و تقویت میکنی.
👥 فرصت عالی برای شبکهسازی با آدمای همفکر و هممسیر توی حوزه برنامهنویسی و تکنولوژی
💬 پنل گفتوگو با چند نفر از افراد باتجربه حوزه نرمافزار درباره نقش مهارتهای نرم در رشد شغلی برنامهنویسها
🚀 چند ساعتی کنار هم بازی میکنیم، یاد میگیریم، تجربه ردوبدل میکنیم و کلی کانکشن حرفهای میزنیم.
📅 جمعه ۱۸ مهر
🕒 ساعت ۱۵ تا ۲۰
📍 تهران
🎟 ظرفیت محدوده — همین الان ثبتنام کن!
https://menteeno.app/fa/event/
منتظر حضور گرمتون در ایونت هستیم 🌱
🔥4
فرانت چپتر 🥕
🎮 ایونت حضوری منتینو: تقویت مهارتهای نرم برای برنامهنویسها یه تجربه متفاوت و کاربردی برای برنامهنویسها و فعالای دنیای تکنولوژی! توی این رویداد علاوه بر یه بازی گروهی جذاب که مخصوص تمرین مهارتهای نرم کلیدی برای برنامهنویسها طراحی شده، یه پنل گفتوگوی…
رفقا خودمم اگه برسم میام
صالح عزیز لطف مرد یه کد تخفیف هم داد خواستید استفاده کنید.
کد تخفیف
صالح عزیز لطف مرد یه کد تخفیف هم داد خواستید استفاده کنید.
کد تخفیف
ArminShaikhy
🥂🔥4
Forwarded from 🎄 DevTwitter | توییت برنامه نویسی
This media is not supported in your browser
VIEW IN TELEGRAM
گوگل دوباره داره برای دوره ۵ روزه AI Agents ثبت نام میکنه که از ۱۰ نوامبر شروع میشه. دوره قبلیش لینکش تو همین وب سایت هست که میتونید برید و همه مطالبش را استفاده کنید. ولی دوره جدید موضوعاتش خیلی خیلی جالبند. حتما ثبت نام کنید.
Link: https://rsvp.withgoogle.com/events/google-ai-agents-intensive_2025
@DevTwitter | <Mehdi Allahyari/>
Link: https://rsvp.withgoogle.com/events/google-ai-agents-intensive_2025
@DevTwitter | <Mehdi Allahyari/>
🔥4
Just got my ticket for Next.js Conf 2025 - claim yours!
https://nextjs.org/conf/ticket/t2sdMzbwgV?v=1
https://nextjs.org/conf/ticket/t2sdMzbwgV?v=1
🔥7