آموزش حرفه ای طراحی قالب با Html Css FlexBox از صفر
بعد از یادگیری Html,Css افراد با یک چالش بزرگی رو به رو میشن، اونم اینه که نمیتونن توسط دانشی که یادگرفتن یک طرحی رو از صفر به کد تبدیل کنن و وبسایتی رو پیاده سازی کنن، توی این دوره به شما از صفر اصول طراحی قالب و همچنین اصول طراحی واکنش گرا گفته میشه. آموزش Html
240,000 تومان 156,000 تومان
در دوره آموزش طراحی قالب 2 قالب شخصی و شرکتی با 2 تم لایت و دارک به صورت فول ریسپانسیو پیاده سازی می شود تا شما عزیزان بعد از دوره بتوانید با مفاهیم و اصول طراحی قالب آشنا بشید و بعد از گذروندن دوره بتوانید پروژه های خود را اصولی و ریسپانسیو طراحی کنید.
چرا باید در این دوره شرکت کنم؟
امروزه یکی از مشکلات اساسی طراحان وب و افرادی که قصد فعالیت در این حوزه را دارند، ضعف در پیاده سازی و طراحی قالب وب سایت است.
افراد زیادی از دوره های مختلف مفاهیم زبان های Html و Css را یاد می گیرند اما نمی توانند با استفاده از مفاهیمی که یاد گرفتند یک پروژه کامل و واقعی پیاده سازی کنند و به این ترتیب به هیچ وجه نمی توانند وارد بازار کار شده و کسب درآمد کنند. چون لازمه بازار کار، داشتن تخصص و نمونه کار قابل قبول است.
شما در این دوره با صفر تا صد استاندارد ها و اصول طراحی قالب وب آشنا می شوید و بعد از این دوره می توانید هر قالبی که دوست داشتید را پیاده سازی کنید و وارد بازار کار شوید.
بعد از این دوره به چه سطحی می رسم؟
شما بعد از اتمام این دوره و تمرین و یادگیری کامل مطالبی که داخل دوره گفته شده، میتونید به طور کاملی طرح های مختلف بازار کار رو پیاده سازی کنید و هیچگونه مشکلی در تبدیل طرح به کد نداشته باشید. همچنین شما بعد از پایان این دوره به کد نویسی بهینه، اصولی، استاندارد تسلط پیدا میکنید که از لحاظ کد نویسی هم مهارت بالایی داشته باشید
پیش نیاز های دوره چه مباحثی هستند؟

در این دوره 2 پروژه حرفه ای و قابل قبول بازار کار فقط با Html، Css (FlexBox) پیاده سازی می شود.
پس شما قبل از ثبت نام در این دوره باید Html و Css (FlexBox) را بلد باشید.
اگر با این پیش نیاز ها آشنایی ندارید و اطلاعاتی در مورد آن ها ندارید، هیچ گونه نگرانی نداشته باشید. می توانید به کمک دوره های:
دوره آموزش مقدماتی تا پیشرفته Css
تمام پیش نیاز های این دوره را به طور رایگان یاد گرفته و سپس این دوره را با قدرت و آمادگی بیشتری شروع کنید.
آیا این دوره پشتیبانی دارد؟

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

