מפתחי פרונטאנד: אמצו יתום עוד היום!

עודכן ב: 27 אוג 2019

כתב: אמנון שדה - מפתח פרונטאנד, HERE Mobility


דיסקליימר מנהלות קהילה: הפוסט הזה עוסק בנקודה אחת קטנטנה שבה פיתוח ומיקרו-קופי נפגשים, והוא מציע כלי שיוכל לעזור למפתחים להיפטר מבעיה טורדנית. אם אתם לא מתחום הפיתוח, ייתכן מאוד שתיתקלו בכמה מונחים זרים בדרך :)


פיתוח פרונטאנד מתקשר לרוב עם שימוש ב-HTML, ב-CSS וב-JS כדי לבנות יישומי רשת.

הקישור הזה מדגיש את ה-איך, אבל לא את ה-למה.

המהות האמיתית של פיתוח פרונטאנד היא לבנות יישומי רשת כדי שהמשתמשים יוכלו להשלים משימה כלשהי: ליצור תוכנית תזונה, להזמין נסיעה או לנצח את חבריהם בחידון.


למשתמשים לא אכפת אם לתגיות ה-img יש סגירה עצמית, אם פריסת הדף מבוססת על grid או flex, או באיזו מערכת ניהול מצבים היישום פועל.


למשתמשים כן אכפת מהמאמץ שהם צריכים להשקיע כדי להשלים את המשימה.


זו הסיבה שלי אכפת מעיצובים פשוטים, ממשקים עקביים, תהליכים אינטואיטיביים, קריאות, נגישות, וכו'. אני מאמין שלהקל עליהם עד כמה שאפשר בהשלמת המשימה שלהם - זה חלק מהגדרת התפקיד שלי.



מקרה לדוגמה: מניעת מילים יתומות


מילה נחשבת יתומה אם היא המילה האחרונה במסר כתוב והיא לא נכנסת בשורה אחת עם המילה שלפניה. כלומר בשורה האחרונה יש רק מילה אחת בודדה.


קריאת מסר כזה דורשת מעט יותר מאמץ קוגניטיבי, וזה גם לא אסתטי. במקרה כזה אני מעדיף להעביר גם את המילה הלפני אחרונה לשורה החדשה.




פתרונות אפשריים


אולי הייתם מצפים שיהיה ניתן לפתור את העניין בהגדרות עיצוב, ואכן יש משתנה לשליטה בשורות יתומות, אך למרבה הצער, אני לא מכיר משהו דומה ברמת המילה.


האפשרות היחידה לפיכך היא להדביק יחד את שתי המילים האחרונות על ידי החלפת הרווח ביניהן בכזה שאינו ניתן לשבירה, וכך לגרום לדפדפן להתייחס אליהן כאל מילה אחת.


מעבר על קובץ המסרים (מסוג resource או json או מה שזה לא יהיה בפרויקט שלכם) ושינוי ידני - מועד לפורענות ולטעויות. יתרה מזאת, אם היישום עובר תהליך לוקליזציה, הרי שהרווחים המיוחדים האלה עלולים ללכת לאיבוד בתרגום.


מאחר שממילא יש לי פונקציה שמחזירה מסר על פי המפתח שלו, הגישה שלי היא להוסיף באותו מעמד החלפה אוטומטית. אם אתם משתמשים באנגולר, ניתן להגדיר אותה בתור pipe.


הערה: אני מודע לעלות החבויה בשימוש ב-split וב-replace. המסר הכי ארוך בפרויקטים שלי הוא פחות מ-200 תווים ולכן העלות הזאת זניחה.


אמ;לק

שפרו מעט את יישום הרשת שלכם בכך שתמנעו מילים יתומות על ידי שימוש בקטע הקוד שלמעלה.


על הכותב

אמנון שדה - מפתח פרונטאנד, HERE Mobility.

לוקח באופן אישי* כתיבת קוד צד לקוח, כמו גם חוויית משתמש, בינאום, נגישות וכל מה שקשור.

(* זה מבוסס על מה שכתבתי על עצמי במדיום. איך מתרגמים Passionate?)

דברו איתנו ב-microcopim@gmail.com  

כל הזכויות שמורות לכנרת יפרח, רעות מלובני וסתיו מורן-לשם