آموزش Gulp 4: گردش کار توسعه خود را خودکار کنید

Gulp 4: Automate your development workflow

نکته: آخرین آپدیت رو دریافت میکنید حتی اگر این محتوا بروز نباشد.
توضیحات دوره: فرآیندهای توسعه خود را با جعبه ابزار Gulp 4 به طور خودکار تنظیم کنید و گردش کار توسعه را با Gulp خودکار کنید (پیش پردازش سبک های sass و کمتر، کوچک سازی html/css/javascript، الحاق فایل های جاوا اسکریپت، بهینه سازی و ذخیره سازی تصاویر، نقشه های منبع، ترجمه جاوا اسکریپت Babel، زبان قالب بندی کیت html) پیش نیازها: مبانی HTML، مبانی CSS، مبانی جاوا اسکریپت

این دوره در مورد چیست؟

در این دوره آموزشی یاد خواهید گرفت که چگونه کارهای روزمره و خسته کننده را با Gulp 4 خودکار کنید. ویرایشگر کد دوره ویژوال استودیو کد است (اگرچه می توانید از هر ویرایشگر کدی استفاده کنید). هدف این دوره برای افراد مبتدی یا افرادی است که تازه وارد Gulp شده اند و به شما یاد می دهد که چگونه یک فایل پیکربندی خوب برای توسعه frontend تنظیم کنید.


جزئیات بیشتر لطفا!

اگر قبلاً نام Gulp را نشنیده‌اید، این یک جعبه ابزار ویژه است که به شما امکان می‌دهد کارهای روتین در توسعه وب را خودکار کنید. در این دوره به شما نشان می دهم که چگونه Gulp 4 را راه اندازی کنید، از پلاگین های مختلف Gulp استفاده کنید، وظایف را بنویسید و تغییرات فایل را پیگیری کنید. در پایان دوره شما یک فایل پیکربندی gulp کاملا کاربردی خواهید داشت که می تواند در پروژه های خود استفاده شود.

ما از اصول اولیه شروع خواهیم کرد. من به شما نشان خواهم داد که چگونه تمام وابستگی های مورد نیاز و خود Gulp را نصب کنید. سپس نحوه نوشتن وظایف و مشاهده تغییرات فایل را بررسی خواهیم کرد. تقریباً در هر درس ما فایل پیکربندی gulp خود را بهبود می‌دهیم و یک ویژگی جدید به آن اضافه می‌کنیم. من همچنین فایل پیکربندی کامل gulp را همراه با نظرات اضافی که بیشتر کاربردهای Gulp API، الگوهای glob و راهنمای تنظیم یک کار را توصیف می‌کند، در اختیار شما قرار می‌دهم تا هنگام ایجاد وظایف خود با Gulp، راهنمایی خوبی داشته باشید.

اگر هنوز کارهای معمولی را خودتان انجام می دهید، احتمالا Gulp آن را تغییر خواهد داد. بیایید شروع کنیم!


برای شرکت در دوره چه چیزهایی باید بدانید؟

اصول جاوا اسکریپت، مبانی HTML، مبانی CSS


داخلش چیه؟

  • نصب وابستگی های Gulp

  • نصب Gulp

  • کارهای اصلی Gulp

  • ساختار پروژه

  • پیش پردازش SASS

  • پیش پردازش کمتر

  • مواظب تغییرات فایل باشید

  • نقشه‌های منبع سبک (SASS/LESS)

  • کوچک سازی CSS

  • کوچک سازی جاوا اسکریپت

  • کاهش HTML

  • الحاق جاوا اسکریپت

  • تغییر نام فایل

  • بهینه سازی تصاویر

  • در حال ذخیره تصاویر

  • زبان قالب HTML (کیت)

  • پیوند خودکار CSS

  • درحال ترجمه جاوا اسکریپت بابل

  • بایگانی پروژه

  • فایل پیکربندی Gulp را با نظراتی که می‌توانید در پروژه‌های خود استفاده کنید تکمیل کنید


