دوره طراحی وب رسپانسیو

در این دوره مفاهیم HTML CSS در قالب پروژه سایت تپسی به صورت عملی آموزش داد شده است. هدف دوره ایجاد توانایی توسعه دقیق ui/ux پروژه های فرانت به صورت رسپانسیو است.

۱۳:۳۴:۰۰
۷۲ جلسه
۳۱۴۸ دانشجو
۵  از  ۱۷  رای
روش دریافت: اسپات پلیر
تاریخ انتشار :۱۴۰۱/۹/۲۵
آخرین بروزرسانی:۱۴۰۳/۴/۲۶
پشتیبانی: دائمی تلگرام

توضیحات دوره

در این دوره مفاهیم HTML CSS در قالب پروژه سایت تپسی به صورت عملی آموزش داد شده است. هدف دوره ایجاد توانایی توسعه دقیق ui/ux پروژه های فرانت به صورت رسپانسیو است.

HTML CSS چیه واقعا ؟

در واقع HTML و CSS دو تا تکنولوژی برای ساخت صفحات وب هستند. ویترن و ظاهر کار یک وبسایت یا وب اپ رو HTML CSS تعیین میکنه و توی نگاه اول کیفیت کار یک فرانت اند با همین مشخص میشه. قدم اول شما برای فرانت اند ، یادگیری اصولی HTML و CSS هست

چرا اسم دوره طراحی وب رسپانسیو (responsive) هست ؟

چون صفر تا صد یک پروژه کاملا واقعی و صد البته رسپانسیو رو با رعایت تمام جزییات مثل رنگ، سایز فونت ها، سایز المان ها رو طبق طرح گرافیکی از قبل آماده شده، قدم به قدم و کاملا اصولی پیاده می کنیم.

چرا این دوره آماده شد ؟

خیلی از بچه ها، بعد چندین دوره HTML و CSS، باز هم نمی تونن یک طرح ساده رو پیاده کنن. چون متاسفانه، از همون ابتدا سعی کردن که دانشجو رو با فریمورک های آماده عادت بدهند که اصلا راهکار خوبی نیست و در دراز مدت بهشون ضربه بزرگی میزنه. طبیعتا یادگیری فریمورک ها خوبه ، اما هیچ وقت، فریمورک هایی مثل بوتسترپ (Bootstrap)، تیلویند (TailwindCSS) و چیزای دیگه، ما رو از یادگیری مفاهیم اصلی و بشدت کاربردی مثل Flex – Grid – Responsive design بی نیاز نمی کنن. یادگیری اصولی مفاهیم هست که بین برنامه نویس خوب و بد، تمایز ایجاد میکنه. بنابراین، تمام تمرکز من هم روی تدریس دقیق مفاهیم کاربردی HTML و CSS در طی پیاده کردن پروژه ها بوده.

چرا یادگیری مفاهیم flex – grid مهمه ؟

چون اگه به اینا مسلط باشیم، واقعا طراحی رسپانسیو خیلی برامون لذت بخش میشه و عملا از فریمورک هایی مثل بوتسترپ (bootstrap) بی نیاز میشیم. فریمورک های CSS هم توی پشت صحنه از همین ویژگی ها استفاده می کنند. اما چیزای آماده همیشه راهکار خوبی نیستن.

تفاوت این دوره با این همه دوره رایگان HTML و CSS چیست ؟

سوال بسیار خوبیه. دلیل اول : توی این دوره میخوام یکبار برای همیشه با همین مفاهیم پایه ای HTML CSS یک پروژه کاملا واقعی با رعایت کوچک ترین جزییات، پیاده کنیم. چیزی که حتی در اکثر دوره های غیر رایگان هم پیدا نمیشه. وقتی میگم یک پروژه کامل، طبیعتا رعایت اندازه های رسپانسیو متن ها، تعریف متغیر ها، بلاک بندی برنامه با فلکس و گرید در سایزهای مختلف دستگاه ها، کدنویسی تمیز CSS ، اسم گذاری اصولی کلاس ها مهم میشه. پس رعایت همه ی این اصول طی یه پروژه واقعی، فرایند یادگیری رو براتون ساده میکنه. دلیل دوم : دوره های رایگان عملا تضمینی بابت آپدیت و کیفیت مطالب ندارند. دلیل سوم : شما در این دوره تمرین دارید. یک UI کاملا واقعی بهتون داده میشه و دانشجو موظف است که این طرح رو پیاده کنه. دلیل چهارم : پشتیبانی دوره های من قطعا منحصر بفرد است. تیم پشتیبانی ندارم! و پشتیبان تک تک بچه ها شخص خودم هستم

آیا همین دوره برای HTML CSS کافی خواهد بود؟

اگه ریز به ریز چیزایی که توی این دوره بهت میگم رو رعایت بکنی، مطمئنا تا حد زیادی از فریمورک ها بی نیاز میشی و برنامه نویسی فرانت اند برات لذت بخش میشه. واقعا دوره دیگه ای رو نیاز نداری و در طی چالش ها و سرچ کردن، مابقی ریزه کاری ها رو یاد میگیری.

برای پشتیبانی چه برنامه ای داری ؟

این دوره پشتیبانی منحصربفرد دارد. پشتیبانی به صورت گروه های ویژه تلگرامی هست و فقط خودم جوابگوی هر گونه سوال و ابهام شما چه در مسائل فنی و چه در پروسه استخدامی و رزومه سازی هستم.

این دوره برای چه کسانی توصیه میشه ؟

دسته اول برای کسایی که برای اولین بار میخواهند وارد دنیای برنامه نویسی فرانت اند بشوند. دسته دوم، دوستانی هستند که میخوان مهارت HTML CSS خودشون رو ارتقا بدهند.

بخاطر مبلغ دوره، نمیخواهم در این دوره شرکت نمایم. پیشنهاد شما چیست؟

به دست آوردن هر چیزی بهایی دارد؛ خیلی از هزینه های زندگی به ما برنمیگرده اما شما توی این دوره روی ارتقاء کیفیت زندگی خودتان سرمایه گذاری می کنید. از امروز شروع کنید و روی رشد خودتان و مهارتتان سرمایه گذاری کنید. هر چیز ارزشمندی می‌خواهید به دست بیاورید باید ابتدا بهای آن را بپردازید.

جلسات دوره

۱معرفی دوره
۱۰
دانلود ویدیو
۲اولین کد HTML
۱۲
۳مباحث پایه ای CSS
۱۰
۴Head tags
۸
۵Text tags
۱۱
۶Entity
۱۱
۷Hyperlink
۹
۸Image
۶
دانلود ویدیو
۹Video
۶
۱۰List
۵
۱۱Table
۷
دانلود ویدیو
۱۲Containers
۵
۱۳Semantic HTML
۸
۱بررسی کلی CSS
۵
دانلود ویدیو
۲Relational Selectors
۱۴
دانلود ویدیو
۳Pseudo class
۱۱
۴Pseudo element
۶
۵Selector specificity
۶
۶Inheritance
۵
۷Colors
۱۰
۸Gradient
۷
۹Border
۷
۱۰Shadow
۵
۱۱Box Model
۱۲
۱۲Box-sizing
۵
۱۳Overflow
۷
۱۴Positioning
۸
۱بررسی ریز به ریز مفاهیم flex
۳۵
۱بررسی ریز به ریز مفاهیم Grid
۴۵
۲media query
۱۲
۱font-size - line height
۱۱
۲Text formatting
۱۲
۳رسپانسیو کردن متن ها
۱۳
۱Background image
۱۲
۲CSS sprite
۱۰
۳Supporting high density
۱۳
۴Resolution Switch
۸
۵Art direction
۹
۶SVG icons
۶
۱Form intro
۶
۲Style form
۷
۳Text area
۵
۴Data list
۱۱
۵Select option
۹
۶radio button - check box
۱۱
۷file - slider input
۹
۸Validation - form submission
۹
۱Transform
۱۱
۲Transition
۱۲
۳Animation
۱۳
۱نکات حرفه ای -1
۹
۲نام گذاری کلاس ها بر اساس BEM
۹
۳Object Oriented CSS
۱۲
۱بررسی کلیات و شروع پروژه
۱۵
۲توسعه کامپوننت Badge
۱۰
دانلود ویدیو
۳توسعه کامپوننت Badge
۱۵
۴توسعه کامپوننت Plan-1
۲۰
۵توسعه کامپوننت Plan-2
۲۰
۶توسعه کامپوننت Icon
۱۰
۷توسعه کامپوننت Contact-Us
۱۵
۸توسعه کامپوننت Social-media
۱۵
۹توسعه کامپوننت Contact-Form
۱۶
۱۰توسعه کامپوننت Footer
۲۳
۱۱توسعه کامپوننت NavBar
۲۲
۱۲توسعه کامپوننت Toggler
۱۰
۱۳توسعه کامپوننت Hero-section
۱۰
۱۴توسعه کامپوننت Services
۹
۱۵اضافه کردن AOS به پروژه
۹
۱۶توسعه کامپوننت Traverlling
۱۹
۱۷توسعه کامپوننت Accordion
۱۵
۱۸توسعه کامپوننت Avatar
۱۳
۱۹توسعه کامپوننت Radio-Button
۱۳

