پیشنهاد فرادرس

آشنایی با Grunt

دسته بندی ها: آموزش LESS ، آموزش های پلورال سایت (Pluralsight) ، آموزش طراحی وب ، آموزش Sass ، آموزش جاوااسکریپت (Javascript) ، آموزش CSS

آشنایی-با-grunt

Grunt چیست؟

Grunt یک نرم افزار کاربردی برای بهینه سازی عکس ها، فایل های CSS، فایل های Javascript ، کامپایل فایلهای Sass و Less و ... می باشد که امکانات زیادی در اختیار شما قرار می دهد.

در صورتی که یک طراح وب هستید استفاده از این نرم افزار را برای شما توصیه می کنیم.

بهینه سازی فایل های CSS و Javascript که اصطلاحا به آن Minify کردن می گویند با حذف فضاهای خالی فایل حجم آن را کاهش می دهد و این کاهش حجم تاثیر مطلوبی در سرعت بارگذاری سایت دارد.

در این دوره آموزشی از موسسه Pluralsight با Grunt آشنا می شوید.

سرفصل های دوره آموزشی:

  • Grunt چیست؟
  • نصب و پیکربندی Grunt
  • پروژه ساده : نصب و پیکربندی Grunt
  • ایجاد یک اسکریپت Grunt ساده
  • پروژه ساده : ایجاد یک اسکریپت Grunt ساده
  • کار با JavaScript
  • کامپایل کردن TypeScript به JavaScript
  • پروژه ساده : کامپایل کردن TypeScript به JavaScript
  • کار با JavaScript
  • اعتبارسنجی JavaScript با JSHint
  • فشرده سازی JavaScript با Uglify
  • پاک کردن فایل ها و پوشه ها
  • کار با HTML و CSS در Grunt
  • کار با اسناد HTML
  • فشرده سازی اسناد HTML
  • تبدیل فایل ها به CSS
  • نسخه آزمایشی :کار با اسناد CSS
  • فشرده سازی اسناد CSS
  • معرفی Grunt پیشرفته - سفارشی کردن کارها
  • استفاده از Grunt
  • تنظیمات سفارشی کارها
  • تنظیم دستی کارها
  • ساخت سفارشی Grunt Plugins
  • پروژه ساده : ساخت سفارشی Grunt Plugins
  • ساخت Grunt Plugins چندکاره

عنوان دوره آموزشی: Introduction to Grunt سطح: متوسط مدت زمان: 2 ساعت و 13 دقیقه نویسنده: Derik Whittakerلیست سرفصل های دوره آموزشی:

Take a real world look at how to use Grunt to manipulate your HTML, CSS, and JavaScript files for your web application. We will explore each of these concepts in depth, along with how to create and deploy custom Grunt Packages to the NPM repository.

Introduction 02:04 Grunt: What Is This Thing? 04:16 How to Install and Configure Grunt 01:10 Demo: How to Install and Configure Grunt 02:55 Creating a Simple Hello World Grunt Script 00:35 Demo: Creating a Simple Hello World Grunt Script 05:03 Summary 00:42 Working With JavaScript 00:36:07 Introduction 01:22 Compiling TypeScript to JavaScript 01:42 Demo: Compiling TypeScript to JavaScript 06:29 Working With JavaScript 03:49 Demo: Validating JavaScript With JSHint 06:29 Demo: Compressing JavaScript With Uglify 09:01 Demo: Cleaning Up Files and Folders With Clean 06:16 Summary 00:54 Working With HTML and CSS in Grunt 00:38:51 Introduction 01:49 Overview for Working With HTML and CSS. 04:10 Demo: Linting HTML Documents 04:50 Demo: Compressing HTML Documents 06:10 Demo: Converting LESS files to CSS 06:57 Demo: Linting CSS Documents 06:40 Demo: Compressing CSS Documents 06:46 Summary 01:25 Advanced Grunt - Custom Tasks and Plugins 00:42:00 Introduction 01:57 Using Grunt-Init to Kickstart Your Projects 01:49 Demo: Using Grunt-init to Kickstart Your Projects 04:08 Creating Custom, Inline Tasks 01:46 Demo: Creating Custom, Inline Tasks 04:04 Demo: Making Your Custom Tasks Configurable 03:45 Creating Custom Grunt Plugins 04:12 Demo: Using Grunt-init to Scaffold a Plugin 03:50 Demo: Creating Our First Grunt Plugin 06:13 Demo: Creating a MultiTask Grunt Plugin 05:31 Demo: How to Deploy Our Plugin to the NPM Registry 03:18 Summary 01:20

حجم فایل: 383MB

آیا این نوشته را دوست داشتید؟
Pluralsight Introduction to Grunt

پیشنهاد فرادرس