הבלוג של ינון פרק

טיפים קצרים וחדשות למתכנתים

לבנות לעצמך את הכלים

08/07/2023

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

ובכל זאת יש לא מעט יתרונות בבניית הכלים לעצמכם:

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

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

  3. בהיבט קורות החיים קל להוסיף לכלים כאלה דף פרופיל ב Github Pages ולעבות את קורות החיים עם פרויקטים אמיתיים, שאפילו יש להם משתמשים אמיתיים (טוב לפחות משתמש אחד).

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

לא את כל הכלים, ולא כל הזמן, אבל כשאפשר - לכתוב לבד כלי עבודה תמיד שווה את ההשקעה.

באגים, Best Practices ואינטואיציה

07/07/2023

באגים גורמים לבעיות אמיתיות בקוד. אלה טעויות בתוכנה שמשתמשים אמיתיים יוכלו לראות אותם במצבים מסוימים.

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

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

מכל ה-3 הכי משתלם לשפר את האינטואיציה. היכולת שלנו להבדיל בין עיקר לטפל היא המפתח לעבודה יעילה.

מי מפחד מ Chat GPT בראיונות עבודה

06/07/2023

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

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

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

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

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

היום למדתי: RANDOM ב zsh עלול להיות מבלבל

05/07/2023

ב bash המשתנה המיוחד RANDOM מוחלף במספר אקראי. לכן אפשר לכתוב קוד כזה:

$ echo $0
bash

$ echo $RANDOM
5953
$ echo $RANDOM
12763
$ echo $RANDOM
2894

וזה עובד ממש בסדר. גם בתוך Subshells המשתנה RANDOM ממשיך לעבוד ובגלל זה אפשר לכתוב גם את זה ב bash ולקבל שלוש שורות שונות בקובץ:

$ echo $0
bash

$ echo $RANDOM | tee -a numbers
3064
$ echo $RANDOM | tee -a numbers
4881
$ echo $RANDOM | tee -a numbers
6698

ב zsh ההתנהגות קצת יותר מבלבלת. בשורת הפקודה RANDOM עדיין יתקדם ויציג כל פעם מספר אחר:

$ echo $0
-zsh

$ echo $RANDOM
4402

$ echo $RANDOM
2260

$ echo $RANDOM
12200

אבל הדפסת מספר אקראי בתוך Subshell לא משנה את המצב הפנימי של יצרן המספרים האקראיים ולכן הקוד הבא ידפיס תמיד את אותם שלושה מספרים לקובץ:

$ echo $RANDOM | tee -a numbers
27376
$ echo $RANDOM | tee -a numbers
27376
$ echo $RANDOM | tee -a numbers
27376

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

ההשקעה הכי גרועה שעשיתי

04/07/2023

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

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

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

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

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

טיפ דרמטיק - עבודה עם actors אסינכרוניים

03/07/2023

דרמטיק היא ספריה להרצת משימות ברקע בפייתון. היא מאוד דומה ל celery אבל קצת יותר מתוחזקת ויודעת לעבוד טוב יותר עם משימות שצריך לתזמן לשעה מסוימת בעתיד. פועל של דרמטיק מריץ Threads, וכל Thread יודע להריץ פונקציות שנקראות Actors. דוגמת הקוד הבאה מהאתר שלהם מראה איך למשוך דף אינטרנט ולספור כמה מילים יש בו:

המשך קריאה

הפרפקציוניסט והחאפר

02/07/2023

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

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

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

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

פעם אחת מספיקה

01/07/2023

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

אחרי שכתבת אפלקיציה למובייל פעם אחת, השניה תרגיש פחות מפחידה (גם אם הקוד עצמו יהיה שונה לגמרי)

אחרי שהעברת הרצאה בכנס, הפעם הבאה מול קהל תהיה פחות מפחידה (גם אם הנושא יהיה אחר לגמרי)

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

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

עשר שנים מאוחר יותר

30/06/2023

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

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

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

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

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

האם Panda CSS הוא הדבר הגדול הבא בעיצוב לריאקט?

29/06/2023

פנדה הוא בהחלט כל מה שאפשר לדמיין כשחושבים על פריימוורק ל CSS in JS. היתרון הגדול שלו הוא התמיכה המלאה בקומפוננטות צד-שרת, כלומר בבניית כל הגדרות העיצוב בצד בתור קלאסים ושימוש אוטומטי בקלאסים אלה בתוך הקוד, בסגנון Tailwind CSS. אבל בניגוד לטיילווינד, פה יש לנו גם חיבור ל TypeScript כדי לקבל השלמה ואימות טיפוסים על כללי העיצוב ואינטגרציה טובה עם ריאקט כדי לייצר עיצובים מתוך קוד.

וכמו שאומרים קוד שווה יותר מאלף מילים, אז הנה דוגמה קטנה ל Panda בקומפוננטת ריאקט:

function App() {
  return (
    <div className={css({ background: 'red.400'})}>
      <div className={css({ fontSize: "2xl", fontWeight: 'bold' })}>Hello 🐼!</div>
    </div>
  )
}

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

ודוגמה שניה קצת יותר מתוחכמת-

function App() {
  const [clicked, setClicked] = useState(false);
  return (
    <div>
      <button
        className={css({
          color: {
            base: 'blue',
            _hover: 'green',
          },
          cursor: 'pointer',
          background: '#dadada',
          padding: '10px',
          borderRadius: '5px',
        })}
        onClick={() => setClicked(true)}
      >
        Click Here
      </button>
      <p className={css({
        color: clicked ? 'green' : 'red'
      })}>{clicked ? 'Passed' : 'Failed'}</p>
    </div>
  )
}

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

כדי לשחק עם Panda תצטרכו קודם להוסיף אותו לפרויקט ריאקט שלכם. אלה ההוראות לפרויקט שבנוי ב Vite: https://panda-css.com/docs/getting-started/vite