چه کسی به شما آموزش می دهد؟

اسم من سرگئی اشتیرلوف است. من یک توسعه دهنده frontend هستم. من تقریباً 7 سال است که در این زمینه کار می کنم و امروز نیز به این کار ادامه می دهم. Gulp برای توسعه وب ضروری است و مطمئناً از آن سود خواهید برد!


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

معرفی Introduction

  • معرفی دوره Course introduction

  • ساختار دوره Course structure

  • ابزار Tools

  • فایل های تمرینی Exercise files

معرفی Introduction

  • معرفی دوره Course introduction

  • ساختار دوره Course structure

  • ابزار Tools

  • فایل های تمرینی Exercise files

گلپ: اصول اولیه Gulp: basics

  • معرفی ماژول Module introduction

  • Gulp چیست و چرا باید از آن استفاده کرد؟ What is Gulp and why to use it?

  • وابستگی های Gulp Gulp dependencies

  • نصب Gulp Gulp installation

  • Gulpfile.js و اولین وظیفه ما Gulpfile.js and our first task

  • تکمیل کار سیگنال Gulp Gulp signal task completion

  • ایجاد ساختار پروژه Create project structure

  • تکلیف ساس Sass task

  • کار Sass را به روز کنید Update Sass task

  • نقشه های منبع Sass Sass source maps

  • وظیفه تماشای Gulp Gulp watch task

  • وظیفه همگام سازی مرورگر Gulp Gulp Browser Sync task

  • اضافه کردن html watch task Add html watch task

  • تکلیف 1 Assignment 1

  • خلاصه ماژول Module summary

گلپ: اصول اولیه Gulp: basics

  • معرفی ماژول Module introduction

  • Gulp چیست و چرا باید از آن استفاده کرد؟ What is Gulp and why to use it?

  • وابستگی های Gulp Gulp dependencies

  • نصب Gulp Gulp installation

  • Gulpfile.js و اولین وظیفه ما Gulpfile.js and our first task

  • تکمیل کار سیگنال Gulp Gulp signal task completion

  • ایجاد ساختار پروژه Create project structure

  • تکلیف ساس Sass task

  • کار Sass را به روز کنید Update Sass task

  • نقشه های منبع Sass Sass source maps

  • وظیفه تماشای Gulp Gulp watch task

  • وظیفه همگام سازی مرورگر Gulp Gulp Browser Sync task

  • اضافه کردن html watch task Add html watch task

  • تکلیف 1 Assignment 1

  • خلاصه ماژول Module summary

Gulp: CSS، JS و تصاویر را بهینه کنید Gulp: Optimize CSS, JS and images

  • معرفی ماژول Module introduction

  • CSS minify task CSS minify task

  • JS کار را تماشا و کوچک می کند JS watch and minify task

  • تغییر نام فایل های کوچک شده Rename minified files

  • وظیفه الحاق JS JS concatenation task

  • خطا و راه حل Imagemin Imagemin error and solution

  • کار بهینه سازی تصویر Image optimization task

  • رفع خطای gulp-imagemin Fix gulp-imagemin error

  • وظیفه کش تصویر Image cache task

  • دستور Gulp پیش فرض Default Gulp command

  • تکلیف 2 Assignment 2

  • خلاصه ماژول Module summary

Gulp: CSS، JS و تصاویر را بهینه کنید Gulp: Optimize CSS, JS and images

  • معرفی ماژول Module introduction

  • CSS minify task CSS minify task

  • JS کار را تماشا و کوچک می کند JS watch and minify task

  • تغییر نام فایل های کوچک شده Rename minified files

  • وظیفه الحاق JS JS concatenation task

  • خطا و راه حل Imagemin Imagemin error and solution

  • کار بهینه سازی تصویر Image optimization task

  • رفع خطای gulp-imagemin Fix gulp-imagemin error

  • وظیفه کش تصویر Image cache task

  • دستور Gulp پیش فرض Default Gulp command

  • تکلیف 2 Assignment 2

  • خلاصه ماژول Module summary

