در این پروژه، شما باید یک اپلیکیشن مدیریت یادداشت بسازید که یادداشتها را از یک Fake API دریافت کرده و با قابلیت اسکرول بینهایت (Infinite Scroll) نمایش دهد.
فایلهای HTML، CSS و دادههای اولیه در اختیار شما قرار گرفتهاند.
وظیفهی شما پیادهسازی کامل فایل app.js است.
(تغییر فایلهای HTML/CSS مجاز است، به شرطی که قابلیتهای اصلی حفظ شوند.)
شما باید یک ماژول بسازید که رفتار یک API واقعی را شبیهسازی کند:
- هر درخواست باید یک Promise برگرداند.
- هر درخواست باید دارای تأخیر بین ۳۰۰ تا ۸۰۰ میلیثانیه باشد (شبیهسازی تاخیر شبکه).
- API باید از pagination پشتیبانی کند. (پارامترهای
pageوlimit) - قابلیت فیلتر بر اساس دستهبندی و جستجو در متن را داشته باشد.
API باید از عملیات کامل CRUD پشتیبانی کند:
- ایجاد (Create)
- خواندن (Read)
- ویرایش (Update)
- حذف (Delete)
ذخیره نتایج باید در LocalStorage انجام شود.
- در صورتی که API با خطا مواجه شد و کش موجود بود، باید دادههای کشی نمایش داده شوند (Fallback to cache).
- بعد از هر عملیات CRUD، کش باید Invalidate شود (یعنی پاک و دوباره ساخته شود).
مثال مشکل:
کاربر فیلتر "Work" را انتخاب میکند (Request A) و بلافاصله فیلتر "Personal" را میزند (Request B).
اگر پاسخ Request A دیرتر از Request B برسد، نتایج اشتباه نمایش داده خواهند شد.
باید مکانیزمی پیادهسازی شود که از این حالت جلوگیری کند و تنها آخرین درخواست معتبر نمایش داده شود.
- طراحی اولیه را میتوانید آزادانه بهبود دهید.
- هدف، شبیهسازی یک رفتار واقعی از تعامل کاربر با API است.
- پیادهسازی تمیز، خوانا و قابل نگهداری امتیاز بالاتری دارد.