5.4 KiB
שיפור מערכת הניתוב
הוראות
כעת, לאחר שבניתם מערכת ניתוב בסיסית, הגיע הזמן לשדרג אותה עם תכונות מקצועיות שמשפרות את חוויית המשתמש ומספקות כלים טובים יותר למפתחים. יישומים בעולם האמיתי דורשים יותר מאשר רק מעבר בין תבניות – הם זקוקים לכותרות דינמיות לדפים, hooks למחזור חיים, ואדריכלות שניתן להרחיב.
במשימה זו, תרחיבו את יישום הניתוב שלכם עם שתי תכונות חיוניות שנמצאות בדרך כלל ביישומי אינטרנט בייצור. השדרוגים הללו יהפכו את אפליקציית הבנקאות שלכם למלוטשת יותר ויספקו בסיס לפונקציונליות עתידית.
הצהרת המסלולים מכילה כרגע רק את מזהה התבנית לשימוש. אך כאשר מציגים דף חדש, לעיתים נדרש קצת יותר. בואו נשפר את יישום הניתוב שלנו עם שתי תכונות נוספות:
תכונה 1: כותרות דינמיות לדפים
מטרה: להעניק כותרות לכל תבנית ולעדכן את כותרת החלון עם הכותרת החדשה כאשר התבנית משתנה.
למה זה חשוב:
- משפר את חוויית המשתמש על ידי הצגת כותרות תיאוריות בכרטיסיות הדפדפן
- מגביר נגישות עבור קוראי מסך וטכנולוגיות מסייעות
- מספק הקשר טוב יותר לסימניות ולהיסטוריית הדפדפן
- עוקב אחר שיטות עבודה מומלצות בפיתוח אתרים מקצועי
גישה ליישום:
- הרחיבו את אובייקט המסלולים כך שיכלול מידע על כותרת עבור כל מסלול
- שנו את הפונקציה
updateRoute()כך שתעדכן אתdocument.titleבאופן דינמי - בדקו שהכותרות משתנות בצורה נכונה בעת מעבר בין מסכים
תכונה 2: Hooks למחזור חיים של מסלול
מטרה: הוסיפו אפשרות להריץ קוד לאחר שינוי התבנית. אנו רוצים להדפיס 'Dashboard is shown' בקונסולת המפתחים בכל פעם שדף לוח הבקרה מוצג.
למה זה חשוב:
- מאפשר ביצוע לוגיקה מותאמת אישית כאשר מסלולים ספציפיים נטענים
- מספק hooks לניתוח נתונים, רישום או קוד אתחול
- יוצר בסיס להתנהגויות מסלול מורכבות יותר
- מדגים את תבנית ה-observer בפיתוח אתרים
גישה ליישום:
- הוסיפו תכונת פונקציית callback אופציונלית להגדרות המסלול
- בצעו את פונקציית ה-callback (אם קיימת) לאחר השלמת הרינדור של התבנית
- וודאו שהתכונה עובדת עבור כל מסלול עם callback מוגדר
- בדקו שהודעת הקונסולה מופיעה בעת ביקור בלוח הבקרה
קריטריונים להערכה
| קריטריון | מצטיין | מספק | דורש שיפור |
|---|---|---|---|
שתי התכונות מיושמות ועובדות. הכותרת והוספת הקוד פועלות גם עבור מסלול חדש שנוסף בהצהרת ה-routes. |
שתי התכונות פועלות, אך ההתנהגות מקודדת ולא ניתנת להתאמה דרך הצהרת ה-routes. הוספת מסלול שלישי עם כותרת והוספת קוד לא עובדת או עובדת באופן חלקי. |
אחת מהתכונות חסרה או לא פועלת כראוי. |
כתב ויתור:
מסמך זה תורגם באמצעות שירות תרגום AI Co-op Translator. למרות שאנו שואפים לדיוק, יש להיות מודעים לכך שתרגומים אוטומטיים עשויים להכיל שגיאות או אי דיוקים. המסמך המקורי בשפתו המקורית צריך להיחשב כמקור סמכותי. עבור מידע קריטי, מומלץ להשתמש בתרגום מקצועי אנושי. איננו אחראים לאי הבנות או לפרשנויות שגויות הנובעות משימוש בתרגום זה.