دوره آموزش حرفه ای طراحی قالب به صورت آفلاین و ویدئویی برگزار می شود و شما برای شرکت در جلسات دوره هیچ نیازی به آنلاین بودن در ساعت خاصی از روز ندارید.
روند دوره به این شکل است که هفته ای 3 جلسه ویدئویی جدید برای دوره اضافه می شود و شما می توانید جلسات را دانلود کرده و در هر تایمی که دوست داشتید مشاهده کنید.
در این دوره از چه ابزارهایی استفاده می شود؟
در این دوره برای نوشتن کد های لازم از نرم افزار PhpStorm و برای اجرای کد ها و مشاهده خروجی از مرورگر Google Chrome استفاده می شود. اما هیچ اجباری به بلد بودن این موارد نیست. چون شما به جای PhpStorm و Chrome می توانید از نرم افزار های دیگر مثل VsCode، Atom، Brave، FireFox و … استفاده کنید.
علاوه بر ابزار های جانبی، همان طور که گفته شد Css یکی از پیش نیاز های این دوره است. پس در این دوره از مباحثی مثل media query برای ریسپانسیو سازی پروژه ها استفاده می شود که البته یکی از فصل های دوره مروری بر این مطالب هست تا دانشجویان مشکلی برای ادامه دوره نداشته باشند .
این دوره برای چه کسانی مناسب است؟
این دوره برای تمام افرادی که قصد فعالیت در حوزه برنامه نویسی فرانت اند دارند، مفید و مناسب است، مخصوصا برای افرادی که در طراحی قالب ضعف و یا در کد نویسی اصولی و یا استاندارد مشکل دارند. برخی از افراد دانش مورد نیاز برای طراحی قالب دارن اما اعتماد به نفس لازم برای پیاده سازی پروژه ندارن، توی انی دره این مشکل رو رفع میکنیم.
در این دوره چه پروژه هایی پیاده سازی می شوند؟
به طور کلی در این دوره 2 پروژه به صورت اصولی پیاده سازی می شود:
1. پروژه قالب شرکتی.
2. پروژه قالب شخصی که با دو تم لایت و دارک.
در این دوره پروژه ها با روش نامگذاری BEM کلاس دهی میشن، از Css Variable ها در پروژه استفاده میکنیم و نحوه پیاده سازی 0 تا 100 یک سیستم گرید مثل بوت استرپ آموزش داده میشه
آیا در این دوره از جاوا اسکریپت هم استفاده می شود؟
زبان برنامه نویسی جاوا اسکریپت قطعا یکی از مهم ترین زبان های برنامه نویسی است که عمده ترین کاربرد آن در زمینه فرانت اند می باشد و تقریبا در تمام پروژه های حوزه وب از آن استفاده می شود.
در پروژه های این دوره نیز اندکی از جاوا اسکریپت استفاده می کنیم اما شما نیازی به بلد بودن جاوا اسکریپت ندارید. چون از جاوا اسکریپت در حد انتخاب المنت های موجود در Html و تغییر style آن ها استفاده می شود که قبل از پیاده سازی هر پروژه تمام نکات و کد های لازم جاوا اسکریپت در این زمینه آموزش داده می شوند.
اما اگر خودتان با جاوا اسکریپت کار کرده باشید می توانید خارج از موارد داخل دوره، خلاقیت های بیشتری روی پروژه ها پیاده سازی کنید.
معرفی
فصل اول – بررسی مفاهیم و اصطلاحات
فصل دوم – مروری بر Media Query
فصل سوم – نامگذاری به روش BEM
فصل چهارم – پروژه سایت شرکتی
1استخراج فایل های مورد نیاز از طرح17:27
2ایجاد ساختار اولیه پروژه20:33
3افزودن و ویرایش کد های مورد نیاز23:13
4کد نویسی Container18:36
5کد نویسی ساختار Html بخش Header22:48
6کد نویسی همبرگر منو بخش اول20:18
7کد نویسی همبرگر منو بخش دوم12:46
8کد نویسی NavMenu برای موبایل16:16
9کد نویسی Menu برای دسکتاپ19:04
10تکمیل بخش Header(Nav)00:15:15
11نوشتن کامنت های بخش Header5:02
12کد نویسی بخش HeaderContent17:41
13ریسپانسیو سازی بخش HeaderContent16:28
14مرور بر مفاهیم و رفع اشکالات14:26
15ریزکاری های بخش Header – اتمام Header17:10
16شروع Main – کد نویسی ساختار Html بخش Services21:03
17کد نویسی Css بخش Services13:16
18ریسپانسیو سازی بخش Services – اتمام Services15:23
19کد نویسی ساختار Html بخش Destinations15:55
20کد نویسی Css بخش Destinations17:33
21کد نویسی Css بخش Destinations-Place جلسه اول15:55
22کد نویسی Css بخش Destinations-Place جلسه دوم9:29
23ریسپانسیو سازی بخش Destinations13:18
24ریزکاری های بخش Destinations – اتمام Destinations11:08
25کد نویسی ساختار Html بخش Newsletter18:50
26کد نویسی Css بخش Newsletter جلسه اول20:07
27کد نویسی Css بخش Newsletter جلسه دوم18:53
28ریسپانسیو سازی بخش Newsletter – اتمام Newsletter20:20
29کد نویسی ساختار Html بخش Footer جلسه اول13:33
30کد نویسی ساختار Html بخش Footer جلسه دوم16:57
31کد نویسی Css بخش Footer جلسه اول18:21
32کد نویسی Css بخش Footer جلسه دوم15:30
33ریسپانسیو سازی بخش Footer – اتمام Footer23:49
34رفع باگ ها و تکمیل پروژه بخش اول14:29
35رفع باگ ها و تکمیل پروژه بخش دوم – اتمام پروژه سایت شرکتی19:41
36بازبینی و اصلاحیه پروژه15:26
37فشرده سازی تصاویر و فایل های Css – اضافه کردن پیشوند کد های Css20:00
38سخن پایانی – پایان فصل چهارم2:05
39آزمون پایانی فصل چهارم
فصل پنجم – پیاده سازی Grid System
1سیستم گرید(Grid System) چیست؟9:53
2توضیح نقاط شکست(Breakpoints) و کلمات کلیدی مربوطه11:32
3کد نویسی کلاس row و col12:49
4نحوه محاسبه عرض ستون ها15:05
5کد نویسی تمامی کلاس های col + تمرین13:40
6حل تمرین جلسه قبل – توضیح نحوه استفاده از ردیف و ستون16:16
7ایجاد ستون های ریسپانسیو جلسه اول12:03
8ایجاد ستون های ریسپانسیو جلسه دوم9:17
9تمرین – پیاده سازی طرح با سیستم گرید9:39
10حل تمرین جلسه قبل – پایان فصل پنجم10:07
11آزمون پایانی فصل پنجم
فصل ششم – پروژه سایت شخصی
1فایل های مورد نیاز و خروجی گرفتن از طرح16:21
2ایجاد ساختار پروژه و دسته بندی فایل های مورد نیاز12:22
3تحلیل طرح سایت شخصی15:38
4کد نویسی ساختار Html بخش Header5:32
5کد نویسی Css بخش Header جلسه اول15:45
6کد نویسی Css بخش Header جلسه دوم15:46
7کد نویسی Css بخش Header جلسه سوم12:49
8ریسپانسیو سازی بخش Header15:52
9تکمیل بخش Header12:22
10کد نویسی ساختار Html بخش Home13:19
11کد نویسی Css بخش Home جلسه اول17:49
12کد نویسی Css بخش Home جلسه دوم16:11
13ریسپانسیو سازی بخش Home جلسه اول13:14
14ریسپانسیو سازی بخش Home جلسه دوم19:21
15تکمیل بخش Home00:28:43
16کد نویسی ساختار Html بخش About us00:13:14
17کد نویسی Css کامپوننت Sections00:12:08
18کد نویسی Css بخش About us جلسه اول00:14:54
19کد نویسی Css بخش About us جلسه دوم7:41
20ریسپانسیو سازی بخش About us – اتمام About us14:58
21کد نویسی ساختار Html بخش Services00:10:06
22کد نویسی Css بخش Services00:16:23
23ریسپانسیو سازی بخش Services – اتمام Services20:18
24تحلیل ساختار بخش Resume جلسه اول00:14:05
25تحلیل ساختار بخش Resume جلسه دوم00:08:24
26کد نویسی ساختار Html بخش Resume00:12:20
27کد نویسی Css بخش Resume جلسه اول00:13:27
28کد نویسی Css بخش Resume جلسه دوم00:15:58
29کد نویسی Javascript بخش Resume جلسه اول00:08:03
30کد نویسی Css بخش Resume جلسه سوم00:15:58
31کد نویسی Javascript بخش Resume جلسه دوم16:44
32ریسپانسیو سازی بخش Resume – اتمام Resume22:17
33کد نویسی ساختار Html بخش Portfolio12:46
34کد نویسی Css بخش Portfolio13:17
35ریسپانسیو سازی SwiperJs بخش Portfolio9:55
36ریسپانسیو سازی بخش Portfolio00:05:28
37کد نویسی NavigationTabs بخش Portfolio15:58
38بازنویسی و بهبودی کد های Javascript بخش Portfolio – اتمام Portfolio9:27
39کد نویسی ساختار Html بخش Pricing00:09:36
40کد نویسی Css بخش Pricing جلسه اول00:09:08
41کد نویسی Css بخش Pricing جلسه دوم11:42
42ریسپانسیو سازی بخش Pricing – اتمام Pricing00:02:51
43کد نویسی ساختار Html بخش Contact us00:10:58
44کد نویسی Css بخش Contact us جلسه اول00:11:41
45کد نویسی Css بخش Contact us جلسه دوم00:12:33
46کد نویسی Css بخش Contact us جلسه سوم00:07:48
47ریسپانسیو سازی بخش Contact us – اتمام Contact us00:04:39
48کد نویسی ساختار Html بخش Footer4:07
49کد نویسی Css بخش Footer00:12:21
50ریسپانسیو سازی بخش Footer – اتمام Footer00:02:56
51اصلاح و بهبود جزئیات پروژه21:02
52رفع مشکل تار شدن متن ها هنگام استفاده از ()skew00:14:21
53کد نویسی Javascript بخش Scroll to section13:49
54مقدمه ای بر Intersection Observer API13:04
55تکمیل نهایی بخش Scroll پروژه توسط Intersection Observer00:10:14
56مقدمه ای بر Dark mode و بررسی روش های پیاده سازی00:13:17
57پیاده سازی Dark mode جلسه اول – ایجاد دکمه Switch Theme00:10:27
58پیاده سازی Dark mode جلسه دوم – تغییر رنگ ها00:11:57
59پیاده سازی Dark mode جلسه سوم – تغییر رنگ ها00:08:06
60پیاده سازی Dark mode جلسه چهارم – ذخیره تم در LocalStorage – اتمام پروژه سایت شخصی14:09
61بررسی فایل های نهایی پروژه و نکات مربوطه7:47
62حل مشکل Tap Highlight عناصر00:09:40
نظرات
قوانین ثبت دیدگاه
- دیدگاه های نامرتبط به دوره تایید نخواهد شد.
- سوالات مرتبط با رفع اشکال در این بخش تایید نخواهد شد.
- از درج دیدگاه های تکراری پرهیز نمایید.
- اگر نیاز به پشتیبانی دوره دارید از قسمت پرسش سوال در قسمت نمایش انلاین استفاده نمایید
240,000 تومان 156,000 تومان
سرفصل های دوره
برای مشاهده و یا دانلود دوره روی کلمه لینک کلیک کنید!
AFROOZ.sh.71( خریدار محصول )
سلام استاد وقتتون بخیر
چقدر عالی تدریس کردید و چقدر فن بیانتون خوبه و اینکه چقدر نکات کاربردی رو بیان می کنید واقعا ممنونم
حمیدرضا عبادی(مدرس)( خریدار محصول )
سلام
زنده باشی، خواهش میکنم🌹
موفق و پیروز باشید.
itsme9901( خریدار محصول )
آقای عبادی عزیز خسته نباشید دمتون گرم دوره خیلی خوبی بود.. نحوه تدریس بی نظیر + لحن بیان عالی!
حمیدرضا عبادی(مدرس)( خریدار محصول )
سلام، خواهش میکنم، شما لطف دارید، شماهم خسته نباشی
ممنون از نظرتون🌹
medz( خریدار محصول )
سلام استاد عبادي عزيز
با تشكر از زحمات جنابعالي بابت اين آموزش عالي جسارتاً فصل ششم آموزش
45 – کد نویسی Css بخش Contact us جلسه دوم (در ليست دانلود شماره 105)
متاسفانه در قسمت پيوست به جاي فايل كدها، اشتباهاً خود فيلم درس مجدداً گذاشته شده است و فايل RAR. پيوست وجود ندارد حال خواهشمندم لطف فرماييد و فايل پيوست اين آموزش را قرار دهيد. بهترينها را براي جنابعالي و خانواده محترمتان آرزومندم.
با سپاس فراوان
حمیدرضا عبادی(مدرس)( خریدار محصول )
سلام
خواهش میکنم زنده باشید.
بله درسته، جلسه 105 الان ویرایش کردم و فایل پیوست رو قرار دادم میتونید استفاده بفرمایید.
ممنون از اطلاع رسانیتون🌹