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

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

מה שחשוב הוא שאני, הוייב קודר (vibe coder) אדע היטב על מה מדובר, כדי שאוכל להנחות את ה AI למה שאני באמת רוצה.

כמו שכתבתי בהקדמה - רוב כלי ה-UI למיניהם או ספריות תוכנה מתקדמות כמו ריאקט, אנגולר, material ui, bootstrap ui ועוד ועוד נועדו לספק למתכנת כלים מתקדמים יותר ליישם עיצוב מהר יותר.

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

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

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

כאשר אנחנו מדברים על "שפות" יש לנו הרבה כאלו, שפות "דיבור", שפות "כתיבה" וכו, לדוגמא:

• שפת דיבור - לדוגמא הסלנג שלנו בכל שפה ושפה. איידיש היא כזו.
• שפת כתיבה - צורה יציבה של השפת דיבור, לדוגמא עברית מקראית. כל המילים שם הן בעלות אותה משמעות לאורך כל ההיסטוריה ועד היום, לעומת העברית המדוברת
• שפת תכנות - שפה שנועדה לקומפיילר (קומפיילר = תוכנה שממירה שפת תכנות לשפת המחשב ממש). לדוגמא JavaScript (נכתבת בקיצור JS)
• שפת עיצוב - לדוגמא CSS, זה שפה שאומרת למחשב/תוכנה האם לצבוע את הטקסט באדום או כחול, באיזה גודל, כמה מודגש, ועוד ועוד. באנגלית style language
• שפת תיאור - שפות שמתארות מידע מסויים, לדוגמא xml, json ועוד. 

שפת XML נראת ככה:

<user id="4" gender="male">Ariel</user>

אפשר לראות שהמהות היא שאמנם המשתמש נקרא "אריאל", אבל השפה מתארת את ה "מטא-דאטא" MetaData (בד"כ נקרא רק מטא meta), הינו המידע על המידע, היינו שאני גבר והמזהה שלי הוא 4.

לעומת בJSON זה היה נראה ככה:

{ users: [ { id:4, gender:"male", content:"ariel"} ] }

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

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

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

לתוכנת מחשב, אחד האפשרויות הוא WPF שמתשמש ב XAML.

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

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

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

לכן תמיד תמיד נגיד ל -AI שאנחנו רוצים לעבור רק html/css/js בסיסי, (אגב נורמאלי לכתוב את סט השפות שלכם ככה עם "/"). כמו כן עוד נגיע לצד שרת ושם נגיד לו לעבור רק פייתון והכי פשוט שיש, כי יש לפייתון כמה יתרונות עבור AI.