‫ספרי לימוד במחשבים‬ ‫כתיבה‪ :‬אורית קלינגר‪ ,‬פדות גלעדי‬ ‫מהדורה ראשונה – אוגוסט ‪0202‬‬ ‫הספר מופיע במהדורת ניסוי‪ .‬אנו מתנצלים מראש על‬ ‫טעויות אפשריות בחומר הכתוב‪.‬‬ ‫כל הזכויות שמורות להוצאת "מבט לחלונות"‪.‬‬ ‫אין להעתיק‪ ,‬לצלם או לשכפל קטעים מהספר בכל דרך שהיא‪ ,‬ללא אישור בכתב מההוצאה לאור‪.‬‬ ‫מבוא לתכנות בסביבת אינטרנט ‪ -‬מבוא‬ ‫©‬ ‫כל הזכויות שמורות ל'מבט לחלונות'‬ ‫‪1‬‬ ‫תודות‪...‬‬ ‫תודה לאלון חצרוני ושגיא לוי על העזרה בהכנת הקודים לספר ולאתר האינטרנט‪...‬‬ ‫תודה מיוחדת למורים שקראו והעירו לנו הערות מועילות‪ :‬לאלה מרינובסקי‪ ,‬לאביטל גרינולד‬ ‫לאיזבלה טבלין‪ ,‬לפריאל פרחונדה‪ ,‬לרונית אברמס‪ ,‬לרחל לודמיר‪ ,‬לאלינוער אורבך ‪...‬‬ ‫ולכם התלמידים‪ ,‬תודה מראש על הלימוד בספר במהדורה הניסויית ועל הליווי בתהליך השיפור‬ ‫והעדכון של המהדורה לקראת הוצאת המהדורה החדשה‪.‬‬ ‫כותבי הספר‬ ‫פדות גלעדי‪ :‬מבוא‪ , Java Script HTML ,‬פרויקט‬ ‫רקע מקצועי‪ :‬מתמחה בכתיבה והוצאה לאור של ספרי לימוד‪ ,‬מרצה במכללת בית ברל בחוג‬ ‫למדעי המחשב‪ ,‬יועצת בניהול ידע והקמה של אתרי אינטרנט‪.‬‬ ‫אורית קלינגר‪ ,ASP ,Java Script :‬פרויקט‬ ‫רקע מקצועי‪ :‬רכזת מחשוב ואינטרנט בקריית חינוך דרור‪ ,‬מורה מצטיינת למדעי המחשב‪,‬‬ ‫מלמדת ובוחנת ביחידה 'מבוא לתכנות בסביבת אינטרנט' החל משנת ‪( 1002‬שנה ראשונה של‬ ‫התכנית)‪.‬‬ ‫‪www.mabatl.co.il‬‬ ‫ומה באתר?‬ ‫‪ ‬קודים של דוגמאות פתורות‬ ‫‪ ‬פרויקט סיכום‬ ‫‪ ‬פרוייקטים של תלמידים‬ ‫‪ ‬הנחיות התקנה‬ ‫תלמידים ומורים יקרים!‬ ‫שעות רבות של פיתוח ומחשבה הושקעו ביצירת ספר הלימוד הזה‪ ,‬שנועד‬ ‫לסייע לכם בתכנון ובנייה של אתר בהתאמה לתכנים הכלולים בתכנית‬ ‫הלימודים‪ .‬אנא הימנעו מצילום ושיכפול לא חוקי של דפי הספר‪ ,‬כדי שנוכל‬ ‫להמשיך לתרום לכם מהידע ומהניסיון שלנו‪.‬‬ ‫‪2‬‬ ‫מבוא לתכנות בסביבת אינטרנט ‪ -‬מבוא‬ ‫©‬ ‫כל הזכויות שמורות ל'מבט לחלונות'‬ ‫מטרת הספר‬ ‫הספר מקנה את הכלים הנדרשים לבנות אתר באינטרנט לרבות מושגים הנכללת בת"ל של יחידה זו‪.‬‬ ‫בספר משולבים שאלות ותרגילים‪ ,‬שההתמודדות אתם תסייע לרכישת הידע ולרכישת היכולת‬ ‫ליישם אותו בפועל‪.‬‬ ‫למי מיועד הספר?‬ ‫הספר מיועד ל תלמידים הלומדים את היחידה השלישית בבגרות 'מבוא לתכנות בסביבת אינטרנט'‬ ‫הנדרשים לבנות אתר באינטרנט בעזרת הכלים ‪ ,Java Script ,html‬ו‪ ,ASP.NET -‬וכן לכל אדם‬ ‫שמעוניין לבנות אתר באופן פדגוגי וקל‪.‬‬ ‫תוכני הספר מותאמים לתכנית הלימודים תכנות בסביבת אינטרנט‪ ,‬וכמו כן מוצגים תכנים שלא‬ ‫נדרשים בת"ל ומהווים הרחבה‪/‬העשרה לחומר הנלמד‪.‬‬ ‫מבנה הספר‬ ‫לספר חמישה חלקים‪:‬‬ ‫‪ ‬חלק א‪ :‬הקדמה ומבוא‬ ‫‪ ‬חלק ב‪HTML :‬‬ ‫‪ ‬חלק ג‪Java Script :‬‬ ‫‪ ‬חלק ד‪.ASP.NET :‬‬ ‫‪ ‬חלק ה‪ :‬תכנון ובנייה של פרויקט אישי‬ ‫בתחילת כל חלק‪:‬‬ ‫הצגנו את הזמן המומלץ‪ ,‬המטרות‬ ‫והתכנים הנדרשים בת"ל‪.‬‬ ‫בסוף כל חלק‪:‬‬ ‫הצגנו דף המציג את הדרישות‬ ‫לפרויקט של אותו חלק‪.‬‬ ‫דרך הצגת הנושאים בספר‬ ‫‬‫‪-‬‬ ‫כל פרק מתחיל בהסבר כללי על הפקודה‪/‬התג והצורך לשימוש בהם;‬ ‫הגדרה של מושגים חדשים הקשורים לנושא;‬ ‫‬‫‬‫‪-‬‬ ‫המבנה התחבירי של ההוראה‪/‬התג ב‪;ASP.NET ,Java Script ,HTML -‬‬ ‫דוגמה פתורה – הקוד הנדרש לצד הפלט בדפדפן (בפרקים נבחרים);‬ ‫תרגיל מסכם המוקדש לבניית הפרויקט המלווה בנושא ערי ישראל‪.‬‬ ‫התרגילים בספר‬ ‫התרגילים המוצעים בכל חלק נחלקים ל‪ 3-‬סוגים‪:‬‬ ‫‪ .1‬מבחר רחב של תרגילים מדורגים ללימוד הנושא בכל חלק‪.‬‬ ‫שים ‪ : ‬הקבצים של כל נושא נשמרים בתיקייה השייכת לנושא‪ .‬למשל בתיקייה ‪html7_links‬‬ ‫נשמרים קובצי התרגילים של הנושא קישורים המוצג בפרק ‪ 7‬בחלק ‪.html‬‬ ‫‪ .2‬תרגיל מסכם לבניית אתר מלווה הספר בנושא ערי ישראל‪ .‬כל התרגילים בנושא זה נשמרים‬ ‫בתיקייה ‪.citysite‬‬ ‫‪ .3‬תרגיל מסכם עם דרישות מפורטות לפרויקט האישי לכל אחד מהחלקים‪;ASP ,JavaScript,HTML‬‬ ‫מבוא לתכנות בסביבת אינטרנט ‪ -‬מבוא‬ ‫©‬ ‫כל הזכויות שמורות ל'מבט לחלונות'‬ ‫‪3‬‬ ‫‪ ‬התכנים של המבוא כפי שמופיעים בתכנית הלימודים ‪ ......................‬עמוד ‪7‬‬ ‫‪ ‬התכנים של היחידה ‪ HTML‬כפי שמופיעים בתכנית הלימודים ‪ ..........‬עמוד ‪51‬‬ ‫‪‬‬ ‫‪‬‬ ‫‪‬‬ ‫‪‬‬ ‫‪‬‬ ‫‪‬‬ ‫‪‬‬ ‫‪‬‬ ‫נושא ‪ :1‬התחלת העבודה‪ ,‬תגים בסיסים‪ ,‬תכונות וערכים‪................‬‬ ‫נושא ‪ :2‬עיצוב טקסט והתחלה של ‪......................................... css‬‬ ‫נושא ‪ :3‬צבעים באינטרנט ‪...........................................................‬‬ ‫נושא ‪ :2‬פסקאות ורשימות ‪.........................................................‬‬ ‫נושא ‪ :5‬תמונות ‪........................................................................‬‬ ‫נושא ‪ :1‬קישורים ‪......................................................................‬‬ ‫נושא ‪ :7‬טבלאות ‪.......................................................................‬‬ ‫נושא ‪ :3‬טפסים ‪........................................................................‬‬ ‫עמוד ‪11‬‬ ‫עמוד ‪22‬‬ ‫עמוד ‪22‬‬ ‫עמוד ‪32‬‬ ‫עמוד ‪33‬‬ ‫עמוד ‪22‬‬ ‫עמוד ‪51‬‬ ‫עמוד ‪57‬‬ ‫‪ ‬נושא ‪ ............................................................................. css :2‬עמוד ‪13‬‬ ‫‪ ‬נושא ‪ :11‬יצירת תפריט אתר ‪ ......................................................‬עמוד ‪75‬‬ ‫‪ ‬דף דרישות לפרויקט לחלק ‪ ......................................... HTML -‬עמוד ‪77‬‬ ‫‪ ‬התכנים של היחידה ‪ Java Script‬כפי שמופיעים בתכנית הלימודים ‪ ...‬עמוד ‪77‬‬ ‫‪ ‬נושא ‪ :1‬מבוא ומושגים ‪ ..............................................................‬עמוד ‪73‬‬ ‫‪ ‬נושא ‪ :2‬כתיבת קוד ב‪ ...............................................JavaScript-‬עמוד ‪31‬‬ ‫‪‬‬ ‫‪‬‬ ‫‪‬‬ ‫‪‬‬ ‫‪‬‬ ‫‪‬‬ ‫‪‬‬ ‫נושא ‪ :3‬אובייקט חלון ‪ window‬ואובייקט מסמך ‪........ document‬‬ ‫נושא ‪ :2‬הוראת התנאי ‪ if‬והוראת התנאי ‪........................ switch‬‬ ‫נושא ‪ :5‬הוראות חזרה‪ -‬לולאות ‪.................................. for, while‬‬ ‫נושא ‪ :1‬פונקציות ‪.....................................................................‬‬ ‫נושא ‪ :7‬אובייקט תמונה ‪............................................................‬‬ ‫נושא ‪ :3‬טפסים ‪ -‬טיפול בטופס בצד לקוח ‪...................................‬‬ ‫נושא ‪ :2‬אובייקט מחרוזת ‪................................................ String‬‬ ‫עמוד ‪33‬‬ ‫עמוד ‪23‬‬ ‫עמוד ‪111‬‬ ‫עמוד ‪112‬‬ ‫עמוד ‪112‬‬ ‫עמוד ‪122‬‬ ‫עמוד ‪131‬‬ ‫‪ ‬נושא ‪ :11‬אובייקט התאריך (‪ .............................................. )Date‬עמוד ‪121‬‬ ‫‪ ‬נושא ‪ :11‬ביצוע מחזורי עם השיטה ‪ ............................ setInterval‬עמוד ‪123‬‬ ‫‪ ‬דף דרישות לפרויקט לחלק ‪ ..................................... JavaScript -‬עמוד ‪511‬‬ ‫‪4‬‬ ‫מבוא לתכנות בסביבת אינטרנט ‪ -‬מבוא‬ ‫©‬ ‫כל הזכויות שמורות ל'מבט לחלונות'‬ ‫הגדרה‬ ‫הגדרה‬ ‫הגדרות למושגים חדשים שנלמדים בכל פרק‬ ‫שים לב ! שים ‪‬‬ ‫שים‬ ‫‪‬‬ ‫הערה חשובה או הסבר חשוב שיש לשים לב‪...‬‬ ‫‪‬‬ ‫דוגמה פתורה‬ ‫דוגמה‬ ‫פתורה‬ ‫דוגמה פתורה בקוד ‪ , HTML‬ב‪ java script-‬או ב‪asp -‬‬ ‫חמה‬ ‫פינה‬ ‫מומלץ בחום…‬ ‫הסבר חשוב‪ ,‬המלצה על דרך פעולה‬ ‫עיין באתר‬ ‫אינטרנט‬ ‫‪‬‬ ‫‪‬‬ ‫מבנה של הוראה‪/‬אובייקט‬ ‫התחביר של התג > <‬ ‫הסבר‬ ‫הפנייה לכתובות של אתרים באינטרנט שאפשר להיעזר‬ ‫בהם בלימוד או בחיפוש חומר לימודי בנושא‬ ‫מבנה של תג בקוד ‪HTML‬‬ ‫מבנה של הוראה או אובייקט ב‪ js -‬וכן ב‪asp-‬‬ ‫הסבר ההוראה‪/‬הסבר הקוד וכו'‪...‬‬ ‫נושאים או פרקים שלא נדרשים בת"ל ומוצגים להעשרה‪.‬‬ ‫‪‬‬ ‫מופיע בפתרונות של דוגמאות פתורות – כאשר מוצג יותר‬ ‫מפתרון אחד‬ ‫נושאים‪/‬תרגילים להעשרה‪/‬הרחבת הנלמד‬ ‫‪ ‬תרגיל מסכם לאתר מלווה הספר בנושא ערי ישראל‬ ‫‪ ‬דף דרישות סיכום לדרישות – בניית האתר האישי‬ ‫במסגרת הפרויקט‪.‬‬ ‫המטרות והתכנים המופיעים בת"ל‬ ‫מבוא לתכנות בסביבת אינטרנט ‪ -‬מבוא‬ ‫©‬ ‫כל הזכויות שמורות ל'מבט לחלונות'‬ ‫‪5‬‬ ‫למורה‬ ‫הנושאים והמושגים המופיעים בתכנית הלימודים‪:‬‬ ‫‪6‬‬ ‫‪-‬‬ ‫הסבר עקרוני על התפתחות רשת האינטרנט‬ ‫‪-‬‬ ‫כתובת אינטרנט‬ ‫‪-‬‬ ‫חלוקת כתובות ‪IP‬‬ ‫‪-‬‬ ‫‪http, ftp, mail, telnet, dns, ip, tcp, url‬‬ ‫מבוא לתכנות בסביבת אינטרנט ‪ -‬מבוא‬ ‫©‬ ‫‪‬‬ ‫כל הזכויות שמורות ל'מבט לחלונות'‬ ‫הקדמה‬ ‫האינטרנט היא רשת המקשרת מחשבים רבים זה עם זה ומאפשרת העברת נתונים ביניהם‪.‬‬ ‫אפשר להתחבר אל רשת האינטרנט מכל מחשב באמצעות ספק אינטרנט‪.‬‬ ‫ספק אינטרנט הוא מחשב שמחובר בקביעות לרשת האינטרנט ומאפשר למחשבים אחרים להתחבר‬ ‫אליו מפעם לפעם ובדרך זו מאפשר להם לתקשר עם מחשבים אחרים המחוברים לרשת ולהיכנס‬ ‫לאתרים ברשת‪ .‬רבים מספקי האינטרנט משמשים גם כשרתי אינטרנט‪.‬‬ ‫שרת אינטרנט הוא מחשב שמחובר בקביעות לרשת האינטרנט ואשר מאוחסנים בו קבצים שהם‬ ‫אתרי אינטרנט‪.‬‬ ‫אתרי אינטרנט הם קבצים שבעליהם בחרו לאפשר לקהל המתחברים לרשת האינטרנט לטעון אותם‬ ‫למחשביהם האישיים‪ .‬הקבצים האלה מאוחסנים בשרתי אינטרנט והגישה אליהם אפשרית‬ ‫באמצעות כתובת האינטרנט של האתר‪.‬‬ ‫כתובת אינטרנט היא שם ייחודי של אתר אינטרנט‪ ,‬המאפשר לטעון את קובצי האתר הזה למחשב‬ ‫האישי‪.‬‬ ‫פירוט והרחבה של המושגים שהוזכרו כאן ומושגים נוספים בהמשך‪.‬‬ ‫בפרק זה נלמד‪:‬‬ ‫‪‬‬ ‫‪‬‬ ‫‪‬‬ ‫‪‬‬ ‫מושגים בסיסיים הקשורים לרשת האינטרנט (עמוד ‪;)3‬‬ ‫קצת היסטוריה של רשת האינטרנט (עמוד ‪;)2‬‬ ‫כיצד פועלת רשת האינטרנט (עמוד ‪;)11‬‬ ‫סוגים של שרתים (עמוד ‪;)13‬‬ ‫‪..........................................................................................................................‬‬ ‫‪..............................................................................................................................................‬‬ ‫‪..............................................................................................................................................‬‬ ‫‪..............................................................................................................................................‬‬ ‫מבוא לתכנות בסביבת אינטרנט ‪ -‬מבוא‬ ‫©‬ ‫כל הזכויות שמורות ל'מבט לחלונות'‬ ‫‪7‬‬ ‫הגדרה‬ ‫גלישה ברשת האינטרנט )‪(Surfing‬‬ ‫גלישה ברשת האינטרנט היא "שיטוט" וניווט בין האתרים הזמינים ברשת באמצעות תכנת הדפדפן ‪.‬‬ ‫תכנת דפדפן )‪(Browser‬‬ ‫הדפדפן הוא תכנה המאפשרת‪:‬‬ ‫‪ ‬לגלוש בין דפי האתרים באינטרנט‪.‬‬ ‫‪ ‬לטעון קבצים המיועדים להצגה ברשת האינטרנט;‬ ‫‪ ‬להציג את תכולת הקבצים למשתמש כדפי אינטרנט‪ ,‬כדי שיוכל לבצע בהם פעולות שונות;‬ ‫על דפדפנים ועל מה שביניהם‬ ‫הדפדפנים הנפוצים‪ Mozilla FireFox , Microsoft Internet Explorer :‬ו‪.Google Chrome-‬‬ ‫חברת האינטרנט הבינלאומית )‪ (W3C–World Wide Web Consortium‬אחראית לקביעת‬ ‫התקנים שכל הדפדפנים צריכים לעמוד בהם‪ .‬למרות זאת‪ ,‬קיימים הבדלים בין הדפדפנים‬ ‫השונים‪ .‬הבדל משמעותי במיוחד לגולשים לאתרים בעברית ולאלה הבונים אתרים בעברית הוא‬ ‫ההתמודדות של הדפדפן עם העברית‪.‬‬ ‫דפי אינטרנט הם התצוגות השונות של אתרי האינטרנט בדפדפן‪ .‬כל אתר מכיל בדרך‪-‬כלל כמה‬ ‫דפים‪ ,‬שהגולש מדפדף ביניהם בעזרת קישורים שבונה האתר יצר‪.‬‬ ‫קישור )‪ (Link‬בדף אינטרנט הוא טקסט או תמונה בדף‪ ,‬אשר הקשה עליהם גורמת להצגת דף‬ ‫אחר באותו אתר‪ ,‬או באתר שונה‪ .‬לעתים קישור משמש להפעלת קובץ ייחודי בתוך אותו דף‪ ,‬כגון‬ ‫קובץ קול או קובץ וידאו‪ .‬שים ‪ :‬לרוב‪ ,‬כאשר מצביעים עם העכבר על אזור מקושר סמן העכבר ‪-‬‬ ‫‪.‬‬ ‫דף בית )‪ (Home Page‬הוא הדף הראשון המופיע בחלון הדפדפן עם טעינתו‪ .‬לכל דפדפן מוגדרת‬ ‫ברירת מחדל לדף הזה‪ ,‬בדרך‪-‬כלל זהו דף באתר של היצרן של הדפדפן‪.‬‬ ‫שים ‪ :‬למושג דף בית משמעות נוספת‪ :‬מכנים כך את הדף הראשון בכל אתר‪ ,‬המשמש נקודת‬ ‫מוצא לניווט באתר‪ .‬בדרך‪-‬כלל נמצא בו פירוט של הנושאים שהאתר עוסק בהם וקישורים לדפים‬ ‫שבהם מוצגים הנושאים השונים‪.‬‬ ‫כתובת אינטרנט‬ ‫‪(IP Address) IP‬‬ ‫שרתי אינטרנט מעניקים לכל מחשב המתחבר אליהם כתובת ‪ IP‬ייחודית (ראה פירוט בעמודים ‪.)11-11‬‬ ‫הכתובת מורכבת מארבעה מספרים בין ‪ 1‬ל‪ 255-‬המופרדים ביניהם בנקודה‪ .‬לדוגמה‪192.168.0.253 :‬‬ ‫מבנה כתובת זה נקרא ‪ IPv4 -IP version 4‬וכל הרשתות מתוכננות לתמוך במבנה זה‪.‬‬ ‫בגלל הגידול במספר המשתמשים ברשת האינטרנט אוזלות הכתובות במתכונת הנוכחית‪ .‬הדור הבא‬ ‫של הכתובות ‪ ,IPv6 -‬יחליף את המבנה הקיים ויגדיל את מלאי הכתובות האופן משמעותי‪.‬‬ ‫‪(Domain Name System) DNS‬‬ ‫כתובת המורכבת ממספרים כדוגמת ‪ IP‬אינה נוחה לקריאה ובטח לא לזכירה‪ .‬בעקבות זאת פיתחה‬ ‫קהילת האינטרנט את ה‪ (Domain Name System) DNS-‬שממירה את הכתובת המספרית בכתובת‬ ‫מילולית‪ .‬במערכת זו מקצים שם תחום )‪ (domain name‬לכל ארגון או אתר‪.‬‬ ‫‪8‬‬ ‫מבוא לתכנות בסביבת אינטרנט ‪ -‬מבוא‬ ‫©‬ ‫כל הזכויות שמורות ל'מבט לחלונות'‬ ‫מבנה כתובת עם ‪ domain name‬ראה בעמוד הבא‪.‬‬ ‫מבנה הכתובת של אתר אינטרנט )‪(URL‬‬ ‫כתובת ברשת האינטרנט מורכבת מכמה חלקים‪ :‬שם הפרוטוקול‪ ,http -‬שם הרשת הכלל עולמית ‪-‬‬ ‫‪ ,www‬שם התחום של האתר )‪ ,(domain name‬סוג האתר ושם המדינה‪.‬‬ ‫‪http://www.walla.co.il‬‬ ‫שם המדינה‬ ‫קודים של מדינות‬ ‫‪ – il‬ישראל‬ ‫‪ – uk‬בריטניה‬ ‫‪ –jp‬יפן‬ ‫‪ – it‬איטליה‬ ‫‪ – fr‬צרפת‬ ‫סוג האתר‬ ‫שם התחום‬ ‫סוגי אתרים ומשמעותם‪:‬‬ ‫‪ – ac‬אקדמי‬ ‫‪ – edu‬אקדמי אמריקאי‬ ‫‪ – k12‬חינוך מגיל ‪1-13‬‬ ‫‪ – co‬מסחרי לא אמריקאי‬ ‫‪ – com‬מסחרי אמריקאי‬ ‫‪ – biz‬עסקי‬ ‫‪ – gov‬ממשלתי‬ ‫‪ – mil‬צבאי‬ ‫‪ – org‬ארגוני‬ ‫‪ – info‬מידע‬ ‫‪ – net‬ספק שירותי רשת‬ ‫‪ – muni‬עיריות ומועצות מקומיות‬ ‫שם שירות‬ ‫הגלישה של הרשת‬ ‫הכלל עולמית‬ ‫שם פרוטוקול‬ ‫התקשורת‪ .‬לא‬ ‫חובה להקליד !‬ ‫רשת האינטרנט נפרשה לראשונה בשנות השישים של המאה העשרים‪ .‬היא הייתה פרי של מחקר‬ ‫שערך משרד ההגנה האמריקני‪ ,‬ואשר נועד למצוא פתרון למניעת התופעה שרשת שלמה של מחשבים‬ ‫הייתה קורסת כאשר אחד מן המחשבים המחוברים אליה יצא מכלל פעולה‪.‬‬ ‫בעקבות הצלחת המחקר הורחב השימוש ברשת למוסדות אקדמיים בארה"ב‪ ,‬ובהמשך‪ ,‬במהלך‬ ‫שנות השמונים של המאה העשרים‪ ,‬גם למוסדות אקדמיים בעולם כולו‪.‬‬ ‫בשנת ‪ 5995‬פותחה בשוויץ המערכת המכונה ‪ ,WWW – World Wide Web‬שפישטה בהרבה את‬ ‫התפעול של הרשת ואת הקשר בין המחשבים השונים המחוברים אליה‪ .‬באותה שנה גם הוקם איגוד‬ ‫האינטרנט הבינלאומי )‪ ,(World Wide Web Consurtium‬שנועד לנהל את הרשת ולהבטיח את‬ ‫האוניברסליות שלה על‪-‬ידי יצירת תקנים אחידים וקידום השימוש בטכנולוגיות מתקדמות‪.‬‬ ‫בשנת ‪ 5991‬פותחה באוניברסיטת אילינוי שבארה"ב התכנה הראשונה שסיפקה ממשק גרפי ידידותי‬ ‫וקל לתפעול לניווט ברשת באמצעות מערכת ה‪ .WWW-‬הפיתוח הזה הביא לעלייה ניכרת במספר‬ ‫המשתמשים ברשת ולהגדלה רבה של נפח המידע שעבר בה‪.‬‬ ‫החל משנת ‪ ,5991‬עם פיתוחה של תכנת הדפדפן של ‪ ,Netscape‬שאפשרה ניווט נוח ברחבי הרשת‪,‬‬ ‫וביתר שאת עם הצטרפותה של חברת ‪ Microsoft‬עם הדפדפן ‪ Microsoft Explorer‬בשנת ‪,1221‬‬ ‫הפכה רשת האינטרנט לנגישה לכל משתמש מחשב בעולם (הרחבה בספר 'אינטרנט עולם ומלואו'‬ ‫בעמוד ‪.)11‬‬ ‫מבוא לתכנות בסביבת אינטרנט ‪ -‬מבוא‬ ‫©‬ ‫כל הזכויות שמורות ל'מבט לחלונות'‬ ‫‪9‬‬ ‫המבנה של רשת האינטרנט‬ ‫רשת האינטרנט היא רשת‪-‬על המקשרת בין רשתות מקומיות של מחשבים‪ ,‬שגם הן יכולות להיות‬ ‫רשתות‪-‬על של רשתות מחשבים מקומיות קטנות יותר‪.‬‬ ‫הישויות העיקריות ברשת האינטרנט הן מחשבי לקוח‪ ,‬ספקי אינטרנט ושרתי אינטרנט‪.‬‬ ‫מחשב לקוח הוא מחשב של לקוח פרטי או מוסדי שמתחבר אל רשת האינטרנט לצורך קבלת שירותי‬ ‫רשת‪.‬‬ ‫ספק אינטרנט הוא מחשב המכיל תכנה המתווכת בין מחשבי לקוח שמתחברים אליו לבין כל‬ ‫המחשבים האחרים ברשת‪ .‬הספק מחובר בקביעות לרשת אינטרנט‪.‬‬ ‫שרת אינטרנט הוא מחשב שמחובר בקביעות לרשת האינטרנט ועליו מותקנת תכנת שרת (תכנות‬ ‫שרת נפוצות הן‪ Apache :‬ו‪ .) IIS -‬בשרת אינטרנט מאוחסנים קבצים שהם אתרי אינטרנט‪.‬‬ ‫להלן תרשים כללי של הרשת‪ ,‬המציג את היחסים בין ספקי האינטרנט ללקוחותיהם‪:‬‬ ‫פרוטוקולים – שיטות להעברת נתונים ברשת האינטרנט‬ ‫העברת המידע בין המחשבים המחוברים לרשת האינטרנט אפשרית הודות לשימוש בשיטות‬ ‫התקשרות מוסכמות – פרוטוקולים‪.‬‬ ‫פרוטוקול הוא מערכת כללים אחידה‪ ,‬המגדירה את דרך העברת המידע בין המחשב השולח את‬ ‫הנתונים ובין המחשב המקבל אותם‪ ,‬ובכך מאפשרת התקשרות בין מחשבים מסוגים שונים‪.‬‬ ‫הפרוטוקולים המשמשים להעברת הנתונים ברשת האינטרנט נקבעים על‪-‬ידי איגוד האינטרנט‬ ‫הבינלאומי )‪.(W3C – World Wide Web Consortium‬‬ ‫‪11‬‬ ‫מבוא לתכנות בסביבת אינטרנט ‪ -‬מבוא‬ ‫©‬ ‫כל הזכויות שמורות ל'מבט לחלונות'‬ ‫הפרוטוקול ‪TCP/IP‬‬ ‫הפרוטוקול הבסיסי המשמש לתקשורת ברשת האינטרנט הוא הפרוטוקול ‪TCP/IP‬‬ ‫)‪ .(Transmission Control/Internet Protocol‬נוסף על הפרוטוקול הזה קיימים פרוטוקולים‬ ‫נוספים‪ ,‬הפועלים תחתיו ומותאמים לסוגים שונים של מידע‪ ,‬כגון הפרוטוקול ‪ ,FTP‬המשמש‬ ‫להעברת קבצים בלא לפתוח אותם והפרוטוקול ‪ SMTP‬המשמש למשלוח דואר אלקטרוני‪.‬‬ ‫בשיטה הזאת התקשורת מתנהלת תמיד בין שתי נקודות קצה‪ :‬המחשב השולח את הנתונים‬ ‫והמחשב המקבל אותם‪.‬‬ ‫הפרוטוקול ‪ TCP/IP‬מופעל באמצעות תכנה המותקנת בכל מחשב שיש לו אפשרות חיבור לאינטרנט‪.‬‬ ‫יש גם רשתות מקומיות שמשתמשות בפרוטוקול ‪ TCP/IP‬לתקשורת בין המחשבים המקושרים‬ ‫אליהן‪ .‬הפרוטוקול ‪ TCP/IP‬בנוי בשתי שכבות – ‪ TCP‬ו‪.IP-‬‬ ‫שכבת ה‪TCP-‬‬ ‫‪ TCP‬היא תכנה שיש לה תפקידים משלימים בצד השולח את המידע ובצד המקבל אותו‪.‬‬ ‫בצד השולח‪ :‬התכנה מכינה למשלוח את המידע המבוקש‪ .‬אם נחוץ‪ ,‬היא מחלקת אותו לכמה‬ ‫חבילות )‪ (Packets‬קטנות יותר‪ ,‬הנשלחות בנפרד‪ ,‬כדי לאפשר חלוקה של העומס על פני הרשת‪ .‬כל‬ ‫חבילה כזאת מזוהה באמצעות הכתובת של המחשב השולח והכתובת של המחשב הנמען‪.‬‬ ‫בצד המקבל‪ :‬התכנה "אוספת" את כל החבילות השייכות לקובץ מסוים‪ ,‬ומחברת אותן יחד מחדש‬ ‫לקובץ השלם‪.‬‬ ‫שכבת ה‪IP-‬‬ ‫‪ IP‬היא תכנה המעבירה ליעדן את החבילות שנוצרו בשכבת ה‪ TCP-‬דרך רשת האינטרנט‪ ,‬על‪-‬פי‬ ‫כתובת ה‪ IP-‬של הנמען‪ .‬כתובות ה‪ IP-‬משמשות לזיהוי המחשבים ברשת‪ .‬לכל מחשב המחובר לרשת‬ ‫יש כתובת ‪ IP‬משלו‪ .‬כתובת ‪ IP‬בנויה מסדרה של ארבעה מספרים עשרוניים‪ ,‬המופרדים זה מזה‬ ‫בנקודה‪ .‬כל אחד מן המספרים האלה הוא מספר הזיהוי של תת‪-‬רשת ברשת האינטרנט‪ ,‬והצירוף‬ ‫כולו מייצג את המיקום המלא של מחשב מסוים ברשת‪.‬‬ ‫המשתמש באינטרנט אינו מציין את הכתובת הזאת כאשר הוא מבקש להגיע לכתובת כלשהי‪ ,‬אלא‬ ‫מציין שם משמעותי – ‪ – Domain name‬של הישות שהיא מייצגת ברחבי האינטרנט‪.‬‬ ‫כתובת ה‪ IP-‬של מחשב הלקוח ניתנת לו על‪-‬ידי השרת שלו‪.‬‬ ‫כתובת ה‪ IP-‬של מחשב הלקוח יכולה להשתנות מהתקשרות להתקשרות‪ .‬יש מנהלי שרתים‬ ‫שחוסכים בכתובות ‪ IP‬ומחזיקים רק בכמות הנחוצה להם כדי לספק שירותים למספר הלקוחות‬ ‫הגדול ביותר שמתקשר אליהם בעת ובעונה אחת‪ .‬זוהי אחת מן הסיבות שלעתים‪ ,‬בשעות שיא‪ ,‬יש‬ ‫קושי להתחבר לשרת‪ .‬לשרת עצמו‪ ,‬המחובר כל הזמן לרשת האינטרנט‪ ,‬יש כתובת ‪ IP‬קבועה‪.‬‬ ‫מבוא לתכנות בסביבת אינטרנט ‪ -‬מבוא‬ ‫©‬ ‫כל הזכויות שמורות ל'מבט לחלונות'‬ ‫‪11‬‬ ‫כיצד מבררים מהי כתובת ה‪ IP -‬של המחשב‬ ‫כל רשת‪ ,‬בין אם היא מקומית או רשת האינטרנט כולה‪ ,‬מזהה את המחשבים המחוברים אליה‬ ‫באמצעות כתובת ‪ .IP‬אפשר לראות את כתובת ה‪ IP-‬שמוקצית למחשב הלקוח על‪-‬ידי הרשתות‬ ‫השונות‪ ,‬בעת שמחוברים אליהן‪ ,‬כך‪:‬‬ ‫השונות‪ ,‬בעת שמחוברים אליהן‪ ,‬כך‪:‬‬ ‫ב‪Win XP -‬‬ ‫התחל (‪  )Start‬הפעלה (‪  )Run‬בתיבה 'הפעלה' )‪ (run‬הקלד ‪ . cmd‬נפתח‬ ‫חלון שחור‪ .‬במקום בו נמצא הסמן‪ ,‬הקלד ‪ipconfig‬‬ ‫ב‪Win 7 -‬‬ ‫התחל (‪  )Start‬בתיבה החיפוש הקלד ‪ cmd‬נפתח חלון שחור‪ .‬במקום בו נמצא‬ ‫הסמן‪ ,‬הקלד ‪ipconfig‬‬ ‫(‪ ipconfig‬היא תוכנת השירות לניהול כתובות ‪ IP‬במחשב שלך)‪.‬‬ ‫התוצאה‪ :‬בחלון שנפתח יוצג מידע על מתאמי החיבורים לרשתות שמותקנים במחשב שלך‪ .‬שים לב‪,‬‬ ‫כי לכל חיבור יש כתובת ‪ IP‬שונה (אם אתה מחובר ברשת מקומית תוכל לראות גם את הכתובת‬ ‫הפנימית שלך ברשת)‪ .‬כתובת ה‪ IP-‬שמוקצית למחשב לקוח היא תמיד בין ‪192.168.0.1‬‬ ‫ל‪.192.168.0.253-‬‬ ‫עיין באתר‬ ‫אינטרנט‬ ‫דרך נוספת לברר מהי כתובת ה‪ IP -‬שלך היא גלישה לאתר כגון‪.http://whatismyip.com :‬‬ ‫כאשר המידע הנשלח באמצעות האינטרנט מחולק לכמה חבילות‪ ,‬באמצעות הפרוטוקול ‪ ,TCP‬כל‬ ‫חבילה יכולה לעבור ברשת בדרך אחרת‪ ,‬בהתאם לדרכים הזמינות ברשת‪ ,‬אבל הודות לכתובת ה‪IP-‬‬ ‫שכולן נושאות‪ ,‬כולן יגיעו ליעדן‪ .‬גם סדר הגעתן של החבילות אינו תואם בהכרח את סדר המשלוח‬ ‫שלהן‪ ,‬אבל תכנת ה‪ TCP-‬ממתינה להן במחשב הנמען‪ ,‬ולאחר שכל החבילות מגיעות‪ ,‬היא מרכיבה‬ ‫מהן מחדש את הקובץ השלם‪.‬‬ ‫‪Telnet‬‬ ‫יחד עם התקנת הפרוטוקול במחשב שלך מותקנת גם תכנית ‪ Telnet‬המאפשרת גישה מרחוק‬ ‫למחשב מארח (שרת) בעבר שימשה להתחברות למחשבים מהירים לצורך ביצוע חישובים ושליפת‬ ‫מידע‪ .‬באפשרותך להגיע לשירות ‪ Telnet‬במסלול‪ :‬התחל (‪  )Start‬הפעלה (‪ )Run‬רשום “‪”telnet‬‬ ‫‪12‬‬ ‫מבוא לתכנות בסביבת אינטרנט ‪ -‬מבוא‬ ‫©‬ ‫כל הזכויות שמורות ל'מבט לחלונות'‬ ‫מערכת שרת‪-‬לקוח – הקשר בין ספק האינטרנט למחשב האישי‬ ‫הקשר בין ספק שירותי האינטרנט לבין מחשב המקבל ממנו את השירות הזה מכונה מערכת שרת‪-‬‬ ‫לקוח‪.‬‬ ‫השרת – מקבל מן הלקוח בקשות לאספקת מידע‪ ,‬ומספק אותן;‬ ‫הלקוח – מפנה לשרת בקשות לאספקת מידע‪ ,‬מקבל אותו ומזמן אותו למשתמש‪.‬‬ ‫החיבור בין לקוח אינטרנט לבין שרת אינטרנט מתקיים באמצעות הפרוטוקול ‪Point to Point) PPP‬‬ ‫‪ – (Protocol‬נקודה לנקודה‪ ,‬המעביר מידע באמצעות קווי טלפון רגילים‪ .‬הפרוטוקול ‪ PPP‬אורז את‬ ‫החבילות שנוצרו במחשב הלקוח באמצעות הפרוטוקול ‪ TCP‬ומעביר אותן לשרת‪ ,‬שמעביר אותן‬ ‫לכתובת ה‪ IP-‬המבוקשת ברשת האינטרנט‪ ,‬או‪ ,‬להפך‪ ,‬הוא מקבל את החבילות שהתקבלו בעבור‬ ‫הלקוח‪ ,‬ושולח אותן ללקוח‪ ,‬שאצלו הן מורכבות מחדש לקובץ השלם‪.‬‬ ‫בכל אחד מן הצדדים במערכת הזאת – השרת והלקוח – מותקנת תכנה שבאמצעותה הוא ממלא את‬ ‫תפקידו‪ .‬קיימים כמה סוגים של שרתים‪ ,‬ותכנות שרת המותאמות לכל סוג‪ ,‬וכמה סוגים של תכנות‬ ‫לקוח‪ ,‬המותאמות לסוג השירות שהמשתמש נזקק לו‪.‬‬ ‫שים לב‪ :‬בגלישה לאתרי אינטרנט ה"שרת" הוא האתר אליו אנו גולשים וה"לקוח" הוא הדפדפן‪.‬‬ ‫סוגים של שרתים‬ ‫השרתים נבדלים זה מזה בסוג המידע שהם מספקים‪.‬‬ ‫שרת הרשת הכלל‪-‬עולמית – ‪(World Wide Web) WWW‬‬ ‫זהו השרת המזוהה ביותר עם רשת האינטרנט‪ .‬הוא מספק מידע במתכונת של מולטימדיה – מלל‪,‬‬ ‫תמונות‪ ,‬אנימציה וקול‪ ,‬וכן הוא כולל קישורים לדפים אחרים באמצעות גורמי קישור שהם חלק מן‬ ‫הדף )‪.(Hyper Text‬‬ ‫שרתי ‪ WWW‬מעבירים מידע באמצעות הפרוטוקול היישומי ‪(Hyper Text Transfer Protocol) HTTP‬‬ ‫– הפרוטוקול להפעלת קישורים‪.‬‬ ‫שרת דואר‬ ‫שרת הדואר‪ ,‬כשמו כן הוא‪ ,‬משמש להעברת הודעות דואר אלקטרוני בין לקוחותיו ובין המשתמשים‬ ‫האחרים ברשת האינטרנט‪ .‬כמו כן הוא מקצה ללקוחותיו תיבות דואר אלקטרוני‪ ,‬שבהן הוא‬ ‫מאחסן את ההודעות המגיעות בעבורם‪ ,‬ומאפשר להם לשלוף אותן משם כאשר הם מתקשרים אליו‪.‬‬ ‫הלקוח מתקשר אל שרת בדואר באמצעות תכנת דואר אלקטרוני‪.‬‬ ‫העברת הדואר מתבצעת באמצעות שני פרוטוקולים יישומיים‪:‬‬ ‫ הפרוטוקול ‪ (Post Office Protocol) POP‬משמש לקבלת הודעות הדואר האלקטרוני בשרת‪,‬‬ ‫ואחסונן בתיבה שהוקצתה ללקוח עד אשר זה שולף אותן‪.‬‬ ‫ הפרוטוקול ‪ (Simple Mail Transfer Protocol) SMTP‬משמש להעברת הודעות דואר אלקטרוני‬ ‫מן הלקוח למחשבים אחרים ברשת האינטרנט‪.‬‬ ‫שרת להעברת קבצים – ‪(File Transfer Protocol) FTP‬‬ ‫שרת המספק שירותים של העברת קבצים שלמים‪ ,‬בלא לפתוח אותם ובלא להציג אותם‪ .‬שרתי ‪FTP‬‬ ‫מעבירים מידע באמצעות פרוטוקול היישומי ‪ FTP‬שעל שמו הם קרואים‪.‬‬ ‫מבוא לתכנות בסביבת אינטרנט ‪ -‬מבוא‬ ‫©‬ ‫כל הזכויות שמורות ל'מבט לחלונות'‬ ‫‪13‬‬ ‫תרגילים לפרק המבוא‬ ‫תרגיל ‪ :5‬ניחוש כתובות‬ ‫א‪ .‬מהי הכתובת של הסניף האמריקאי של חברת ‪........................................................... ?IBM‬‬ ‫הסבר את בחירתך‪......................................................................................................... :‬‬ ‫ב‪ .‬מהי הכתובת של האתרים הרשמיים של עיריית תל‪-‬אביב ועיריית ירושלים?‬ ‫עיריית תל אביב‪............................................................................................................ :‬‬ ‫עיריית ירושלים‪............................................................................................................ :‬‬ ‫עיריית חיפה‪................................................................................................................. :‬‬ ‫ג‪ .‬מהי הכתובת של אוניברסיטת סטנפורד )‪......................................................... ?(Stanford‬‬ ‫הסבר את בחירתך‪........................................................................................................ :‬‬ ‫ד‪ .‬מהי הכתובת של האתר הרשמי של מדינת ישראל? ‪.............................................................‬‬ ‫הסבר את בחירתך‪......................................................................................................... :‬‬ ‫ה‪ .‬כיצד מופיע ארגון חב"ד )‪ (Chabad‬האמריקאי והישראלי ברשת? ‪........................................‬‬ ‫הסבר את בחירתך‪......................................................................................................... :‬‬ ‫תרגיל ‪ :1‬ראשי תיבות‬ ‫השלם את הטבלה שלפניך‪:‬‬ ‫ראשי תיבות‬ ‫הפירוט המלא‬ ‫‪WWW‬‬ ‫‪HTTP‬‬ ‫‪W‬‬ ‫‪ W‬הרשת הכלל עולמית‬ ‫‪W‬‬ ‫‪P‬‬ ‫‪W3C‬‬ ‫הסבר קצר במילים‬ ‫‪T‬‬ ‫‪T‬‬ ‫‪C‬‬ ‫‪H‬‬ ‫‪W3‬‬ ‫‪IP‬‬ ‫‪I‬‬ ‫‪P‬‬ ‫‪DNS‬‬ ‫‪S‬‬ ‫‪N‬‬ ‫‪D‬‬ ‫‪FTP‬‬ ‫‪P‬‬ ‫‪T‬‬ ‫‪F‬‬ ‫‪HTML‬‬ ‫‪M‬‬ ‫‪L‬‬ ‫‪JS‬‬ ‫‪T‬‬ ‫‪H‬‬ ‫‪S‬‬ ‫‪J‬‬ ‫תרגיל ‪ :3‬מה למדנו כאן?‬ ‫לפניך כמה שאלות‪ .‬ענה עליהן במחברתך‪:‬‬ ‫‪ .1‬מהו תפקידה של המילה ‪ k12‬בכתובת‪?www.snunit.k12.il :‬‬ ‫‪ .2‬במה שונה כתובת ‪ IP‬מכתובת ‪?URL‬‬ ‫‪ .3‬מהו תפקידו של הארגון ‪ ,W3C‬ומהי חשיבותו של התפקיד שהוא ממלא?‬ ‫‪ .2‬מה תפקידו של שם הפרוטוקול בכתובת ה‪ URL-‬של אתר?‬ ‫‪ .5‬באיזה פרוטוקול משתמשים להעברת דואר אלקטרוני ברשת האינטרנט?‬ ‫‪ .1‬מהו תפקידו של הפרוטוקול ‪ (Point to Point Protocol) PPP‬בתהליך של העברת הנתונים‬ ‫ברשת האינטרנט?‬ ‫תרגיל ‪ :4‬כתובת ‪IP‬‬ ‫בדוק מהי כתובת ה‪ IP -‬במחשב שלך?‬ ‫‪14‬‬ ‫מבוא לתכנות בסביבת אינטרנט ‪ -‬מבוא‬ ‫©‬ ‫כל הזכויות שמורות ל'מבט לחלונות'‬