سوالات متداول

قطعا خیر. این دوره اولین قدم برای ورود به دنیای برنامه نویسی فرانت اند هست. هیچ پیش نیاز قبلی از HTML و CSS لازم نیست.

قطعا بله. برای کسایی که تازه میخوان شروع بکنن، این دوره اولین قدم خواهد بود.

مشکلی که خیلی از برنامه نویسان فرانت اند دارند اینه که از قدرت CSS خبر ندارن و از همون ابتدا سراغ فریمورک های آماده میرن که در دراز مدت بهشون ضربه بزرگی میزنه. طبیعتا یادگیری فریمورک ها خوبه ، اما هیچ وقت فریمورک هایی مثل بوتسترپ (Bootstrap)، تیلویند (TailwindCSS) و چیزای دیگه ما رو از یادگیری مفاهیم اصلی و بشدت کاربردی مثل Flex – Grid – Responsive design بی نیاز نمی کنن. یادگیری اصولی مفاهیم، بین برنامه نویس خوب و بد، تمایز ایجاد میکنه. بنابراین، تمام تمرکز من هم روی تدریس دقیق مفاهیم کاربردی HTML و CSS در طی پیاده کردن پروژه ها بوده.

همه ی دوره های فرانت هوکس آپدیت میشه و آپدیت ها به صورت رایگان به پنل شما اضافه میشه

بله پروژه سایت تپسی در این دوره پیاده سازی می شود. هم چنین قسمت های دیگر نیز اضافه شده است.

قطعا بله، تمام دوره های فرانت هوکس پشتیبانی دارد و وجود یک مربی در سرعت یادگیری شما قطعا اثرگذار هست.

۴۹۸,۰۰۰
% ۳۰
۳۴۹,۰۰۰
صاحب محمدی

صاحب محمدی

مدرس دوره

داستان برنامه نویس شدن من برمیگرده به سال 93. همون موقع که برای پروژه های دانشگاه (رشته مهندسی نفت) برنامه نویسی میکردم. کم کم با MATLAB آشنا شدم و بعدا وارد حوزه برنامه نویسی وب شدم و الان حدود 7 ساله که شغل تخصصی من برنامه نویسی وب هست. علاقه من جاوااسکریپت و خاندانش است. به همین دلیل فرانت هوکس رو بنا کردم تا تجربه چند ساله رو در قالب دوره های پروژه محور به علاقه مندان این حوزه انتقال بدم ☘️🤍.

میتوانید دیدگاه خود را ثبت کنید