תרגיל 24 - תוכנת צ'אט - חלק 1

תמלול ההרצאה: תרגיל 24 - תוכנת צ'אט - חלק 1

הטקסט המלא של הדקות הראשונות בהרצאה «תרגיל 24 - תוכנת צ'אט - חלק 1» בקורס הווידאו של PracticU – כתוביות בעברית עם זמן התחלה לכל פסקה. כך תוכלו לקרוא ולחפש את הנושאים לפני שמתחילים ללמוד.

1. 00:03

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

2. 00:30

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

3. 01:00

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

4. 01:27

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

5. 01:37

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

6. 01:59

   זה n, זה יוניקוד. var זה אומר משתנה, variable. זה אומר, כמות האותיות יכולה להיות פחות מ-2000, אבל בתוך הדיסק הוא לא יתפוס 2000 מקומות אלא יתפוס רק לפי הצורך.

7. 02:15

   זאת אומרת, ברגע שאני עושה, יכולתי לעשות גם nchar, אם הייתי עושה n-char אז הוא היה תופס תמיד 2000 מקומות, זאת אומרת היה משלים רווחים בסוף, נניח מילה קצרה, נניח כתבתי הודעה קצרה, הוא היה משלים לי עוד איזה 1500 רווחים בסוף.

8. 02:31

   אני לא רוצה לשמור סתם רווחים, אז אני רוצה שהוא ישמור בדיוק את הגודל שצריך, n-char, וchar זה אותיות, כן?

9. 02:40

   לעומת זאת, תראו, יכלתי לעשות char 2000, אם אני עושה char 2000 זה רק 2000 אותיות, זה אומר רק אנגלית, כן?

10. 02:48

    אם אני אעשה n-char זה גם עברית, וגם רוסית אבל זה תמיד אלפיים אם אני אעשה nvarchar הוא ישמור את האלפיים אבל לא תמיד אלפיים הוא ישמור גם פחות מאלפיים זאת אומרת הוא לא ישלים לי רווחים מיותרים בקיצור תמיד תשתמשו ב-nvarchar בוא נעשה עוד message time מתי הודעה נרשמה day time שהוא ישמור לי את היום ואת השעה של ההודעה אני אכתוב שזה שדה חובה אלא הוא נעל זה שדה חובה נוסיף עוד שדה user ID טוב שנייה

11. 03:28

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

12. 03:55

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

13. 04:11

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

14. 04:28

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

15. 04:39

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

16. 05:00

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

17. 05:13

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

18. 05:45

    have javascript javascript lectures נניח מישהו שואל האם יש לנו הרצאות ב-javascript נניח שזה צ'אט לאתר של פרקטיקיו ואני אומר לו אתם רואים מה זה אומר כזה דבר זה אומר שזה עוד לא נשמר אתם רואים המידע השתנה אבל has not been committed זה אומר שזה עוד לא בוצע טיים איך אנחנו כותבים זמן

19. 06:17

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

20. 06:50

    זה היוזר שאל את זה לא אופרטור יופי message ID אני לא מכניס אתם רואים אני לא יכול להכניס פה שום דבר לא יכול yes we have we actually the best video הנה זה מה שענה לו המפעיל שלנו והוא ענה את זה ב-2017 ב-02 עקב 06 הוא שאל אותו ב-12 בלילה והוא ענה לו ב-12 ושתי דקות והוא ענה לו ב-12 ושתי דקות וזה אותו יוזר זו שיחה עם אותו בן אדם אז זה אותו מזהה וזה נהיה true אוקיי זה אותו יוזר

21. 07:42

    ונכנס פה יוזר חדש פתאום יש פה יוזר חדש ששואל שאלה לדוגמה can I get discount coupon והוא שאל את זה ב-02 נניח 06 ב-00 אחרי 17 דקות ב-00 שניות והאופרטור ענה לו sorry we have same prices for everybody והמפעיל ענה לו ממש מהר ב-00 17 20 שניות לאותו בן אדם ואחרי זה המפעיל כתב לו

