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

  • השפות והספריות בהם נשתמש בקורס: HTML, CSS, JavaScript, , React Bootstrap, jQuery
  • כלי העבודה שנלמד ונשתמש: GIT, GitHub, command line, NPM, Visual Studio Code, Chrome DevTools, Mocha testing

220 שעות לימוד מלאות (295 אקדמאיות)

55 מפגשים פרונטליים

2 מפגשים בשבוע

מוכר לפיקדון לחיילים משוחררים

רמת הקורס: מתחילים 

מחזורים קרובים

Group 17 Created with Sketch.
24 בינואר 2021
מספר מפגשים: 55 (2 מפגשים בשבוע)
נותרו מקומות פנויים
899061 Created with Sketch. ראשון וחמישי (ייעודי לעמותת אחריי)
2092066 Created with Sketch. 10:00-14:00

למי מיועד המסלול?

תנאי קבלה וידע מוקדם

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

מה אתם כן צריכים שיהיה לכם:

  • 12 שנות לימוד (או ישיבה לבוגרי החינוך החרדי).
  • בגרות במתמטיקה ובאנגלית ברמת 4 יחידות, או מבחן התאמה מקביל.
  • יכולת מעשית בעבודה עם יישומי אינטרנט ואופיס (אקסל, פאואר פוינט)
כשאסיים את הקורס אצא עם
  • יכולת מעשית בפיתוח אתרי אינטרנט ויישומים דיגיטליים בצד לקוח
  • ניסיון מעשי ותיק עבודות שישמש ככרטיס ביקור למעסיקים פוטנציאליים
  • יכולת למידה עצמית ופיתוח מקצועי אישי
  • פרקטיקה וכלים להשתלבות בשוק העבודה בסיוע המכללה

סילבוס

להורדת הסילבוס כPDF
01 Created with Sketch.
פתיחה – צד לקוח, צד שרת ומה שביניהם.

This (X)HTML content will NOT be indexed by Google. This (X)HTML content will NOT be indexed by Google.

נלמד כיצד עובד הדפדפן שהוא סביבתן של אפליקציות צד הלקוח. נדבר דרך עבודתו של השרת ואופן התקשורת אליו. לשם כך נלמד כיצד עובד פרוטוקול HTTP ואיך צד הלקוח והשרת מתקשרים בעזרתו. נסיים בהיכרות עם 3 הטכנולוגיות המוכרות לדפדפנים: HTML, CSS, JavaScript

[מפגש 1] 

  • Browser workflow
  • What is a webserver?
  • HTTP protocol
  • HTML, CSS, JavaScript overview
קרא עוד קרא פחות
02 Created with Sketch.
שפת האלמנטים ומבנה האפליקציה HTML

This (X)HTML content will NOT be indexed by Google. This (X)HTML content will NOT be indexed by Google.

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

[מפגשים 02-06]

  • What is HTML?
  • HTML hierarchical structure and main component {HTML ,Head ,body + main head components}
  • HTML5 – new organizational tags {Header, Footer}
  • HTML elements {div, p, h1-5, img , a}
  • Table
  • Lists
  • HTML5 – new semantic tags {nav, section, articles}
  • HTML form, inputs and labels (including HTML5 input types)
  • Form – continue
  • HTML5 – input attributes and validation {pattern, placeholder, required, read-only, disabled, autofocus}
  • IDE – Visual Studio Code (much more than an editor).
  • HTML5 – Accessibility and ARIA – short overview
  • HTML5 – new operational tags {video, audio, figure, svg, canvas, mark}
קרא עוד קרא פחות
03 Created with Sketch.
שפת העיצוב CSS

This (X)HTML content will NOT be indexed by Google. This (X)HTML content will NOT be indexed by Google.

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

  • Basic CSS concepts – Syntax, Specificity, inheritance, and the Cascade
  • Font, text formatting and background
  • Basic CSS units and values
  • Borders
  • Box model and margin collapse
  • Basic display properties (inline, block, inline-block)
  • Link pseudo-elements {hover, link, active, visited}
  • Floating and clearing technics
  • Pseudo-elements: before and after
  • direction and text align
  • Positioning {static, relative, absolute, fixed, sticky}
  • Work environment:
  • Browser and developer tools (Chrome/Firefox/Edge).
  • Pseudo-elements: {nth-child, first-child,}
  • Table properties
  • Website layouts
  • Background gradient, opacity, RGBA
  • Box and text shadow
  • CSS variables
  • Transitions and animation
  • Navigation bars
  • Real life tricks
  • Media queries and responsiveness
  • min/max-width
  • Advanced CSS3 units and values
  • CSS Flexible Box Layout
  • CSS Grid Layout
  • Project – copy a real website or let a designer design a real website design
