دوره آموزشی ساخت رابط های کاربری مدرن با React Router v6
1 ساعت 14 دقیقهمبتدی2022-08-16
مدرسین

Guil Hernandez
Software Developer and Educator.
جزئیات دوره
آیا از قبل با React آشنا هستید و آماده هستید تا مهارت های خود را ارتقا دهید و رابط های کاربری مدرن بسازید؟ در این دوره آموزشی، یاد بگیرید که چگونه برنامه های React خود را با افزودن قابلیت های مسیریابی با React Router، کتابخانه مسیریابی استاندارد React گسترش دهید. مربی Guil Hernandez با مرور اصول مسیریابی و برنامه های تک صفحه ای شروع می کند. سپس برخی از مؤلفههای مفید React Router، قلابها و سایر ویژگیها را نشان میدهد که کاربران را به تمام نماهای مختلف هدایت میکند و به ایجاد رابطهای کاربری پویا کمک میکند که هر زمان که URL تغییر کند بهطور خودکار بهروزرسانی میشوند. او نحوه ایجاد مسیرهای 404 یا «یافت نشد» و همچنین نحوه عملکرد موقعیت مکان، شی تاریخ و پشته تاریخ را توضیح می دهد. Guil همچنین چندین چالش را در طول مسیر فراهم می کند تا بتوانید در حین حرکت تمرین کنید و آنچه را که یاد می گیرید ثابت کنید.
مهارت ها
Interaction DesignReact.jsMetaFront-End Web DevelopmentUser ExperienceLearningWeb Development
سرفصل ها
0. مقدمه
- 01 - ساخت رابط های کاربری مدرن
- 02 - آنچه باید در مورد React بدانید
- 03 - پروژه را راه اندازی کنید
1. مبانی مسیریابی
- 04 - اصول مسیریابی
- 05 - React Router DOM را نصب کرده و به URL مرورگر متصل شوید
- 06 - اولین مسیر خود را پیکربندی کنید
- 07 - از Link برای پیمایش بین صفحات استفاده کنید
- 08 - چالش - یک ناوبری با لینک و مسیر ایجاد کنید
- 09 - راه حل - با Link و Route یک ناوبری ایجاد کنید
2. مسیرهای تودرتو و پارامترهای URL
- 10 - مسیریابی تودرتو چگونه کار می کند
- 11 - یک مسیر 404 یا No Match ایجاد کنید
- 12 - متغیرهایی را برای ایجاد مسیرهای پویا تعریف کنید
- 13 - خواندن و نمایش پارامترهای URL
- 14 - نمایش لینک های فعال
- 15 - چالش - یک UI تودرتو از مسابقات مسیر ارائه دهید
- 16 - راه حل - یک UI تودرتو از مسابقات مسیر ارائه دهید
3. مسیریابی را ادامه دهید
- 17 - مسیرهای شاخص
- 18 - به صورت برنامه نویسی حرکت کنید
- 19 - هنگام پیمایش به صورت برنامه ای داده ها را منتقل کنید
- 20 - چالش - وضعیت موقعیت مکانی پاس
- 21 - راه حل - وضعیت محل عبور
نتیجه
- 22 - مراحل بعدی
دوره های مرتبط
- دوره آموزشی گسترش طراحی فیگما با ادوبی کریتیو کلود
- دوره آموزشی چجوری انیمیشنهای Lottie رو توی فیگما استفاده کنیم
- دوره آموزشی NET 9 Maui.: امکانات بهتر برای توسعه چندسکویی
- دوره آموزشی طراحی تعامل محصول
- دوره آموزشی طراحی آیکون: تجزیه و تحلیل فرآیند
- دوره آموزشی یادگیری جامع فیگما
- دوره آموزشی نمای کلی رابط کاربری در .NET: دسکتاپ، ASP.NET و چندسکویی
- دوره آموزشی فیگما: ساخت انیمیشنها و تعاملات