Gulp: بهبودهای بیشتر Gulp: further improvements

  • معرفی ماژول Module introduction

  • کار جزئی کیت HTML HTML .kit partials task

  • فایل‌های .kit را شبیه HTML کنید (برجسته‌سازی نحو) Make .kit files look like HTML (syntax highlighting)

  • HTML کوچک کردن HTML minify

  • وظیفه پیشوند خودکار CSS CSS autoprefixer task

  • وظیفه بابل JS JS babel task

  • ساختار gulpfile.js ما را بهینه کنید Optimize our gulpfile.js structure

  • گلپ زیپ Gulp Zip

  • منطقه تمیز Gulp Gulp clean dist

  • رسیدگی به اعلان ها Handle notifications

  • Gulp: تبدیل فایل به سبک مدرن Gulp: Convert file to modern style

  • Gulp وظایف را جداگانه اجرا می کند Gulp execute tasks separately

  • خلاصه Summary

Gulp: بهبودهای بیشتر Gulp: further improvements

  • معرفی ماژول Module introduction

  • کار جزئی کیت HTML HTML .kit partials task

  • فایل‌های .kit را شبیه HTML کنید (برجسته‌سازی نحو) Make .kit files look like HTML (syntax highlighting)

  • HTML کوچک کردن HTML minify

  • وظیفه پیشوند خودکار CSS CSS autoprefixer task

  • وظیفه بابل JS JS babel task

  • ساختار gulpfile.js ما را بهینه کنید Optimize our gulpfile.js structure

  • گلپ زیپ Gulp Zip

  • منطقه تمیز Gulp Gulp clean dist

  • رسیدگی به اعلان ها Handle notifications

  • Gulp: تبدیل فایل به سبک مدرن Gulp: Convert file to modern style

  • Gulp وظایف را جداگانه اجرا می کند Gulp execute tasks separately

  • خلاصه Summary

نتیجه Conclusion

  • فایل پیکربندی Gulp کاملاً برجسته Fully featured Gulp configuration file

  • پایان دوره Course wrap up

نتیجه Conclusion

  • فایل پیکربندی Gulp کاملاً برجسته Fully featured Gulp configuration file

  • پایان دوره Course wrap up

نمایش نظرات

نظری ارسال نشده است.

آموزش Gulp 4: گردش کار توسعه خود را خودکار کنید
خرید اشتراک و دانلود خرید تکی و دانلود | 160,000 تومان (5 روز مهلت دانلود) زمان تقریبی آماده سازی لینک دانلود این دوره آموزشی حدود 5 تا 24 ساعت می باشد.
جزییات دوره
5.5 hours
44
Udemy (یودمی) udemy-small
10 اسفند 1400 (آخرین آپدیت رو دریافت می‌کنید، حتی اگر این تاریخ بروز نباشد.)
1,014
4.3 از 5
دارد
دارد
دارد

Google Chrome Browser

Internet Download Manager

Pot Player

Winrar

Sergey Shtyrlov Sergey Shtyrlov

توسعه دهنده وب، سازنده دوره های آموزشی

Sergey Shtyrlov Sergey Shtyrlov

توسعه دهنده وب، سازنده دوره های آموزشی

Udemy (یودمی)

یودمی یکی از بزرگ‌ترین پلتفرم‌های آموزشی آنلاین است که به میلیون‌ها کاربر در سراسر جهان امکان دسترسی به دوره‌های متنوع و کاربردی را فراهم می‌کند. این پلتفرم امکان آموزش در زمینه‌های مختلف از فناوری اطلاعات و برنامه‌نویسی گرفته تا زبان‌های خارجی، مدیریت، و هنر را به کاربران ارائه می‌دهد. با استفاده از یودمی، کاربران می‌توانند به صورت انعطاف‌پذیر و بهینه، مهارت‌های جدیدی را یاد بگیرند و خود را برای بازار کار آماده کنند.

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