קרא עוד קרא פחות
04 Created with Sketch.
Bootstrap - הספרייה המובילה בעולם למתן עיצוב ומקצועי ומהיר

This (X)HTML content will NOT be indexed by Google. This (X)HTML content will NOT be indexed by Google.

Bootstrap – הספרייה המובילה בעולם למתן עיצוב ומקצועי ומהיר
שיעור מבוא זה יכיר לנו את עולם ה- Bootstrap המאפשר יצירת עיצוב מהיר לאפליקציה ע"י שימוש בתגיות HTML והתכונות שלהן (attributes) וללא שימוש ב-CSS או שימוש מועט בו.

[מפגש 20]

 

 

קרא עוד קרא פחות
05 Created with Sketch.
ניהול גרסאות תוכנה באמצעות GIT ואכסון ושיתוף מאגרי תוכנה ב- GitHub

This (X)HTML content will NOT be indexed by Google. This (X)HTML content will NOT be indexed by Google.

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

[מפגש 21]

קרא עוד קרא פחות
06 Created with Sketch.
שפת JavaScript – שפת התכנות הנפוצה בעולם והמרכזית בעולמות פרונט אנד

This (X)HTML content will NOT be indexed by Google. This (X)HTML content will NOT be indexed by Google.

CSS הפיחה צבע באפליקציה ושפת JavaScript מפיחה בו חיים ותנועה. בפרק זה נלמד עקרונות תכנות. את עקרונות השפה המיוחדת והדינמית הזאת וכיצד היא מתקשרת עם השרת, עם המשתמש, האלמנטים המרכיבים את האתר וכיצד ביכולתה לשלוט עליו ולשנות אותו.
בסיום הפרק נבנה אתר parallax של חנות עם עגלת קניות וסליקה באמצעות פייפאל.
[מפגשים 22-37]

  • JavaScript fundamentals: expressions, variables and data types
  • Flow control (if, switch and loops)
  • Functions
  • Objects
  • Arrays
  • Recursion and call stack
  • Error handling in JavaScript (try. Catch and exceptions)
  • Asynchronous JS (set Timeout and set Interval)
  • Callbacks
  • JavaScript in Browsers – the DOM
  • DOM events
  • DOM manipulation + classes + styles
  • Forms validation and manipulation
  • HTML5 – form events {input,drop,dragstart,dragover,contextmenu,formchange,forminput,invalid}
  • HTML5 – Storing data using cookies and local Storage, session Storage
  • bind, call, apply
  • Object-oriented aspects of JavaScript
  • Promises
  • AJAX & Fetch API
  • async / await
  • HTML5 – canvas (overview)
  • Project – Shop – Load data from json (fetch) and create items + cart.
קרא עוד קרא פחות
07 Created with Sketch.
היכרות עם ספריית jQuery שהיא חלוצת האפליקציות המורכבות ועדיין הספרייה הנפוצה בעולם

This (X)HTML content will NOT be indexed by Google. This (X)HTML content will NOT be indexed by Google.

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

[מפגשים 38-39]

  • About jQuery – goal, selectors, the $ function, each and chaining
  • Events
  • DOM traversal
  • DOM manipulation
  • Animation and effects
  • Using and writing plugins
  • Ajax
קרא עוד קרא פחות
08 Created with Sketch.
אפליקציות מתקדמות באמצעות React

This (X)HTML content will NOT be indexed by Google. This (X)HTML content will NOT be indexed by Google.