22. 08:49

    פה לראשון, כן, I help you, can I help you? Do you have any, do you have other questions, any other questions? ואז המפעיל עונה לו ב-0, 2, 0, 16, 0, 0, כבר לא יודע מה, ב-17, 27, אחרי 7 שניות, ל-1, 1, 1, 1, הוא ענה לראשון.

23. 09:33

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

24. 09:50

    אז בואו נפתח ויז'ואל סטודיו ונתחיל עכשיו לחבר את כל זה לג'אווה סקריפט ו-HTML ונעשה קצת שרת קודם. הנה הוויז'ואל סטודיו שלי ואנחנו ממשיכים, עושים File, New, Project, פרויקט חדש, בוחרים פה SP Web, אם אתם לא מוצאים SP-Web, אתם יכולים לבוא ל-C-Sharp ולכתוב פה ב-Search SP, אוקיי?

25. 10:23

    SP.NET C-Sharp, שימו לב, לא Visual Basic, C-Sharp, אוקיי? אז אתם בוחרים, או שאתם הולכים ל-Web ובוחרים את זה פה, זה לא משנה, זה הכל אותו דבר.

26. 10:34

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

27. 10:54

    אני אומר לו, תעשה לי פרויקט ריק, אל תעשה לי פרויקט מוכן, אבל תעשה לי רפרנס, הפניות, הכנות ל-Web API.

28. 11:03

    מה זה MVC ו-Web API? זה די אותו דבר, הלקוח מגיע לקונטרולר, שזה C, קונטרולר הולך ל-M, מודל, ולוקח נתונים, ומחזיר חזרה לאנשים את הנתונים שהוא לקח במודל.

29. 11:20

    זה גם Web API וגם MVC. מה ההבדל ביניהם? שב-MVC יש את ה-V, V זה אומר View, מה זה אומר? זה אומר שה-MVC מחזיר לבן אדם, למי שקרא לו HTML מוכן, הוא מחזיר לו HTML. Web API לא מחזיר HTML, הוא מחזיר נתונים גולמיים, זאת אומרת סתם נתונים עם פסיקים ביניהם, מה שנקרא JSON. הוא מחזיר נטו נתונים.

30. 11:49

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

31. 12:14

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

32. 12:35

    אני אשתמש ב-Web API כשאני משתמש ב-Web API השרת תפקידו לתת רק מידע גולמי ואחרי זה מתכנתים אחרים או אפליקציה אחרת יוכלו לעשות עם הנתונים האלו מה שבא לי מה שבא להם אנחנו נבנה Web API כי אנחנו רוצים שהצ'אט שלנו יהיה אוניברסלי ואחרי זה נעשה עוד עבודה ונבנה את ה-HTML ו-JavaScript

33. 13:02

    כאילו לא קשורים לשרת הבנתם כאילו יש פה שני כובעים קצת שרת קצת לקוח פה את שני הכובעים לובש השרת עצמו אז נעשה web api ויש לנו פה פרויקט ריק אתם יכולים לראות שבפרויקט הריק הלקוח גולש לקונטרולרס הקונטרולר הולך למודל לוקח את המידע ומחזיר חזרה ללקוח בקונטרולרס ב-mvc יש גם תיקייה של view שה-view הזה זה בעצם html בעצם השרת מכין את ה- html יפה מאוד כרגע אין לי שום קונטרולר ואין ללקוח לאן לגלוש זה סתם הכנות ריקות

34. 13:50

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

35. 14:15

    ואני משתמש במשהו שנקרא אנטיטי פריימוורק מה זה אנטיטי פריימוורק, EF אנטיטי פריימוורק אתם יכולים לראות ADO.NET. זו מערכת שאוטומטית יודעת להתחבר לדאטאבייס, לשלוף משם נתונים ולהפוך אותם לאובייקטים של C-Sharp שאני יכול לעבוד איתם.

36. 14:38

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