PracticU

אפליקציה ראשונה ב-Node.js

בלי כתוביותעם כתוביות
PracticU › קורס NodeJS › אפליקציה ראשונה ב-Node.js
מילון מושגים:
Node.js - סביבת ריצה שמאפשרת להריץ קוד JavaScript מחוץ לדפדפן, בעיקר בצד השרת.
תיקייה - מכל במערכת הקבצים שמשמש לארגון קבצים ותיקיות אחרות בתוך מבנה היררכי.
JavaScript - שפת תכנות שרצה בעיקר בדפדפן ומוסיפה אינטראקטיביות לדפי אינטרנט. רצה גם בצד השרת באמצעות Node.js.
CMD - שורת הפקודה הקלאסית של Windows (Command Prompt), להרצת פקודות ותוכניות בממשק טקסטואלי.
טרמינל - חלון או תוכנה שמספקים ממשק שורת פקודה להקלדת פקודות למערכת ההפעלה.
תנאי - ביטוי לוגי בקוד שתוצאתו אמת או שקר, וקובע אילו פקודות יתבצעו בהתאם לערכו.
לולאה - מבנה בקרה שחוזר על קטע קוד שוב ושוב כל עוד תנאי מתקיים או עבור כל פריט באוסף.
דפדפן - תוכנה שמציגה דפי אינטרנט ומריצה את הקוד שבהם, ומאפשרת לגלוש בין אתרים, למשל Chrome או Firefox.

אפליקציה ראשונה ב-Node.js
נבנה את האפליקציה הראשונה ב-Node.js: תיקייה עם קובץ JavaScript שמדפיס טקסט למסך.
הכנת הפרויקט
1. התיקייה: בכונן C, בתוך התיקייה Projects, יוצרים תיקייה חדשה בשם Hello World.
2. פתיחה ב-VS Code: אפשר לפתוח את התיקייה בעזרת Open with Code בתפריט הקליק הימני (האפשרות הזאת צריכה להיות מסומנת בזמן ההתקנה של Visual Studio Code), או לפתוח cmd בתוך התיקייה ולהקליד code ., או לפתוח את התוכנה ולבחור Open Folder.
הקובץ הראשון והרצה
3. קובץ app.js: בתיקייה יוצרים קובץ בשם app.js ובו console.log("Hello World"). console.log מציג מידע על המסך.
4. הרצה: מהטרמינל מריצים node app.js (אפשר גם node app). מקש החץ למעלה מחזיר את הפקודה האחרונה.
5. טרמינל פנימי: Ctrl ו-backtick פותחים טרמינל ב-VS Code, ושם מריצים את אותן פקודות.
מה עובד ומה לא
ב-Node.js עובדות כל הפקודות הרגילות של JavaScript: משתנים, תנאים ולולאות. המשתנים נכתבים עם let ו-const. את var כבר לא משתמשים בדרך כלל, כי יש לו חסרונות. let מתאים כשהערך משתנה, ו-const כשהערך נקבע פעם אחת.
אין ב-Node.js פקודות של הדפדפן. alert, window ו-document נכשלים עם השגיאה is not defined, כי אין כאן דפדפן. VS Code מציע אותן באינטליסנס כי הוא מכיר JavaScript, אבל הן לא קיימות בסביבת Node.js.
כך בונים ומריצים אפליקציה פשוטה של Node.js בלי דפדפן.
השיעור הבא בקורס: יצירת קובץ Package.json

פרקי ההרצאה: אפליקציה ראשונה ב-Node.js

  1. 00:00

    הכנת תיקייה ופתיחתה ב-Visual Studio Code

  2. 02:19

    כתיבת קובץ app.js והרצתו עם Node

  3. 03:37

    הטרמינל המובנה והמשתנים var let const

  4. 04:57

    לולאות ותנאים בסביבת Node.js

  5. 05:36

    הבדל בין Node.js לדפדפן ואובייקט window

