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

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

1. ב VS Code אפשר לכתוב תוסף שמתממשק עם ה Debugger, למשל דרך https://code.visualstudio.com/api/references/vscode-api#DebugAdapterTracker

2. מתוך ה Callbacks אפשר לגלות מה הקוד שבו עצרנו, מה ערכי המשתנים ומה ה Stack Trace ברגע העצירה.

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

4. מוסיפים תיבת Chat לחלון הדיבאג ששולחת שאלות ל Chat GPT ומציגה את התשובות בחלונית.

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

נ.ב.ב. באותו נושא cursor ai לוקח כיוון אחר אבל סופר מעניין. אם לא ניסיתם אותו מאוד מומלץ. זה נראה כמו VS Code משולב עם חלון שיחה עם AI, וה AI ממש רץ על כל הקבצים ומעדכן את הקוד לפי הבקשות שלכם. אולי יום אחד הם יוסיפו תמיכה ב Debugger. בכל מקרה מאחר והם לא קוד פתוח זה לא עוזר בינתיים.

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

create_user(!!params[:quickjoin]) do |user|
  user.after_confirmation
end

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

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

clean_up_passwords resource
set_minimum_password_length
return redirect_to quickjoin_path, alert: resource.errors.full_messages.join(', ') if params[:quickjoin] == '1'

respond_with resource

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

ב Rails הפונקציה respond_with היא קיצור לזה:

def create
  @user = User.new(params[:user])
  respond_to do |format|
    if @user.save
      flash[:notice] = 'User was successfully created.'
      format.html { redirect_to(@user) }
      format.xml { render xml: @user }
    else
      format.html { render action: "new" }
      format.xml { render xml: @user }
    end
  end
end

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

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

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

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

נתונה טבלה עם פריטים שנוצרה על ידי הפקודה:

create table items(id integer primary key, name text);

INSERT INTO items (name) VALUES
    ('Item A'),
    ('Item B'),
    ('Item C'),
    ('Item A'),
    ('Item D'),
    ('Item E'),
    ('Item B'),
    ('Item F'),
    ('Item G'),
    ('Item A'); 

מחקו את כל השורות הכפולות, כלומר השאירו מקסימום שורה אחת לכל שם של פריט.

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

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

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

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

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

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

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

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

ב Rails יצרתי טבלה בבסיס הנתונים עם קוד שנראה בערך כך:

create_table :users do |t|
  t.string :username
  t.string :email
  t.timestamps
end

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

ב Sequelize הממשק דורש יותר קוד אבל עדיין הספריה מטפלת בהבדלים בין בסיסי נתונים:

'use strict';

module.exports = {
  up: async (queryInterface, Sequelize) => {
    await queryInterface.createTable('Users', {
      id: {
        type: Sequelize.INTEGER,
        autoIncrement: true,
        primaryKey: true,
        allowNull: false
      },
      username: {
        type: Sequelize.STRING,
        allowNull: false
      },
      email: {
        type: Sequelize.STRING,
        allowNull: false
      },
      createdAt: {
        type: Sequelize.DATE,
        allowNull: false,
        defaultValue: Sequelize.NOW
      },
      updatedAt: {
        type: Sequelize.DATE,
        allowNull: false,
        defaultValue: Sequelize.NOW
      }
    });
  },

  down: async (queryInterface, Sequelize) => {
    await queryInterface.dropTable('Users');
  }
};

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

export const users = mysqlTable('users', {
  id: bigint('id', { mode: 'number' }).primaryKey().autoincrement(),
  fullName: varchar('full_name', { length: 256 }),
}, (users) => ({
  nameIdx: index('name_idx').on(users.fullName),
}));

וזו מיגרציה בקיסלי שכתובה בצורה מפורשת עבור Postgresql:

  await db.schema
    .createTable('person')
    .addColumn('id', 'serial', (col) => col.primaryKey())
    .addColumn('first_name', 'varchar', (col) => col.notNull())
    .addColumn('last_name', 'varchar')
    .addColumn('gender', 'varchar(50)', (col) => col.notNull())
    .addColumn('created_at', 'timestamp', (col) =>
      col.defaultTo(sql`now()`).notNull(),
    )
    .execute()

למה הם עושים את זה? ומה עדיף?

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

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

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

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

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

את הקוד הבא לקחתי מתוך התיעוד של hono כדי להגיש קבצים סטטיים:

app.use('/client/*', serveStatic({ root: './'}));

אם ניגשים לנתיב /client/foo.js יוגש הקובץ foo.js מתוך תיקיית client. אם ניגשים ל /client/index.html יוגש הקובץ index.html ואם ניגשים לנתיב /client/ יוגש גם כן הקובץ index.html כצפוי.

אבל מה קורה אם ניגשים ל /client (בלי לוכסן בסוף)? הונו מנסה ללכת לקראתנו ואוטומטית מגיש שוב את תוכן הקובץ index.html. הבעיה היא שה URL נשאר בלי הלוכסן, ולכן אם index.html כולל הפניה לקובץ אחר ההפניה תהיה יחסית ל / ולא יחסית ל /client. לדוגמה נניח שבתוך index.html מופיעה השורה:

<link rel="stylesheet" href="style.css" />

גישה לאתר דרך הנתיב /client/ מחזירה את תוכן הקובץ index.html. בגלל שהנתיב מסתיים ב / הדפדפן מנסה לקבל את קובץ העיצוב מהנתיב /client/style.css והכל עובד. לעומת זאת גישה לאתר דרך /client עדיין מחזירה את תוכן הקובץ index.html, אבל הפעם בגלל שהתיקייה האחרונה בנתיב היא התיקייה הראשית / הדפדפן ינסה לטעון את /style.css בלי התחילית client, ייכשל והעיצוב לא יוצג.

פיתרון מהיר הוא להוסיף הפניה מ /client ל /client/ עם הקוד הזה:

app.get('/client', (c) => {
  return c.redirect('/client/', 301); // Permanent redirect
});
app.use('/client/*', serveStatic({ root: './'}));

ואם אתם מכירים פיתרונות אחרים אל תתביישו לשתף בתגובות.

הבעיה עם Chat GPT ו Code Reviews היא שאין ל GPT עדיין מספיק קונטקסט בשביל להבין למה בניתי דברים כמו שבניתי ולכן הוא ימליץ על Best Practices כלליים, גם כשזה לא הכרחי, וגם יכול לטעות ולחשוב שלא השתמשתי ב Best Practice מסוים אפילו שכן. הנה שתי דוגמאות קטנות שעזרו לי לראות מה GPT רואה ומה הוא מפספס.

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

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

2. הפרויקט משתמש בטכניקת עבודה שאף אחד לא חשב עליה קודם (זה גאוני! ידעתי שהיינו צריכים לבנות ORM בעצמנו).

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

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

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

6. קוד משתנה אבל התיעוד שמלווה אותו נשאר ללא שינוי.

7. אף אחד לא יודע איך או מתי צריך לשדרג תלויות.

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