Automate your workflow.

When writing code, your time is valuable.

Even with a “simple” website, you may have multiple Sass/SCSS files and multiple JavaScript files that need to be compiled. Gulp can compile, bundle, and optimize files– and much more, with its customizable workflow.

You may have heard of Gulp but never tried it out. Or, you may know the basics, but you can’t figure out how to get Browsersync or cache busting to work.

No matter your experience level with Gulp, this course will get you up and running with an automated workflow that you can use in all your front-end projects.

What is Gulp?

Gulp.js is a build tool that can compile your Sass and JavaScript files, import Node modules, optimize images, cache bust, and run a local Browsersync server, among other things.

Best of all, it will watch your files and re-run everything every time you make a code change!

Instead of having to do all those tasks manually, Gulp will quickly run them all for you.

Why Gulp?

I personally love using Gulp because it’s fast and doesn’t require a ton of configuration.

If you are building a React/Vue/Angular app, I would actually use Webpack or Parcel over Gulp. But Gulp is great for basic website projects with Sass and vanilla JavaScript. Webpack is a bit overkill for smaller projects like that, in my opinion.

Who is this course for?

If you already know the basics of HTML, CSS, Sass/SCSS, and JavaScript, and are simply looking for a way to make your workflow more efficient with Gulp, this course is for you!

You might be:

  • Any developer who wants to make your Sass and JavaScript workflow more efficient.
  • A professional developer who needs to know how to use Gulp at work.
  • Someone who wants to get up and running with a simple website project without needing Webpack.

Note: If you’re more of a complete beginner, I’d recommend learning those basics of HTML, CSS, Sass, and JavaScript first before jumping into this.

What’s in the course?

70-page digital book + 3 hours of video tutorials (Complete Course)

Here’s what the course covers:

Introduction and setup

  • Gulp and Node.js
  • Setting up Gulp
  • Concepts in Gulp
  • Initial file setup

Sass workflow

  • Sass files setup
  • Creating the Sass task
  • Configuring Autoprefixer with Browserslist
  • Creating the default Gulp task
  • Running a local server
  • Adding Font Awesome locally
  • Adding Font Awesome via npm

JavaScript workflow

  • Creating the JavaScript task
  • Compiling ES6 to ES5 with Babel
  • Bundling required Node modules with Browserify

Utility Gulp functions

  • Minifying images
  • Cache busting

Optimizing Gulp

  • Run a local Browsersync server
  • Detect and update Browsersync with a Gulp watch task
  • Configuring dev and production Gulp tasks

Why should I buy this course?

The Gulp.js website has pretty good documentation, and you can find blog posts and YouTube videos about Gulp. But there is definitely a lack of material online about more advanced topics in Gulp like Browsersync, Babel, cache busting, and importing Node modules.

If you’d rather not dig through docs and various blog posts, you can get all the information in one place right here! This course covers most of the scenarios that you might need Gulp for.

In addition, when I teach I make sure to explain not only what to do, but why we’re doing it.

I’ll take you step by step through setting up your workspace in VS Code, and even explain the basics of Node.js and npm and how they relate to Gulp.

Still not sure?

Check out a sample section of the course here:

Also, get all the source code for free on GitHub!

Ready to buy?

Gulp 4 for Beginners

Complete Course

  • 3 hours of video tutorials
  • 70-page book (PDF)
  • Lifetime updates
Buy Now

Frequently Asked Questions

What happens if I have a question or get stuck on something?

You can email me at [email protected] and I’ll help you with any problems you may run into during the course 🙂

How long can I access the course?

You will have access to the course as long as you’re a student!

Is there a country-specific discount?

Unfortunately, I don’t have one in place at the moment, but will keep it in mind for the future!

Can I get a refund?

Of course. If you’re not satisfied with the course, send an email to [email protected] from the email you purchased the course with, and a copy of your receipt and I’ll refund you 100%.

I have another question that wasn’t listed above.

No problem, just email me at [email protected] and I’ll help you out!

About the author

Hey there, I’m Jessica Chan. I’ve been a professional web developer for 8 years, working in both the back and front ends. I help people learn to code on my blog, and can also be found on InstagramYouTube, and occasionally Twitter.

As a self-taught developer, I know it can be incredibly difficult to learn to code and change careers. But it’s also really fun and rewarding. I love helping others learn web development through writing and teaching.