SkillSoft Explore Course – Lambers, Inc.

IT Skills Web Development and Graphic Design Scripting JavaScript

Preparing your web files for deployment is an important step in creating a well-functioning web site. In this course, you will learn how to use Gulp.js to clean, validate, and minify your HTML code. In addition, this course covers how to run tasks when the server starts and restarts, how to use browser synchronization, how to compress images, and how to prepare the build folder for your project's deployment. Finally, you will learn how to use Gulp.js to perform unit and integration testing and code coverage testing of your web project.

Asset ID	wd_gulp_a02_it_enus
Course Type	Video Course
Course Category	Web Development and Graphic Design

Objectives
Gulp and HTML Injection start the course use the npm package manager to install wiredep and describe the purpose for using this package in your programs work with wiredep to write your dependencies into your HTML install and use the Gulp inject plugin to write custom dependencies into your HTML use wiredep and inject to remove scripts and styles from your HTML code work with wiredep to automatically add Bower files on install install and use the Gulp htmlhint plugin to validate your HTML code install and use the Gulp htmlmin plugin to minify your HTML code Working with the Server and Browser use the npm package manager to install gulp-nodemon and describe the purpose for using this package in your programs work with nodemon to monitor changes and handle events when working with your code use nodemon to run Gulp tasks when the node server starts and restarts as a result of code changes describe browser synchronization and the purpose for using it when working with your development code use the npm package manager to install browser-sync and how to configure it for use in your program work with the browser-sync module and configure its options use browser-sync to synchronize multiple browsers Preparing the Build Folder use the npm package manager to install the gulp-task-listing package and create a listing of the tasks in your project create a build folder and a Gulp task to copy the fonts to the dist/build folder install the gulp-imagemin package to compress images and create a Gulp task to copy the compressed images to the dist/build folder create tasks to clean the subfolders of the dist/build folder Testing with Gulp use the npm package manager to install mocha and chai and describe how gulp can use them to perform unit testing on your code work with mocha to run unit tests using the command line test runner work with the mocha to run unit tests inside the browser use istanbul with mocha to test code coverage in your projects use the request package to perform server integration testing Practice: Project Building and Testing with Gulp identify what is needed to prepare your HTML code, build and run tasks, create the build folder and perform testing on your projects

Objectives

Gulp and HTML Injection

start the course
use the npm package manager to install wiredep and describe the purpose for using this package in your programs
work with wiredep to write your dependencies into your HTML
install and use the Gulp inject plugin to write custom dependencies into your HTML
use wiredep and inject to remove scripts and styles from your HTML code
work with wiredep to automatically add Bower files on install
install and use the Gulp htmlhint plugin to validate your HTML code
install and use the Gulp htmlmin plugin to minify your HTML code

Working with the Server and Browser

use the npm package manager to install gulp-nodemon and describe the purpose for using this package in your programs
work with nodemon to monitor changes and handle events when working with your code
use nodemon to run Gulp tasks when the node server starts and restarts as a result of code changes
describe browser synchronization and the purpose for using it when working with your development code
use the npm package manager to install browser-sync and how to configure it for use in your program
work with the browser-sync module and configure its options
use browser-sync to synchronize multiple browsers

Preparing the Build Folder

use the npm package manager to install the gulp-task-listing package and create a listing of the tasks in your project
create a build folder and a Gulp task to copy the fonts to the dist/build folder
install the gulp-imagemin package to compress images and create a Gulp task to copy the compressed images to the dist/build folder
create tasks to clean the subfolders of the dist/build folder

Testing with Gulp

use the npm package manager to install mocha and chai and describe how gulp can use them to perform unit testing on your code
work with mocha to run unit tests using the command line test runner
work with the mocha to run unit tests inside the browser
use istanbul with mocha to test code coverage in your projects
use the request package to perform server integration testing

Practice: Project Building and Testing with Gulp

identify what is needed to prepare your HTML code, build and run tasks, create the build folder and perform testing on your projects