درباره دوره:
برای ورود به دنیای فرانت اند ((front end)) نیاز به گذراندن آموزش و یادگیری یک سری مفاهیم برنامه نویسی هستید. دوره آموزش front end مکتب خونه برای این هدف توسط تیمی متخصص و مجرب تهیه و تدوین شده است.
این دوره از مجموعه دوره‌های آموزش برنامه نویسی و آموزش طراحی سایت مکتب خونه در ٦٦ ساعت آموزشی در قالب پنج فصل ارائه شده که هر فصل خود حاوی سرفصل‌های مختلفی است. در این دوره مباحث CSS، HTML و javaScript پوشش داده شده خواهند شد.
دوره آموزش front end برای تمامی افراد اعم از افراد مبتدی و حرفه‌ای مناسب است. این دوره با هدف یادگیری پروژه محور توسعه فرانت اند تدوین شده و تمام مفاهیم مهم و مقدماتی توسعه فرانت اند از صفر تا صد در آن پوشش داده شده است.
هیچ پیش‌نیاز خاصی برای دوره آموزش front-end وجود ندارد. همه افراد چه مبتدی و چه حرفه‌ای می‌توانند در این دوره آموزش فرانت اند شرکت کنند. تنها پیش‌نیاز اصلی این دوره توانایی کار با کامپیوتر و سواد کامپیوتری و قدرت جستجوی بالا است.
پس از پایان دوره و در کنار تلاش و کوشش مناسب و شایسته، دانشجویان دوره توانایی ایجاد و پیاده‌سازی بخش فرانت اند یک وب‌سایت یا یک پلتفرم را خواهند داشت. این دوره آموزش فرانت اند برای ورود به بازار کار بسیار حائز اهمیت است زیرا در کنار حرفه‌ای بودن و به روز بودن، پروژه محور است.
اگر قصد دارید پروژه‌های طراحی سایت خود را در بخش فرانت اند پیش ببرید یا در بخش فرانت اند وارد بازار کار شوید، باید از جایی آموزش دیدن را آغاز کنید. این دوره آموزش فرانت اند front end مکتب خونه، به علت اینکه یک دوره مقدماتی تا پیشرفته به‌حساب می‌آید و به‌صورت عملی مفاهیم را پوشش داده است، گزینه مناسبی به‌حساب می‌آید. این دوره آموزش front برای برنامه نویسی موبایل و طراحی سایت بسیار دوره مناسبی است زیرا در کنار اینکه یک آموزش کامل فرانت اند است، همچنین قدم به قدم کاربر را با مفاهیم برنامه نویسی فرانت اند آشنا می‌کند.
امروزه بیشتر کسب‌وکارها به متخصصین فرانت اند نیازمند هستند، بنابراین یادگیری مفاهیم و مباحث مربوط به این ترند در برنامه نویسی فرصت خوبی برای ورود به بازار کار است.
فرانت اند در مورد بخشی از وب‌سایت است که شما به‌عنوان کاربر می‌توانید آن را ببینید و با آن تعامل داشته باشید. قسمت فرانت اند شامل همه‌چیز از طراحی، ساختار و طرح‌بندی وب‌سایت گرفته تا محتوا را شامل خواهد شد. هنگامی‌که یک بازدیدکننده جدید روی یک وب‌سایت یا برنامه کلیک می‌کند، قسمت فرانت اند اولین برداشت از یک شرکت یا نام تجاری بوده بنابراین طراحی ظاهری کاربرپسند (UX) برای هر وب‌سایت یا پلتفرمی ضروری است.
چیزهای زیادی برای ساخت قسمت فرانت اند کار می‌شود، از جمله معماری پایگاه داده، چارچوب‌ها، راه‌حل‌های مقیاس بندی و موارد دیگر که این شامل موارد زیر است:
توسعه وب فرانت‌اند می‌تواند شامل وظایف مختلفی باشد. نحوه پیاده‌سازی این وظایف در دوره آموزش front end مکتب خونه آموزش داده خواهند شد و این شامل وظایف زیر است:
برنامه نویسان فرانت اند از سه فناوری اصلی در توسعه front-end استفاده خواهند کرد.
توسعه‌دهندگان Front-End از ابزارهای دیگری نیز استفاده می‌کنند، از سیستم‌های مدیریت محتوا (CMS) مانند WordPress و Drupal گرفته تا کتابخانه‌ها و چارچوب‌هایی مانند React، Angular و Vue. کتابخانه‌ها و فریمورکها به شما این امکان را می‌دهند که از یک طرح اولیه برای ایجاد عناصر وب مانند دکمه‌ها استفاده کرده تا اینکه هر بار یک عنصر جدید ایجاد کنید. در دوره آموزش front end ابزارها و عناصر لازم برای توسعه فرانت اند به کاربران معرفی خواهند شد.
اگرچه در شرکت‌ها تفاوت‌هایی برای وظایف توسعه دهنده فرانت اند وجود دارد، به‌طورکلی می‌توانید انتظار داشته باشید که نقش توسعه‌دهنده فرانت اند در طراحی وب‌سایت شامل برخی یا همه موارد زیر باشد:
در دوره آموزش front end نقش توسعه‌دهندگان فرانت اند به خوبی توضیح داده شده است. اکثر توسعه‌دهندگان و مهندسان Front-End با گروه‌های تجربه کاربری (UX) هماهنگ می‌شوند. این افراد جمعیت‌شناسی هدف وب‌سایت و نحوه تعامل کاربران با آن را تعیین می‌کنند. طراحی گرافیکی یکی دیگر از بخش‌های مهم بخش فرانت اند است. این شامل فونت‌ها و رنگ‌ها بوده و تضمین می‌کند که طراحی وب سایت با شرکت و محصولی که برنامه وب برای آن است مطابقت دارد.
توسعه‌دهندگان Front-End با بخش‌های مختلف هماهنگ می‌کنند تا اطمینان حاصل کنند که برنامه‌های کاربردی وب در همه مرورگرها و اندازه‌های صفحه‌نمایش از جمله تلفن همراه و تبلت کار می‌کنند. آن‌ها همچنین ممکن است در طول توسعه از این بخش‌ها بازخورد دریافت کنند، بنابراین آن‌ها باید بتوانند بازخوردهای افراد مختلف با دیدگاه‌ها و اولویت‌های مختلف را در نظر بگیرند و به آن‌ها گوش دهند.
بخش فرانت اند یا قسمت جلویی وب‌سایت، نمایندگی دیجیتال یک فرد یا یک سازمان است. این قسمت مهم، پلی بین مشتری یا مشتری و برند ایجاد می‌کند. قسمت فرانت اند همچنین وب‌سایتی را قابل استفاده می‌کند. اگر وب‌سایت یا برنامه‌ای به خوبی کار نکند، می‌تواند مشتریان را از خود دور کند و بازگرداندن آن مشتریان دشوار است. در نهایت، قسمت فرانت اند ایده یک سازمان یا فرد را نشان می‌دهد و مهم است که آن را به درستی انجام دهیم.
یکی از گزینه‌های تبدیل شدن به یک مهندس فرانت اند یا توسعه دهنده فرانت اند، گرفتن مدرک است. اگرچه این برای برخی از افراد قابل‌دسترس است ولی گرفتن مدرک برای همه افراد عملی نیست. خوشبختانه، شما می‌توانید بدون مدرک یک مهندس فرانت اند شوید.
برای انجام این کار، باید با گذراندن دوره‌های مرتبط شروع کنید. می‌توانید با زبان‌های برنامه نویسی مانند HTML، CSS و جاوا اسکریپت شروع کرده و یا می‌توانید مسیر شغلی مهندس Front-End را در اینترنت بررسی کنید. دوره آموزش front end مکتب خونه نقطه شروع خوبی برای انجام این کار است. مسیر شغلی مهندس Front-End شامل زبان‌های ذکر شده در بالا به همراه کتابخانه‌هایی مانند React و Redux است.
فصل اول – HTML:
1 – آشنایی با دوره وب
2 – آشنایی با وب
3 – web, html and front-end
4 – HTML and front-end
5 – html requests
6 – Requests
7 – نصب نرم افزارها
8 – ساختار یک صفحه html
9 – تگ ها
10 – تگ head
11 – تگ body
12 – attributes, div and span
13 – لینک با تگ “a”
14 – تگ ها
15 – لیست های مرتب
16 – لیست های نامرتب
17 – lists
18 – فرم ها
19 – فرم ها
20 – عکس ها
21 – عکس ها
22 – ویدئو
23 – ویدئو
فصل دوم – CSS:
1 – آشنایی با CSS
2 – مفاهیم اولیه CSS
3 – CSS Syntax
4 – Color
5 – Color
6 – Selectors
7 – pseudo classes
8 – pseudo elements
9 – CSS and class and id
10 – انتخاب المان
11 – specifity
12 – border
13 – margin
14 – padding
15 – css outline
16 – Css width and height
17 – text
18 – font
19 – links
20 – ویژگی المان ها و لینک
21 – maxwidth
22 – position
23 – float
24 – المان ها و فونت
25 – display and opacity
26 – CSS3 border corners and multiple images
27 – CSS3 gradient and shadow
28 – color and position
29 – CSS3 transition
30 – CSS3 animation
31 – انیمیشن
32 – مهارت سرچ کردن در برنامه نویسی
33 – توضیح مکمل پروژه اول
34 – شرح پروژه بخش HTML
35 – شرح پروژه بخش HTML و CSS (بخش اول – navbar)
36 – شرح پروژه بخش HTML و CSS (بخش دوم – modal)
37 – شرح پروژه بخش HTML و CSS (بخش سوم – up and down jump buttons)
38 – پروژه بخش HTML و CSS
فصل سوم – JavaScript:
1 – آشنایی با جاوا اسکریپت
2 – خروجی جاوا اسکریپت در لاگ کنسول
3 – if و for در جاوااسکریپت
4 – آشنایی با JavaScript html DOM
5 – javascript dom style
6 – jsdom style
فصل چهارم – jQuery:
1 – آشنایی با jQuery
2 – when document is ready
3 – jquery : events and selectors
4 – event selector
5 – jquery hide, show and fade effects
6 – slide, animation and stop animation effects
7 – animation
8 – پروژه بخش jQuery
فصل پنجم – طراحی واکنش گرا:
1 – آشنایی با طراحی واکنش گرا
2 – gridview
3 – media queries
4 – media queries
5 – dual breakpoints
6 – عکس و ویدئو
7 – عکس و ویدئو
8 – پروژه نهایی طراحی صفحه وب واکنش گرا
9 – آشنایی با bootstrap
10 – bootstrap buttons, glyphicon and images
11 – بوت استرپ
12 – پروژه بخش طراحی واکنش گرا
پروژه نهایی:
1 – شرح پروژه نهایی دوره
2 – پروژه نهایی دوره
