قیمت این دوره: 300,000 تومان
  • مدرس دوره : امید پیشکار
  • تعداد ویدیوها : 46 ویدیو
  • مدت زمان دوره : 16:26:00
  • سطح دوره : متوسط
  • وضعیت دوره : به اتمام رسیده
  • تاریخ آخرین بروزرسانی : 1401/03/01
ثبتـــ نام در این دوره ثبت نام در دوره
آموزش طراحی وب سایت

آموزش طراحی وب سایت

در این دوره سعی شده تا با bootstrap , tailwind , sass , javascript شش پروژه را انجام دهیم .

همچنین در این دوره ابتدا sass و tailwind را آموزش خواهیم داد و بعد پروژه را انجام خواهیم داد ، پس در نتیجه sass و tailwind جزو پیش نیاز های دوره نمی باشد.

در این دوره تمرین هایی نیز وجود دارند که اگر دانشجویان به مطالب گفته شده دقت کند میتواند آن تمرین را انجام دهد.

در پایان این دوره شما مسلط به طراحی استاتیک وب به کمک html , css , sass , bootstrap , tailwind  خواهید بود و همچنین صفحات وب خود را به کمک javaScript میتوانید داینامیک کنید.

دانشجو بعد از این دوره میتواند به سراغ framework دلخواه خود برود و آنرا فرا بگیرد.

سرفصل های دوره : 

معرفی دوره

پروژه اول : طراحی پروژه با Bootstrap

آموزش Sass

پروژه دوم : طراحی پروژه با Sass

آموزش پایه Tailwind

پروژه سوم : طراحی پروژه با Tailwind

پروژه چهارم : طراحی پروژه Parallax js

پروژه پنجم : ایجاد Todo List

پروژه ششم : ایجاد SPA ( single  page application )

 

 



پیش نیاز های دوره :

  1. آموزش طراحی وب مقدماتی
  2. bootstrap
  3. javaScript

فهرستـــ ویدیوها

مدت زمان دوره 16:26:00

  • با مشاهده آنلاین جلسات در سایت ، هزینه اینترنت شما به صورت نیم بها محاسبه خواهد شد.

1

  • معرفی دوره

00:08:00

معرفی دوره

2

  • فایل های مورد نیاز پروژه اول

    • نمایش آنلاین این بخش رایگان است
00:10:47

در این ویدیو فایل های مورد نیاز برای پروژه اول را اضافه خواهیم کرد.

3

  • طراحی بخش Header

    • نمایش آنلاین این بخش رایگان است
00:49:55

در این ویدیو بخش Header را طراحی خواهیم کرد.

4

  • طراحی بخش Page Section

00:19:16

در این ویدیو بخش Page Section را طراحی خواهیم کرد.

5

  • طراحی بخش About us

00:13:47

در این ویدیو بخش About us را طراحی خواهیم کرد.

6

  • طراحی بخش Out Services

00:15:47

در این ویدیو بخش Our Services را طراحی خواهیم کرد.

7

  • طراحی بخش Check now

00:19:23

در این ویدیو بخش check now را طراحی خواهیم کرد.

8

  • طراحی بخش Pricing Plane

00:32:14

در این ویدیو بخش Pricing Plane را طراحی خواهیم کرد.

9

  • طراحی بخش Seo brand و Blog

00:26:32

در این ویدیو دو بخش از پروژه را طراحی خواهیم کرد. بخش های Seo Brand و Blog

10

  • طراحی بخش Footer

00:33:56

در این ویدیو بخش Footer را طراحی خواهیم کرد.

11

  • اضافه کردن انیمیشن ها به پروژه

00:27:39

در این ویدیو انیمیشن ها را به پروژه اضافه خواهیم کرد و پروژه اول به پایان خواهد رسید.

12

  • آموزش Sass - بخش اول

    • نمایش آنلاین این بخش رایگان است
00:37:54

در این ویدیو به آموزش بخش اول Sass خواهیم پرداخت

13

  • آموزش Sass - بخش دوم

00:39:48

در این ویدیو به آموزش موارد باقی مانده در sass خواهیم پرداخت.

14

  • ایجاد mixin های مورد نیاز برای پروژه دوم

00:30:20

در این ویدیو چند mixin که مورد نیاز است را طراحی خواهیم کرد تا در ادامه طراحی کار ساده تری داشته باشیم.

15

  • طراحی بخش Navbar از پروژه دوم

00:24:32

در این ویدیو اولین بخش از پروژه دوم را طراحی خواهیم کرد.

16

  • تکمیل بخش Header

00:24:44

در این ویدیو بخش header را طراحی خواهیم کرد.

17

  • طراحی بخش اول introduction

00:19:46

این بخش شامل دو قسمت است که در این ویدیو بخش اول آنرا طراحی خواهیم کرد.

18

  • طراحی بخش دوم introduction

00:15:33

در این ویدیو بخش آخر introduction را طراحی خواهیم کرد.

19

  • طراحی بخش Screen shot

00:10:13

در این ویدیو بخش screen shot را طراحی خواهیم کرد.

20

  • طراحی بخش Package

00:26:00

در این ویدیو یک بخش دیگر از پروژه sass را طراحی خواهیم کرد.

21

  • طراحی بخش creator

00:11:14

در این ویدیو یک بخش دیگر از پروژه sass را طراحی خواهیم کرد.

22

  • طراحی بخش download

00:13:37

در این ویدیو بخش download را طراحی خواهیم کرد.

23

  • طراحی بخش Footer

00:16:03

در این ویدیو بخش پایانی پروژه Sass را طراحی خواهیم کرد.

24

  • آموزش tailwindcss

00:17:01

در این ویدیو به آموزش و راه اندازی tailwind خواهیم پرداخت

25

  • طراحی بخش Navbar

00:33:43

در این ویدیو بخش اول ( navbar ) را طراحی خواهیم کرد.

26

  • طراحی بخش introduction

00:31:33

در این ویدیو بخش دوم پروژه Tailwind را طراحی خواهیم کرد.

27

  • طراحی بخش Category

00:27:07

در این ویدیو بخش Category از پروژه Tailwind را طراحی خواهیم کرد.

28

  • طراحی بخش Celling

00:18:00

در این ویدیو بخش Celling را طراحی خواهیم کرد.

29

  • طراحی بخش Easy and Fast

00:29:40

در این ویدیو یک بخش دیگر از پروژه را طراحی خواهیم کرد.

30

  • طراحی بخش Reviews

00:26:45

در این ویدیو بخش reviews را طراحی خواهیم کرد.

31

  • طراحی بخش Partners

00:09:29

در این ویدیو بخش partners را طراحی خواهیم کرد.

32

  • طراحی بخش Subscribe

00:27:49

در این ویدیو بخش subscribe را طراحی خواهیم کرد.

33

  • طراحی بخش Footer

00:35:39

در این ویدیو بخش footer را طراحی خواهیم کرد.

34

  • طراحی پروژه Parallax

00:15:41

در این ویدیو به طراحی پروژه Parallax خواهیم پرداخت

35

  • معرفی پروژه Todo List

00:31:57

در این ویدیو به آشنایی و ایجاد بخشی از پروژه Todo List خواهیم پرداخت.

36

  • اضافه کردن آیتم ها به DOM

00:12:42

در این ویدیو یک بخش دیگر از پروژه todo list را طراحی خواهیم کرد.

37

  • اضافه کردن آیتم جدید به data و به DOM

00:18:47

در این ویدیو ابتدا اطلاعات جدید به data اضافه میشود و سپس آنرا نمایش میدهیم

38

  • انجام event های حذف و انجام todo ها

00:18:38

در این ویدیو بخشی دیگر از پروژه را انجام خواهیم داد.

39

  • اعمال فیلتر بر روی data ها و نمایش تغییرات خواسته شده در DOM

00:15:46

در این ویدیو بخشی دیگر از پروژه را طراحی خواهیم کرد.

40

  • ذخیره اطلاعات در localStorage

00:14:10

در این ویدیو کار با localStorage را تمرین خواهیم کرد.

41

  • نکات تکمیلی برای پروژه های دیگر

00:13:43

در این ویدیو به بررسی بعضی از نکات میپردازیم که در ایجاد پروژه های دیگر به کمک شما می آیند.

42

  • معرفی پروژه SPA

00:04:33

در این ویدیو به معرفی پروژه جدید خواهیم پرداخت.

43

  • ایجاد توابع لازم

00:21:24

در این ویدیو کلیت کار انجام میشود.

44

  • تکمیل پروژه SPA

00:12:43

در این ویدیو پروژه single page application به پایان میرسد.

45

  • نصب tailwind

00:16:40

در این ویدیو tailwind را به صورت global به کمک npm نصب خواهیم کرد.

46

  • معرفی پروژه جدید - سایت فروشگاهی

00:05:35

در این قسمت به معرفی پروژه و سورس کد پرداخته ام.

اینستاگرام
تلگرام

نظرات کاربران در رابطه با این دوره

لطفا سوالات خود را راجع به این آموزش در این بخش پرسش و پاسخ مطرح کنید به سوالات در قسمت نظرات پاسخ داده نخواهد شد و آن نظر حذف میشود.
جهت ثبت نظر باید در سایت عضو شوید و یا وارد سایت شده باشید .