Skip to content

Get Start with Gulp | Getting Start with Gulp 4 | A Starter-kit for Frontend development using Gulp 4, SCSS/SASS, LESS, Babel, Bootstrap, Browser Sync, HTML Templating, Html minify, Js minify, CSS minify

License

Notifications You must be signed in to change notification settings

kathirr007/gulpGetStart

Repository files navigation

gulpGetStart

A Getting start Gulp Workflow boiler-plate for Front end Dev to automate your workflow

Please check the site built using this workflow here or here

Usage

  • Run npm install.
  • Run gulp or npm run dev for development.
  • Run gulp build or npm run build for production build.

Scaffolding

  • Clone this repository
  • Change the remote url
  • Run npm install
  • Update npm dependencies with npm install npm-check -g and then npm-check -u

What is this repository for?

Automations added

  • Updating a file whenever it is changed so you don’t have to run a command to update it.
  • Refreshing the browser automatically when needed so you don’t have to alt-tab and hit the refresh button manually.
  • Compile SCSS/SASS/LESS/CSS files when needed without reloading the page for style changes.
  • Auto-prefixer for newer css styles prefix for ['last 4 version'] when needed without reloading the page for style changes.
  • Stream the compiled css when needed without reloading the page for style changes.
  • Optimizing your CSS, JavaScript, images and running every optimization you need to make sure your website is wicked fast.

Development Phase

There are three objectives for the development phase. They are:

  • gulp tasks: clean, images, fonts, styles, html, watch, browserSync.
  • default task that chains everything created into a single task.
  • build task that builds project for production.

Optimization Phase

  • strip-css-comments and cssnano for CSS.
  • uglify for JS.

Useful resources

Thanks

Based on the video tutorial course Gulp.js: Web Project Workflows by Ray Villaloboss

About

Get Start with Gulp | Getting Start with Gulp 4 | A Starter-kit for Frontend development using Gulp 4, SCSS/SASS, LESS, Babel, Bootstrap, Browser Sync, HTML Templating, Html minify, Js minify, CSS minify

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published