ספריית צד הלקוח המבוקשת ביותר בעולם (עפ"י Stack Overflow) שינתה את האופן שבו כותבים אפליקציות. הספרייה אשר נכתבה ע"י פייסבוק מאפשרת כתיבת אפליקציות מתקדמות ובשימוש באתרים כגון פייסבוק, אינסטגרם, נטפליקס, יאהו, ווטסאפ, דרופבוקס ועוד רבים וטובים.

נלמד כיצד עובדים עם הספרייה ועם הפורמט המיוחד JSX המאחד HTML עם JavaScript. נלמד לבנות קומפוננטות מורכבות (כפונקציה, מחלקה והוקס) תוך שמירה וניהול מצבים (states). נלמד לכתוב נתב שינהל לנו את תצוגת דפי אפליקציה. ניצור ונתכנת נהלי בדיקות של הקומפוננטות והאפליקציה ונשתמש בספריה המתקדמת Redux.

[מפגשים 40-51]

  • What is react, and why do we want to use it?
  • What is JSX? + Simple JSX code
  • Components basics (function)
  • Class vs Class Name and for vs HTMLFor
  • Components basics (class)
  • Basic events (with binding)
  • Props
  • state
  • Introduction to Node
  • NPM package manager
  • Setting up a React Project
  • Component styling
  • Using fetch in React
  • Fragments
  • Context API
  • Automated testing with Mocha / Jest
  • Routing
  • React hooks
  • Redux (actions and reducers)
קרא עוד קרא פחות
09 Created with Sketch.
סדנת הכנה לשוק העבודה

This (X)HTML content will NOT be indexed by Google. This (X)HTML content will NOT be indexed by Google.

[מפגש 52]

  • כתיבת קורות חיים
  • אפשרויות תעסוקה למפתחי WEB
  • הכנה לריאיון עבודה מקצועי
קרא עוד קרא פחות
10 Created with Sketch.
פרויקט גמר – Final Project

This (X)HTML content will NOT be indexed by Google. This (X)HTML content will NOT be indexed by Google.

[מפגשים 53-55]
לסיום נעשה פרויקט מסכם גדול של הקורס. הפרויקט יבוצע בקבוצות. ניתן יהיה לבחור בין 3 פרויקטים או ליזום פרויקט משלכם (לאחר התייעצות והכוונה של הצוות המקצועי).

 

 

** ייתכנו שינויים בתכני / מרצי הקורס

*** המסלול הינו הכשרת יסוד לאנשים ללא רקע המעוניינים לרכוש מקצוע חדש ***

קרא עוד קרא פחות

3 סיבות ללמוד אצלנו

01 Created with Sketch.

למידה משולבת - למידה פרונטלית לצד למידה עצמית

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

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

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

02 Created with Sketch.

פרקטיקה - פרקטיקה - פרקטיקה

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

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

03 Created with Sketch.

אתכם גם ביום שאחרי

סיימתם את הקורס? אחלה!

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

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

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

 

להרשמה למחזור הקורס הקרוב ושיחה עם נציג המכללה
מעוניינים במשהו?

כל השדות חובה

    אנחנו זמינים כמעט בכל מקום
    פְּתַח תַּפְרִיט נְגִישׁוּת
    נְגִישׁוּת
    איפוס
    הצהרה
    משוב

    מבוא

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

     

    כיצד עובדת ההנגשה באתר?

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

     

    מה בתפריט?

    - מתן אפשרות לניווט ע״י מקלדת

    - הגדלת פונט האתר ל־5 גדלים שונים

    - עצירת אלמנטים נעים וחסימת הבהובים

    - שינוי ניגודיות צבעים על בסיס רקע כהה

    - שינוי ניגודיות צבעים על בסיס רקע בהיר

    - התאמת אתר לעיוורי צבעים

    - שינוי הפונט לקריא יותר

    - הגדלת הסמן ושינוי צבעו לשחור או לבן

    - הגדלת התצוגה לכ־200%

    - הדגשת קישורים באתר

    - הדגשת כותרות באתר

    - הצגת תיאור אלטרנטיבי לתמונות

    - הצהרת נגישות

    - שליחת משוב נגישות

     

    הבהרה

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

    משוב נגישות
    שליחה
    המשוב נשלח בהצלחה!
    תודה. אחד מנציגינו ייצור איתך קשר בהקדם האפשרי.
    סמן גדול (שחור)
    סמן גדול (לבן)
    חלונית הגדלה
    הגדלת גופן
    הקטנת גופן
    גופן קריא
    מונוכרום
    ניגודיות כהה
    ניגודיות בהירה
    הדגשת קישורים
    הדגשת כותרות
    תיאור תמונות
    ניווט במקלדת
    ביטול הבהובים
    Powered by EM Studio