תמלול ההרצאה: אפליקציה ראשונה ב-Node.js

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

  1. 00:02

    וכעת אנחנו מוכנים לבנות את האפליקציה הראשונה שלנו ב-Node.js. אז בואו ניכנס לסייר הקבצים, ובסייר הקבצים יש לי פה איזושהי תיקייה בקונן C שנקראת Projects, ובתוכה אני רוצה לבנות תיקייה חדשה.

  2. 00:21

    בואו נלך ל-New Folder ונקרא לתיקייה הזאת Hello World. ואנחנו רוצים לפתוח את התיקייה הזאת בסביבת הפיתוח. אז אני אעבוד עם סביבת הפיתוח של Visual Studio Code, אבל אתם מוזמנים לעבוד עם כל סביבת פיתוח שאתם רוצים.

  3. 00:48

    Visual Studio Code היא פשוט מאוד נוחה וכל הזמן מתעדכנת ומקבלת שיפורים, ולכן היא מאוד פופולרית בעולם. אז יש כמה שיטות לפתוח את התיקייה ב-Visual Studio Code.

  4. 01:02

    השיטה הכי פשוטה תהיה מקש ימני ובחירה ב-Open with Code, בכדי שתהיה לכם את האופציה הזאת בזמן ההתקנה של Visual Studio Code, הייתם צריכים לסמן איזשהו V שמה בכדי שהוא יכניס לכם את האופציה הזאת בתפריט במקש ימני.

  5. 01:24

    אז זאתי שיטה כמובן ראשונה והכי פשוטה. בואו נראה שיטה נוספת. שיטה שנייה היא להיכנס לתוך Hello World, לתוך התיקייה הזאת, לסמן כאן את הכתובת בסייר הקבצים, לרשום cmd, enter, וזה פותח לנו את ה-command line ישירות בנתיב של התיקייה.

  6. 01:51

    במצב הזה אנחנו רושמים code.enter וזה פותח לנו את Visual Studio Code ישירות על התיקייה Hello World. שיטה שלישית היא כמובן, בואו רגע נצא מזה, לגשת ולחפש כאן את vscode למעשה זה visual studio code ולפתוח ופשוט לגשת לפייל open folder ולבחור את התיקייה עצמה.

  7. 02:23

    Select folder ויש לנו פה כמה שיטות לפתוח את visual studio code על התיקייה. כאן אנחנו יכולים לצרף קובץ ראשון בואו נקרא לו app.js ואנחנו מפתחים ב-JavaScript. אז console.log זה בעצם הפקודה שלנו בכדי להציג מידע על המסך.

  8. 02:47

    בואו נרשום Hello World בצורה כזאת, נשמור, ואנחנו רוצים להריץ את זה. בכדי להריץ את זה אנחנו צריכים את ה-Command Line. אז שוב, אנחנו יכולים להיכנס לכאן, CMD Enter, לפתוח את ה-Command Line, והפקודה שאנחנו רוצים לתת זה Node, רווח ואיזה קובץ אנחנו רוצים להריץ.

  9. 03:13

    זה יכול להיות app.js והנה אנחנו רואים את התשובה. חץ למעלה מחזיר לנו את הפקודה האחרונה או node פשוט app בלי נקודת js וזה גם כן מריץ את הקובץ הזה והנה אנחנו יכולים לראות Hello World על המסך.

  10. 03:30

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

  11. 04:03

    כל יתר הפקודות של FAT JavaScript זמינה לנו אנחנו יכולים לפתוח משתנים על ידי var x שווה 10 או על ידי let y שווה 20 או על ידי const z שווה 30. למעשה ב-JavaScript כבר לא כל כך נהוג להשתמש ב-var, יש לו כל מיני חסרונות.

  12. 04:27

    או משתמשים ב-let אם אנחנו רוצים להכניס שוב ושוב ערכים לתוך המשתנה, או ב-const אם אנחנו לא רוצים יותר להתחיל את המשתנה, כלומר להתחיל אותו פעם אחת. בואו נבצע console.log, נדפיס את x, y ו-z, נחזור לטרמינל, לחץ למעלה, enter, והנה אנחנו רואים את כל המידע.

  13. 04:51

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

  14. 05:24

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

  15. 05:47

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

  16. 06:02

    בואו נראה מה הפקודה, alert is not defined. בג'אווה סקריפט יש לנו את האובייקט וינדו. בואו ננסה לרשום משהו עם ווינדואו. לדוגמה, console.log, ווינדואו.prompt,

לקורס המלא: קורס NodeJS אונליין בעברית

ההרצאה הקודמת: התקנה של Node.js

ההרצאה הבאה: יצירת קובץ Package.json

הרצאות קשורות מקורסים אחרים

  • בונים אפליקציה ראשונה ב-Flutter
  • הדגמה של אפליקציה ראשונה - משחק הגמדים
  • שחזור node modules
  • Swarm - Node Labels

קורסים נוספים במסלול

  • קורס יסודות HTML - בניית אתר אינטרנט פשוט
  • קורס CSS 3 - בדגש על Flex & Grid
  • קורס Javascript כולל JQuery
  • קורס ג'אווה סקריפט מעשי - JavaScript
  • קורס TypeScript
  • קורס ריאקט - React