הסבר על Templating Engine בנוד NodeJS

בלי כתוביותעם כתוביות

מילון מושגים:

Node.js - סביבת ריצה שמאפשרת להריץ קוד JavaScript מחוץ לדפדפן, בעיקר בצד השרת.

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

REST - סגנון לבניית ממשקי API מעל HTTP, המבוסס על משאבים ועל שיטות סטנדרטיות כמו GET ו-POST.

תבנית - מבנה בסיסי מוכן שממנו יוצרים פריטים דומים, כמו תבנית עמוד או תבנית מסמך.

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

צד שרת - החלק של היישום שרץ בשרת ואחראי על הלוגיקה, מסדי הנתונים והעיבוד שמאחורי הקלעים.

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

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

הסבר על Templating Engine בנוד NodeJS

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

איך זה עובד

1. המטרה: בניית אתר שבו הדפים עצמם נוצרים בשרת, עם Restful service אחר או בלי.

2. מה יש בתבנית: HTML רגיל בתוספת תחביר של המנוע, שמאפשר תנאים, switch, לולאות ועוד, ובעזרתם משתילים מידע דינמי בדף.

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

4. EJS: ב-Node.js המנוע המוביל הוא Embedded JavaScript, בקיצור EJS. הסיומת של הדף היא .ejs ולא .html, כי HTML לא יכול להריץ פעולות בצד השרת.

5. התהליך: בתבנית יש חלקים קבועים, למשל כותרת עליונה וזכויות יוצרים בתחתית, ומקומות ריקים בתחביר של המנוע. כשמשתמש מבקש דף, השרת ניגש למסד הנתונים או מבצע חישובים, ממלא את המקומות הריקים בתוצאות (כמו Hello John) ומחזיר את ה-HTML הסופי.

6. מהצד של הלקוח: הוא מקבל דף HTML ואינו יודע שהוא נוצר דינמית.

בהמשך המודול עובדים עם EJS ב-Node.js כדי לבנות אתר שדפיו נוצרים בשרת.

השיעור הבא בקורס: יצירת פרויקט עם Templating Engine בנוד NodeJS

פרקי ההרצאה: הסבר על Templating Engine בנוד NodeJS

תמלול ההרצאה: הסבר על Templating Engine בנוד NodeJS

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

00:01
אנחנו מגיעים למודול מאוד מעניין שנקרא Templating Engine. כאן אנחנו הולכים להשתמש ב-Node.js בכדי לבנות מערכת שמייצרת לנו דפי HTML בצד השרת ומחזירה ללקוח.
00:20
יכול להיות שאתם רוצים לבנות אתר אינטרנט בלי קשר ל-Restful Service, או שהוא משתמש ב-Restful Service אחר, אבל כאן אנחנו כבר רוצים לבנות את הדפים עצמם ו-Node.js מאפשרת לנו לעשות את זה.
00:36
הקונספט הזה נקרא Templating Engine. בואו קודם כל נבין מה זה אומר. אז Templating Engine זאת מערכת שמאפשרת ליצור תבניות HTML שמשולב בתוכן מידע בצורה דינמי.
00:54
כל זה נוצר בצד השרת ומוחזר ללקוח. ה-HTML טמפלייט והמידע הדינמי בסופו של דבר יוצרים את דף ה-HTML הסופי שהוא זה שחוזר ללקוח.
01:12
המנוע הזה, הטמפלייטינג אנג'ן כולל בתוכו גם תחביר בשביל ליצור תנאים, סוויצ'ים, לולאות ועוד כל מיני דברים שאנחנו יכולים בעזרתם לשתול את המידע הדינמי בתוך הדף.
01:31
יש טמפלייטינג אנג'ינס שקשורים לצד הלקוח, לדוגמה באנגולר יש את זה או בריאקט יש את זה, ויש טמפלייטינג אנג'ינס שנמצאים בצד השרת, כמו שאנחנו הולכים כרגע לעבוד איתו בנוד ג'יי אס לדוגמה.
01:48
בנוד ג'יי אס הלידינג טמפלייטינג אנג'ין נקרא Embedded JavaScript או בקיצור EJS. זה מה שאנחנו הולכים לעבוד. בואו נראה סכמה שמתארת איך זה בדיוק עובד.
02:02
אז כמובן המידע שלנו יושב בדאטאבייס בצד השרת כל הסכמה הזאת היא של צד השרת ויש לנו את הדף של הטמפלייטינג אנג'ן טמפלייט אנג'ן בדף עצמו אנחנו יכולים לבנות תגיות html הסיומת של הדף היא לא html כי html לא יכול