Course in GulpJS

Course in application build using GulpJS, both client and server side

GulpJS has in a short time managed to become the most used and appreciated build tool for development of the client-side part of web-applications. One of the reasons is stream pipes, which means that build tasks simply are put together by small build steps.

This course is built around many small practical tasks, which together gives you a good foundation for your further work as a client-side web developer.

This is what you will learn
  • Minification of stylesheets, scripts, images and html files
  • Dynamic browser reload of development web server files
Course Contents

Background and overview

A quick overview why GulpJS was developed and how the domain has developed very quickly during the last years

    Short intro to NodeJS

    Here we quickly go through Node JS and NPM, so that you can use the platform which GulpJS is based on.

    • What is NodeJS
    • Usage of the node package manager NPM
    • Understanding the package.json file

    GulpJS scripts

    Here we go through how a GulpJS script is organized, how to create build steps, handle CLI arguments and much more

    • Anatomy of a gulpjs script
    • Tasks
    • Pipes
    • Recommended project directory structure
    • Source files
    • Destination directory
    • Dependent tasks

    The sample project

    Here we go through the example project, which is used for most of the exercises

    • Directory structure
    • HTML files
    • Stylesheets
    • Javascript files
    • Short intro to Twitter Bootstrap
    • Bower dependencies

    File tasks

    We start with the most basic build steps, like copying, deletion of files and merging of files

    • Copying files to a directory
    • File globing
    • Keeping or changing the folder structure
    • Merging files
    • Deleting files and directories

    Support plugins

    There are some plugins that always should be used

    • Logging with colors
    • Empty pipe steps
    • Debug print outs between pipe steps
    • How to load all project plugins without effort
    • Running tasks in parallel or sequential and how avoid being surprised

    Development server

    Here we show step-by-step how you configurate a plugin that should start a small local web-server that serves your website. Further how you configurate that every time you save any of your source code files your browser will reload all your files automatically

      Production build

      A big part of the build process is about to reduce the sizes of the files that should be deployed. Here we go through how you do.

      • Minifications of webb pages (HTML)
      • Minification of style sheets (CSS)
      • Minification of images (PNG, JPG)
      • Minification of scripts (JS)
      Duration2 Days
      AudienceWeb-applications developer
      Prerequisites Experience of programming of web-applications in HTML/CSS/JS
      • NodeJS
      • GulpJS CLI
      Course Dates
      2020-02-20Stockholm15 000 kr
      2020-03-12Stockholm15 000 kr
      2020-04-02 Stockholm15 000 kr
      2020-04-27Stockholm 15 000 kr
      2020-05-18Stockholm 15 000 kr

      Same-Company Discout

      We offer a 20% discount for additional participants from the same company and at the same course date. Read more here.

      Teaching Language

      Our printed course material is always authored in English. The oral presentation in our classrooms is generally in Swedish, unless all participants agree to that we perform the course in English.

      On-Site Course

      If you order an On-Site course, we will come to you and hold the course in your office. The price is determined by our price model and is based on the number of course days, number of participants and any travel and lodging.

      Read more about out price modell and term of sales here.

      Related Courses
      JavaScript3 BeginnerShow
      NodeJS2 IntermediateShow
      Angular Basics4Beginner Show