دوره آموزشی رندر کردن دادهها در React
31 دقیقهمتوسط2025-05-07
مدرسین
Maaike van Putten
Trainer and Developer for Java, Python, Spring Boot, and More
جزئیات دوره
این دوره بهت یاد میده چطوری دادهها رو توی برنامههای React نشون بدی. اول با چیزای ساده شروع میکنیم، مثل نمایش دادههای ثابت و استاتیک. بعد میریم سراغ چیزهای پیچیدهتر مثل کار با آرایهها، دادههای تو در تو و منطق شرطی که باعث میشه صفحه وبات هوشمند و تعاملی بشه.
همچنین یاد میگیری چطوری دادهها رو فیلتر و مرتب کنی تا کاربر بتونه راحتتر اطلاعات رو ببینه و صفحه کاربرپسندتر بشه. یکی دیگه از نکات مهم اینه که چطور صفحهبندی (pagination) اضافه کنی تا وقتی لیستها بزرگ شدن، اپلیکیشنات همچنان سریع و روان بمونه و کاربر رو خسته نکنه.
بعد از هر بخش هم میتونی تمرین کنی و چیزایی که یاد گرفتی رو عملی انجام بدی تا مطمئن بشی کامل یاد گرفتی.
اهداف یادگیری
نمایش دادههای ثابت و پویا توی رابط کاربری
کار با فیلتر کردن، مرتبسازی و رندر شرطی برای ساخت رابط کاربری تعاملی و دینامیک
تقسیم دادهها به صفحات برای حفظ عملکرد خوب اپلیکیشن و تجربه کاربری بهتر
همچنین یاد میگیری چطوری دادهها رو فیلتر و مرتب کنی تا کاربر بتونه راحتتر اطلاعات رو ببینه و صفحه کاربرپسندتر بشه. یکی دیگه از نکات مهم اینه که چطور صفحهبندی (pagination) اضافه کنی تا وقتی لیستها بزرگ شدن، اپلیکیشنات همچنان سریع و روان بمونه و کاربر رو خسته نکنه.
بعد از هر بخش هم میتونی تمرین کنی و چیزایی که یاد گرفتی رو عملی انجام بدی تا مطمئن بشی کامل یاد گرفتی.
اهداف یادگیری
نمایش دادههای ثابت و پویا توی رابط کاربری
کار با فیلتر کردن، مرتبسازی و رندر شرطی برای ساخت رابط کاربری تعاملی و دینامیک
تقسیم دادهها به صفحات برای حفظ عملکرد خوب اپلیکیشن و تجربه کاربری بهتر
مهارت ها
React.jsMetaFront-End Web DevelopmentWeb DevelopmentOne-Off
سرفصل ها
۰. مقدمه
- 01 - رندر کردن دادهها در React
- 02 - آنچه باید بدانید
- 03 - تور CoderPad
۱. رندر کردن دادههای استاتیک
- 04 - مبانی رندر کردن دادههای استاتیک
- 05 - راهکار - دریافت و نمایش props
۲. نمایش فهرست دادهها
- 06 - رندر کردن لیستها با کلیدها
- 07 - راه حل - استفاده از map برای رندر کردن آرایهها
۳. رندرینگ شرطی
- 08 - رندر کردن عناصر بر اساس شرایط
- 09 - راه حل - ارائه مشروط یک لیست
۴. رندر کردن دادههای تو در تو
- 10 - رندر کردن دادههای تو در تو
- 11 - راه حل - ارائه لیستی از اشیاء
۵. فیلتر کردن دادهها
- 12 - استفاده از تابع فیلتر برای رندر کردن دادههای فیلتر شده
- 13 - راه حل - فیلتر کردن یک لیست به صورت بلادرنگ
6. مرتبسازی دادهها
- 14 - رندر مجدد دادههای مرتبشده هنگام تغییر ترتیب
- 15 - راه حل - لیست اشیاء را بر اساس حروف الفبا مرتب کنید
۷. صفحهبندی دادهها
- 16 - تقسیم دادهها به صفحات
- 17 - راه حل - فقط پنج مورد در یک زمان
نتیجهگیری
- 18 - سایر مباحث React برای بررسی
دوره های مرتبط
- دوره آموزشی ساخت کتابخانههای مقیاسپذیر کامپوننتهای رابط کاربری React با استفاده از Storybook
- دوره آموزشی چالشهای کدنویسی پیشرفته React
- دوره آموزشی ریاکت تعاملی برای وب
- دوره آموزشی احراز هویت در React
- دوره آموزشی تمرین React برای مبتدیها: ساخت و تغییر کامپوننتهای پایه
- دوره آموزشی الگوهای طراحی React
- دوره آموزشی معماری میکرو فرانتاند با React
- دوره آموزشی React در عمل: از تنظیمات تا استقرار