דוגמאות מתרגילים ב-Full Stack מתוך ראיונות עבודה

עודכן לאחרונה: 11 פברואר, 2024

יש לכם שאלות? נשמח לדבר איתכם ולענות על הכל

אני מאשר/ת קבלת דיוורים ישירים ודברי פרסום ממכללת Real Time בכפוף למדיניות הגנת הפרטיות

תוכן עניינים

מדריך פיתוח WEB עם תרגילים ופתרונות

להלן פתרונות תרגילים full stack

מדריך פיתוח WEB עם תרגילים ופתרונות

צוות Real Time College הכין במיוחד בשבילכם סט תרגילים Full-Stack לבדיקת הידע או כהכנה לראיונות עבודה בתכנות FullStack

מעוניינים לשפר את הידע בתכנות Web ולפתוח המון אפשרויות פיתוח חדשות בעולם ההייטק?
בוא ללמוד פיתוח Full Stack עם צוות Real Time College
לפרטים נוספים > קורס פיתוח אתרים Full Stack

תרגילים בפיתוח Full Stack

שאלה 1:

צרו דף HTML שיציג ב TITLE את השם שלכם ובדף עצמו יהיה רשום hello world בכתב מודגש

שאלה 2:

צרו דף HTML שיציג 4 פסקאות שונות, כאשר בכל פסקה טקסט בגופן (font) אחר

שאלה 3:

בנו טבלה המציגה את 5 הסרטים האהובים עליכם בסדר יורד, לכל שורה 3 תאים המכילים את שם הסרט, פוסטר הסרט ותיאור קצר

שאלה 4:

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

שאלה 5:

קחו את הדף שיצרתם בתרגיל 4 ותוסיפו לו תפריט ניווט

שאלה 6:

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

שאלה 7:

צור לולאה ב javascript שתדפיס את המספרים 1-5

להלן פתרונות תרגילים full stack

תשובה לתרגיל 1:
<html>
<head>
<title> My name </title>
</head>
<body>

<p><strong> Hllo World !!</strong></p>

</body>
</html>

תשובה לתרגיל 2:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Page Title
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<p style="font-family: Courier New">
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Lorem Ipsum has been the industry's standard dummy text ever since the 1500s,
when an unknown printer took a galley of type and scrambled it to make a type specimen book.
</p>

<p style="font-family: Times New Roman">
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Lorem Ipsum has been the industry's standard dummy text ever since the 1500s,
when an unknown printer took a galley of type and scrambled it to make a type specimen book.
</p>

<p style="font-family: Helvetica">
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Lorem Ipsum has been the industry's standard dummy text ever since the 1500s,
when an unknown printer took a galley of type and scrambled it to make a type specimen book.
</p>

<p style="font-family: Georgia">
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Lorem Ipsum has been the industry's standard dummy text ever since the 1500s,
when an unknown printer took a galley of type and scrambled it to make a type specimen book.
</p>

</body>
</html>

תשובה לתרגיל 3:

• </!DOCTYPE html>
• </html>
• </head>
• </meta charset="utf-8">
• </meta http-equiv="X-UA-Compatible" content="IE=edge">
• </title</Page Title </title>
• </meta name="viewport" content="width=device-width, initial-scale=1">
• </head>
• </body>

• </div class="table1">
• </table>
• </tr>
• <th<name</th>
• <th<poster</th>
• <th<about</th>
• </tr>
• <tr>
• <td<Movie 1</td>
• <td> <img src="> </td>
• <td><p>Lorem ipsum dolor sit amet consectetur adipisicing elit.</p></td>
• </tr>
• <tr>
• <td>Movie 1</td>
• <td> <img src="> </td>
• <td><p>Lorem ipsum dolor sit amet consectetur adipisicing elit.</p></td>
• </tr>
• <tr>
• <td>Movie 1</td>
• <td> <img src="> </td>
• <td><p>Lorem ipsum dolor sit amet consectetur adipisicing elit.</p></td>
• </tr>
• </table>
• </div>

• </body>
• </html>

תשובה לתרגיל 4:

<form>
<ul>
<li>
<label>Full Name <span class="required">*</span></label>
<input type="text" name="field1" class="field-divided" placeholder="First" />
<input type="text" name="field2" class="field-divided" placeholder="Last" /></li>
<li>
<label>Email <span class="required">*</span></label>
<input type="email" name="field3" class="field-long" />
</li>
<li>
<label>Subject</label>
<select name="field4" class="field-select">
<option value="Advertise">Advertise</option>
<option value="Partnership">Partnership</option>
<option value="General Question">General</option>
</select>
</li>
<li>
<label>Your Message <span class="required">*</span></label>
<textarea name="field5" id="field5" class="field-long field-textarea"></textarea>
</li>
<li>
<input type="submit" value="Submit" />
</li>
</ul>
</form>

תשובה לתרגיל 5:

<div class="topnav">
<a class="active" href="#home">Home</a>
<a href="#contact">Contact</a>
<a href="#about">About</a>
</div>
<form>
<ul>
<li>
<label>Full Name <span class="required">*</span></label>
<input type="text" name="field1" class="field-divided" placeholder="First" />
<input type="text" name="field2" class="field-divided" placeholder="Last" /></li>
<li>
<label>Email <span class="required">*</span></label>
<input type="email" name="field3" class="field-long" />
</li>
<li>
<label>Subject</label>
<select name="field4" class="field-select">
<option value="Advertise">Advertise</option>
<option value="Partnership">Partnership</option>
<option value="General Question">General</option>
</select>
</li>
<li>
<label>Your Message <span class="required">*</span></label>
<textarea name="field5" id="field5" class="field-long field-textarea"></textarea>
</li>
<li>
<input type="submit" value="Submit" />
</li>
</ul>
</form>