DIGIMATE.
חזרה לבלוג

איך בניתי לעצמי אפליקצייה יעודית לניהול הוצאותיי – ללא הבנה משמעותית בתכנות

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

רני יפרח
רני יפרח
AI Architect
26.9.2025

המסע לעבר האפליקציה הראשונה שלי !

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

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

אבל לא יצאתי מסופק מהעבודה עם הכלים האלו.

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

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

רתמתי את Gemini 2.5 Pro ויצאנו לדרך…

בקצרה – הגעתי ליעד.

ויתרה מזאת – גיליתי שזה פשוט מדהים, הנקודה אליה הגענו כרגע.

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

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

תהנו.

הקדמה: הרעיון והאתגר

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

החלטתי לצאת למסע: להשתמש ב-Gemini Pro כמנטור וכמפתח צמוד שלי. המטרה הייתה לא רק לבנות את האפליקציה, אלא להוכיח שאפשר להגיע לתוצר איכותי ושימושי באמצעות הנחיה נכונה של AI, גם אם אתה לא יודע לכתוב <div> אחד.

זהו תיעוד המסע שלנו, שלב אחר שלב.

 

פרק 1: נקודת ההתחלה – אפליקציה מקומית

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

ההנחיה הראשונה שלי ל-Gemini הייתה פשוטה:

"מצורף קובץ של אפליקציה מקומית… אני רוצה להפוך את זה לאפליקציה שתעבוד לי על כל מכשיר בעזרת Firebase."

 

פרק 2: היסודות – תיקון באגים והכנה לענן

Gemini הבין מיד את המשימה והציע תוכנית פעולה. לפני שקפצנו לענן, ביקשתי ממנו לתקן באג קטן שהיה לי בלוגיקה של "הוצאות קבועות". הוא עדכן את קוד ה-JavaScript, ובנוסף יצר עבורי את שני הקבצים החיוניים להפיכת אתר פשוט לאפליקציית ווב אמיתית: manifest.json ו-service-worker.js. הוא הסביר לי בסבלנות מה כל קובץ עושה, וכבר בשלב הזה, האפליקציה הרגישה מקצועית יותר.

 

פרק 3: המעבר לענן – הקמת התשתית ב-Firebase

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

  1. יצירת הפרויקט.
  2. הפעלת מסד הנתונים (Firestore).
  3. הפעלת מערכת ההזדהות (Authentication).
  4. קבלת "מפתחות הגישה" (firebaseConfig).

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

 

פרק 4: האתגר האמיתי – אבטחה ושיתוף

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

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

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

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

פרק 5: הפריצה – כשהאינטואיציה האנושית וה-AI נפגשים

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

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

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

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

זה עבד. בצורה מושלמת.

 

ואז – התוצר הסופי

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

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

 

החלק השני: איך להפוך את Gemini למפתח האישי שלך ב-6 שלבים

 

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

המפתח הוא לא לדעת לתכנת, אלא לדעת כיצד לנהל ולהנחות מודל שפה (LLM) כמו Gemini.

 

שלב 1: אפיון מפורט – הפיכת רעיון להנחיה (Prompt)

 

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

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

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

טיפ למקצוענים: בקשו מה-AI להיות המנטור שלכם. הנחיה טובה להתחלה יכולה להיות:

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

 

שלב 2: יצירת טיוטה ראשונה שעובדת מקומית

המטרה כאן היא להגיע למוצר מינימלי עובד (MVP) במהירות האפשרית.

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

הנחיה לדוגמה ל-Gemini:

"בוא ניצור את הגרסה הראשונה. אנא כתוב לי קובץ HTML אחד, שלם, שיכלול את כל ה-CSS וה-JavaScript הדרושים כדי להפעיל את האפליקציה. חשוב שהיא תשמור את כל הנתונים ב-localStorage של הדפדפן."

בסוף שלב זה, צריך להיות לכם קובץ index.html שאתם יכולים לפתוח בדפדפן ולראות את האפליקציה שלכם בפעולה.

 

שלב 3: המרת הגרסה המקומית לגרסה בענן

 

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

  • מה זה 'ענן'? בפשטות, זהו "כונן קשיח" ו"מחשב" שיושבים בשרתים של חברות גדולות (כמו גוגל) וזמינים מכל מקום.
  • מה זה Firebase? זוהי חבילת כלים של גוגל שמספקת למפתחים "קוביות לגו" מוכנות לבניית אפליקציות.
    במקום לבנות מסד נתונים, מערכת משתמשים ושרת אירוח מאפס, פשוט משתמשים בכלים המוכנים של Firebase.
  • הצעדים ליישום: כאן אתם נכנסים לתפקיד ה"מבצע". ה-AI ינחה אתכם בדיוק מה לעשות.

    הנחיה ל-Gemini: "אני רוצה להעביר את האפליקציה שלנו לענן של Firebase. אנא הנחה אותי צעד-אחר-צעד מה לעשות."
    ביצוע: ה-AI ינחה אתכם לפתוח חשבון ב-Firebase, ליצור פרויקט חדש, להפעיל שירותים (כמו Firestore ו-Authentication), ולקבל את "מפתחות הגישה" (firebaseConfig). תפקידכם הוא לבצע את הפעולות האלה בממשק של Firebase.
    הנחיה ל-Gemini: "הנה מפתחות הגישה שקיבלתי. אנא עדכן את קוד ה-index.html שלנו כך שישתמש ב-Firebase במקום ב-localStorage."

 

שלב 4: בדיקות, ניסויים ואיטרציות

 

זהו השלב הדינמי והחשוב ביותר. שום דבר לא עובד מושלם בפעם הראשונה. תפקידכם כעת הוא להיות בודקי התוכנה (QA) של הפרויקט.

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

 

שלב 5: התכנסות למודל אונליין עובד

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

 

שלב 6: פיתוח וקידום רעיונות חדשים

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

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

 

מכאן והלאה: שותפות עם עוצמה

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

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

בהצלחה !