Gulp - Build a Web Developer Starter Kit

Name: Gulp - Build a Web Developer Starter Kit
Rating: 4.5 (195 reviews)

Automate your local environment with javascript

Created byJoe Santos Garcia

Last updated 6/2018

English

English [Auto],

What you'll learn

Automate your Environment for Web Development
Compile your SASS to CSS
Compile your ES6 to Javascript
Auto reloading

Course content

2 sections • 12 lectures • 1h 39m total length

Introduction7:53
Learn how to build a starter kit by using npm or yarn to download packages, gulp for tasks, babel to convert es6 to es5, and webpack to bundle modules.
only prerequisites3:17
Install node, the only prerequisite, using the Windows executable or macOS homebrew, then verify with node -v and npm -v.
Setup Our Project4:39

Installing packages and gulp9:19
Explore the package manager and install packages with npm, distinguishing global and local installs. Learn how dependencies and dev dependencies populate node_modules and how package.json tracks them, with yarn usage.
Gulp Tasks4:13
Define Gulp tasks like print name and print age, orchestrate them with a shuffle to run in order, and demonstrate the default task execution.
Gulp SASS8:01
Learn to integrate gulp with the sass plugin to compile scss into css, configure a starter kit, and output results to a public css directory.
CSS Auto Prefixers6:06
Learn to use vendor prefixes with autoprefixer so CSS properties like display:flex work across browsers; automate with gulp tasks that run Sass and autoprefixer before exporting CSS.
Watch files and run tasks4:47
Browsersync and live reloading12:16
learn to set up browser-sync with gulp to run a local server and auto reload the page as you edit files, using a starter kit workflow.
Minify our css6:20
Minify our css by integrating the gulp-clean-css plugin, creating a production task, and ensuring the public assets are cleaned and compact with source maps for debugging.
Setting up webpack and babel27:47
Set up webpack and babel to bundle assets for a react and es2015 project, configure entry and output, and enable live reload via gulp integration.
Conclusion4:30
Explore extending a gulp-based web developer starter kit with plugins and scripts, adapt to future frameworks and bundlers, and configure production tasks and builds.

Requirements

Any Windows, Mac, Or Linux computer
Basic Javascript

Description

Learn to automate your environment for web development by building a web developer starter kit. This is one of the most important skill all developers should have. Learn to compile your SASS to CSS to get new features for styling your websites. Also learn to work with webpack and babel to be able to work with the latest javascript features. In this course you will learn everything you need to become a modern developer.

Who this course is for:

Any one who is a developer or looking to become a developer
If you are looking to automate your environment

Gulp - Build a Web Developer Starter Kit

What you'll learn

Explore related topics

Course content

Introduction3 lectures • 16min

Gulp JS9 lectures • 1hr 23min

Requirements

Description

Who this course is for: