SlideShare a Scribd company logo
1 of 52
Download to read offline
Frontend 
workflow
Gulp 4 and the like
By /Damien Seguin @dmnsgn
FRENCH Creative Developer at UNIT9,
Rockstar
/GitHub Twitter
What are the common components of our current workflow?
What is new in Gulp 4?
Are task-runner still relevant? What to expect in 2016?
What are the common
components in our current
workflow?
Package manager
Module system/syntax
Module loader/bundler
Task runner / Build system
Package Manager
Handles dependencies
Package: a set of files that are bundled together
and can be installed and removed as a group.
Centralisation (one database/registry to pull data from)
Installation/uninstallation (one command to execute)
Upgrade (versionning)
Link Dependencies (avoid dependency hell)
Two main competitors
Bower: "A package manager for the web"
: "npm is the package manager for JavaScript"
but also JSPM
Bower
$ bower install underscore#1.0.3
$ bower install backbone # with underscore as a dependency
Unable to find a suitable version for underscore, please choose one:
1) underscore#1.0.3 which resolved to 1.0.3 and is required by bowerexample
2) underscore#>=1.7.0 which resolved to 1.8.3 and is required by backbone#1.2.3
.
└── bower_components
├── backbone
└── underscore
$ npm install -g bower
$ npm install underscore@1.0.3
$ npm install backbone # with underscore as a dependency
.
└── node_modules
├── backbone
│   └── node_modules
│   └── underscore
└── underscore
$ npm uninstall underscore
$ npm dedupe
underscore@1.8.3
node_modules/backbone/node_modules/underscore -> node_modules/underscore
npm and front-end packaging
npm as a front-end package manager by @kewah
npm is only for CommonJS!
npm is only for server-side JavaScript!
JSPM
Dynamically loads ES6 modules in browsers and NodeJSSystemJS:
: list of packages and their endpointRegistry
$ jspm install npm:react
$ jspm install github:angular/bower-angular
$ jspm install react
"react": "npm:react",
.
├── config.js
├── jspm_packages
└── package.json
Other attempts
JamJS
DuoJS
VoloJS
Component
Ender
...
Module system/syntax
Defines a way of writing modular code
No built-in support in JS for modules
ES6 to the rescue
ES5 Global
AMD
CommonJS
ES6 modules
ES5
Module pattern (MusicPlayer.js)
var MusicPlayerModule = (function() {
var currentTrack = undefined;
return {
play: function(track) {
currentTrack = ajax.getTrackObject();
},
getTitle: function() {
return currentTrack.title;
}
};
})();
Usage
<script src="scripts/MusicPlayer.js"></script>
// Get track and play it
var trackId = 'EOUyefhfeaku';
MusicPlayerModule.play(trackId);
// Get module state: currentTrack
MusicPlayerModule.getTitle();
AMD
Module (MusicPlayer.js)
define('MusicPlayerModule', ['ajax'], function (requester) {
var currentTrack = undefined;
return {
play: function(track) {
currentTrack = requester.getTrackObject();
},
getTitle: function() {
return currentTrack.title;
}
};
});
Import (main.js)
define('main', ['MusicPlayerModule'], function (MusicPlayer) {
var trackId = 'EOUyefhfeaku';
MusicPlayer.play(trackId);
MusicPlayer.getTitle();
});
CommonJS
Module (MusicPlayer.js)
var requester = require('../utils/ajax.js');
var currentTrack = undefined;
exports.play = function(track) {
currentTrack = requester.getTrackObject();
};
exports.getTitle = function() {
return currentTrack.title;
}
Import (main.js)
const MusicPlayer = require('./MusicPlayer.js');
var trackId = 'EOUyefhfeaku';
MusicPlayer.play(trackId);
MusicPlayer.getTitle();
ES6
Module (MusicPlayer.js)
import requester from '../utils/ajax.js';
let currentTrack = undefined;
export function play(track) {
currentTrack = requester.getTrackObject();
}
export function getTitle() {
return currentTrack.title;
}
Import (main.js)
import { play, getTitle } from './MusicPlayer.js';
var trackId = 'EOUyefhfeaku';
play(trackId);
getTitle();
Module loader/bundler
Ship modules to the browser
Modules Implementation status: in development
Interpreted? More Compiled/Transpiled
Bundle to a single JS file
RequireJS
Browserify
Webpack
JSPM & SystemJS ( )
Rollup
ES6 Module Loader
> Bullet point comparison
RequireJS
Pros
Syntax: mostly AMD (CommonJS support not ideal)-
Works in the browser directly-
RequireJS optimizer to bundle/minify-
Cons
Not suited for server side/client application-
Some cryptic error messages-
Browserify
Pros
Syntax: CommonJS (+ deAMDify & debowerify)-
Backed up by the huge npm community-
Client-side and server-side modules-
Shim Node.js modules-
(deAMDify translate AMD modules to Node-
style modules automatically)
- List of transforms
Cons
Need a tool to watch and bundle ( )- watchify
Tightly bound to Node.js ecosystem-
Webpack
Pros
Syntax: CommonJS and AMD-
Doesn't try to be compatible with node.js at all costs-
Client-side and server-side modules-
(UglifyJsPlugin)- List of plugins
Cons
Configuration over convention-
More features in its core (less modular) but also a pro-
> browserify for webpack users
JSPM featuring SystemJS
Pros
Syntax:- ES6, CommonJS, AMD...
Compliant with the ES6 modules specification and future-friendly-
No bundling needed (like RequireJS) = no watcher-
Bundling optional-
(similar to Webpack loaders plugins)- List of plugins
Cons
Needs better performances-
...but doesn't matter in dev since bundling is not needed-
Rollup
Pros
Syntax:- ES6, CommonJS, AMD...
... but can only optimize ES6 modules-
- live-code inclusion aka tree-shaking
- List of plugins
Cons
Yet another module bundler-
...but will probably be integrated into- SystemJS
> rollup-starter-project
Rollup tree shaking
utils.js
var foo = {};
foo.a = 1;
var bar = {};
bar.b = 2;
export { foo, bar };
main.js
import { foo, bar } from './utils.js';
console.log( foo.a );
bundle.js
'use strict';
var foo = {};
foo.a = 1;
console.log( foo.a );
Task runner / Build system
Automate
grunt
gulp
Grunt
Gulp
Other attempts
Broccoli
Brunch
FlyJS
...
State of affairs
Task Runner Usage
Gulp 44%
Grunt 28%
Others 9%
No task runner 20%
Source: The State of Front-End Tooling – 2015
What is new in Gulp 4?
What is Gulp?
Changes in Gulp 4
What is Gulp?
Gulp Stream
Gulp API
Gulp CLI
Gulp: The streaming build system.
Grunt: multiple file read/write (requires src and dest)
Gulp: streams src.pipe(b).pipe(c).pipe(d)
Gulp API
.src() and .dest()
gulp.src([`${config.src}/images/**/*`, `!${config.src}/images/{sprite,sprite/**}`])
A 'glob' is a pattern that allow us to select or exclude a set of files.
=> returns a stream that we can 'pipe'
.pipe(imagemin())
=> transforms the files from the stream (minify them)
.pipe(gulp.dest(`${config.dist}/images`));
=> writes the minified files to the system
gulp.src([`${config.src}/images/**/*`, `!${config.src}/images/{sprite,sprite/**}`])
.pipe(imagemin())
.pipe(gulp.dest(`${config.dist}/images`));
Gulp API
.task() and .watch()
gulp.task('images', function() {
return gulp.src([`${config.src}/images/**/*`, `!${config.src}/images/{sprite,sprite/**}`
.pipe(imagemin())
.pipe(gulp.dest(`${config.dist}/images`));
});
=> programmatic API for task dependencies and .watch()
gulp.task('serve', ['images', 'takeABreak', 'smile'], function() {
// Serve once the images, takeABreak and smile tasks have completed
...
});
gulp.watch(`${config.src}/images/**/*`, ['images']);
=> ... and more importantly to the CLI
$ gulp images
Gulp CLI
$ gulp <task> <othertask>
$ npm install gulp-cli -g
gulp --gulpfile <gulpfile path> # will manually set path of gulpfile.
gulp --cwd <dir path> # will manually set the CWD.
gulp --tasks # will display the task dependency tree for the loaded gulpfile.
gulp --verify # will verify plugins in package.json against the plugins blacklist
Full list of arguments
Changes in Gulp 4
$ npm install -g gulpjs/gulp-cli#4.0
package.json
"devDependencies": {
"gulp": "github:gulpjs/gulp#4.0",
...
}
Slight API changes
New task system
See dmnsgn/gulp-frontend-boilerplate
Slight API changes
gulp.src()
gulp.dest()
gulp.watch()
gulp.task() (new syntax) 3 arguments
gulp.parallel()
gulp.series()
+ gulp.symlink(), gulp.lastRun(), gulp.tree(), gulp.registry()
gulp.series() and gulp.parallel()
using run-sequence (Gulp 3)
runSequence(
['markup', 'styles', 'scripts', 'images'],
['serve', 'watch'],
callback
);
index.js (Gulp 4)
gulp.series(
gulp.parallel(markup, 'styles', 'scripts', 'images'),
gulp.parallel(serve, watch)
)
New task system
Gulp 3
gulp.task('serve', ['markup', 'styles', 'scripts'], function(done) {
return browserSync.init({}, done);
});
Gulp 4 (two arguments syntax)
images.js
export function optimizeImages() { ... }
export function generateSpritesheet() { ... }
export function generateFavicons() { ... }
gulpfile.js
import { optimizeImages, generateSpritesheet, generateFavicons } from './images';
...
gulp.task(
'images',
gulp.parallel(optimizeImages, generateSpritesheet, generateFavicons)
);
Gulp 4 (one argument syntax)
gulpfile.js
CLI
var gulp = require('gulp');
var del = require('del');
gulp.task(function clean() {
return del([`./dist/**`, `!./dist`,`!./dist/static/**`];
});
$ gulp clean
Reusable modules
clean.js
gulpfile.js
import 'del' from 'del';
export function clean() {
return del([`./dist/**`, `!./dist`,`!./dist/static/**`]);
}
import { clean } from './clean';
...
gulp.task(clean);
Are task-runner still relevant?
What to expect in 2016?
npm scripts to replace task-runner
JS fatigue
 scripts
Should we stop using build tools like Gulp?
How to use npm scripts
Are npm scripts the solution?
Should we stop using build tools like Gulp?
Plugins often an existing NodeJS package
Rely on global dependencies (grunt-cli, gulp-cli, broccoli-cli...)
Most tasks can be achieved using basic terminal commands
wrapper around
How to use   scripts
$ npm start # default script
$ npm run script-name # custom script
package.json
{
"devDependencies": {
"babelify": "^6.1.x",
"browser-sync": "^2.7.x",
"browserify": "^10.2.x",
"npm-run-all": "^1.5.0",
...
},
"scripts": {
"dev": "npm-run-all --parallel dev:scripts dev:styles serve",
"build": "npm-run-all --parallel build:scripts build:styles rimraf dist/*.map",
"clean": "rimraf dist/{*.css,*.js,*.map}",
"serve": "browser-sync start --server 'dist' --files 'dist/*.css, dist/*.html, dist/*.js' --n
"dev:scripts": "watchify -d src/scripts/main.js -t [babelify] -o dist/main.js",
"dev:styles": "stylus src/styles/main.styl -w -o dist/ -m",
"build:scripts": "browserify -d src/scripts/main.js -t [babelify] -o dist/main.js && uglifyjs
"build:styles": "stylus src/styles/main.styl -o dist/ -c"
}
}
Are npm scripts the solution?
pros
Fast configuration and build
All config in one place: package.json
No extra global dependency
...& cons
Readability of the commands
Compatibility between UNIX and Windows systems
2016
JavaScript fatigue
Doctor's prescription
JS fatigue
A new JS framework a day
Too many tools
2015: JavaScript tool X was useful
2016: Make X easier to install/setup/use for all new
users. Minimize dependency & configuration hell.
— Addy Osmani (@addyosmani) January 8, 2016
Controversial articles (some probably missing the point)
- Stop pushing the web forward
- Javascript Fatigue
- State of the Union.js
- Solar system of JS
Why it is not a problem if you keep the UX in mind
by- The Controversial State of JavaScript Tooling Nicolás
Bevacqua (@ponyfoo)
by- Why I love working with the web Remy Sharp (@rem)
by- If we stand still, we go backwards Jake Archibald
(@jaffathecake)
Just because it's there, doesn't mean you must
learn it and use it. [...] No one can be an expert in
the whole web. [...] The great thing about the web
is it doesn't hit 1.0 and stop, it's continual.
Piece of advice (my two-penn'orth)
Pick styleguides
Pick the right scaffold
Stick with it (at least this year)
Stay curious though
Frontend JS workflow - Gulp 4 and the like

More Related Content

What's hot

Improving your workflow with gulp
Improving your workflow with gulpImproving your workflow with gulp
Improving your workflow with gulpfrontendne
 
How to integrate front end tool via gruntjs
How to integrate front end tool via gruntjsHow to integrate front end tool via gruntjs
How to integrate front end tool via gruntjsBo-Yi Wu
 
Getting started with gulpjs
Getting started with gulpjsGetting started with gulpjs
Getting started with gulpjsunmesh dusane
 
60分鐘完送百萬edm,背後雲端ci/cd實戰大公開
60分鐘完送百萬edm,背後雲端ci/cd實戰大公開60分鐘完送百萬edm,背後雲端ci/cd實戰大公開
60分鐘完送百萬edm,背後雲端ci/cd實戰大公開KAI CHU CHUNG
 
Introduction to Grunt.js on Taiwan JavaScript Conference
Introduction to Grunt.js on Taiwan JavaScript ConferenceIntroduction to Grunt.js on Taiwan JavaScript Conference
Introduction to Grunt.js on Taiwan JavaScript ConferenceBo-Yi Wu
 
TDC2016SP - Esqueça Grunt ou Gulp. Webpack and NPM rule them all!
TDC2016SP -  Esqueça Grunt ou Gulp. Webpack and NPM rule them all!TDC2016SP -  Esqueça Grunt ou Gulp. Webpack and NPM rule them all!
TDC2016SP - Esqueça Grunt ou Gulp. Webpack and NPM rule them all!tdc-globalcode
 
Gulp and bower Implementation
Gulp and bower Implementation Gulp and bower Implementation
Gulp and bower Implementation Prashant Shrestha
 
Gulp - the streaming build system
Gulp - the streaming build systemGulp - the streaming build system
Gulp - the streaming build systemSergey Romaneko
 
Zero Downtime Deployment with Ansible
Zero Downtime Deployment with AnsibleZero Downtime Deployment with Ansible
Zero Downtime Deployment with AnsibleStein Inge Morisbak
 
Gearman work queue in php
Gearman work queue in phpGearman work queue in php
Gearman work queue in phpBo-Yi Wu
 
Live deployment, ci, drupal
Live deployment, ci, drupalLive deployment, ci, drupal
Live deployment, ci, drupalAndrii Podanenko
 
GulpJs - An Introduction
GulpJs - An IntroductionGulpJs - An Introduction
GulpJs - An IntroductionKnoldus Inc.
 
Screenshot as a service
Screenshot as a serviceScreenshot as a service
Screenshot as a serviceKAI CHU CHUNG
 
JavaScript code academy - introduction
JavaScript code academy - introductionJavaScript code academy - introduction
JavaScript code academy - introductionJaroslav Kubíček
 
Continuous Integration & Continuous Delivery with GCP
Continuous Integration & Continuous Delivery with GCPContinuous Integration & Continuous Delivery with GCP
Continuous Integration & Continuous Delivery with GCPKAI CHU CHUNG
 

What's hot (20)

Gulp - The Streaming Build System
Gulp - The Streaming Build SystemGulp - The Streaming Build System
Gulp - The Streaming Build System
 
Improving your workflow with gulp
Improving your workflow with gulpImproving your workflow with gulp
Improving your workflow with gulp
 
How to integrate front end tool via gruntjs
How to integrate front end tool via gruntjsHow to integrate front end tool via gruntjs
How to integrate front end tool via gruntjs
 
Chef training Day4
Chef training Day4Chef training Day4
Chef training Day4
 
Getting started with gulpjs
Getting started with gulpjsGetting started with gulpjs
Getting started with gulpjs
 
Chef training Day5
Chef training Day5Chef training Day5
Chef training Day5
 
60分鐘完送百萬edm,背後雲端ci/cd實戰大公開
60分鐘完送百萬edm,背後雲端ci/cd實戰大公開60分鐘完送百萬edm,背後雲端ci/cd實戰大公開
60分鐘完送百萬edm,背後雲端ci/cd實戰大公開
 
Introduction to Grunt.js on Taiwan JavaScript Conference
Introduction to Grunt.js on Taiwan JavaScript ConferenceIntroduction to Grunt.js on Taiwan JavaScript Conference
Introduction to Grunt.js on Taiwan JavaScript Conference
 
TDC2016SP - Esqueça Grunt ou Gulp. Webpack and NPM rule them all!
TDC2016SP -  Esqueça Grunt ou Gulp. Webpack and NPM rule them all!TDC2016SP -  Esqueça Grunt ou Gulp. Webpack and NPM rule them all!
TDC2016SP - Esqueça Grunt ou Gulp. Webpack and NPM rule them all!
 
Chef training - Day3
Chef training - Day3Chef training - Day3
Chef training - Day3
 
Gulp and bower Implementation
Gulp and bower Implementation Gulp and bower Implementation
Gulp and bower Implementation
 
Gulp - the streaming build system
Gulp - the streaming build systemGulp - the streaming build system
Gulp - the streaming build system
 
Zero Downtime Deployment with Ansible
Zero Downtime Deployment with AnsibleZero Downtime Deployment with Ansible
Zero Downtime Deployment with Ansible
 
Gearman work queue in php
Gearman work queue in phpGearman work queue in php
Gearman work queue in php
 
Live deployment, ci, drupal
Live deployment, ci, drupalLive deployment, ci, drupal
Live deployment, ci, drupal
 
GulpJs - An Introduction
GulpJs - An IntroductionGulpJs - An Introduction
GulpJs - An Introduction
 
Screenshot as a service
Screenshot as a serviceScreenshot as a service
Screenshot as a service
 
JavaScript code academy - introduction
JavaScript code academy - introductionJavaScript code academy - introduction
JavaScript code academy - introduction
 
Chef training - Day2
Chef training - Day2Chef training - Day2
Chef training - Day2
 
Continuous Integration & Continuous Delivery with GCP
Continuous Integration & Continuous Delivery with GCPContinuous Integration & Continuous Delivery with GCP
Continuous Integration & Continuous Delivery with GCP
 

Similar to Frontend JS workflow - Gulp 4 and the like

CollabSphere 2021 - DEV114 - The Nuts and Bolts of CI/CD With a Large XPages ...
CollabSphere 2021 - DEV114 - The Nuts and Bolts of CI/CD With a Large XPages ...CollabSphere 2021 - DEV114 - The Nuts and Bolts of CI/CD With a Large XPages ...
CollabSphere 2021 - DEV114 - The Nuts and Bolts of CI/CD With a Large XPages ...Jesse Gallagher
 
Warsaw Frontend Meetup #1 - Webpack
Warsaw Frontend Meetup #1 - WebpackWarsaw Frontend Meetup #1 - Webpack
Warsaw Frontend Meetup #1 - WebpackRadosław Rosłaniec
 
Data integration with embulk
Data integration with embulkData integration with embulk
Data integration with embulkTeguh Nugraha
 
Angular JS in 2017
Angular JS in 2017Angular JS in 2017
Angular JS in 2017Ayush Sharma
 
Node.js basics
Node.js basicsNode.js basics
Node.js basicsBen Lin
 
Rails Engine | Modular application
Rails Engine | Modular applicationRails Engine | Modular application
Rails Engine | Modular applicationmirrec
 
Webpack: your final module bundler
Webpack: your final module bundlerWebpack: your final module bundler
Webpack: your final module bundlerAndrea Giannantonio
 
Workflow automation for Front-end web applications
Workflow automation for Front-end web applicationsWorkflow automation for Front-end web applications
Workflow automation for Front-end web applicationsMayank Patel
 
How and why i roll my own node.js framework
How and why i roll my own node.js frameworkHow and why i roll my own node.js framework
How and why i roll my own node.js frameworkBen Lin
 
Illia shestakov - The Future of Java JDK #9
Illia shestakov - The Future of Java JDK #9Illia shestakov - The Future of Java JDK #9
Illia shestakov - The Future of Java JDK #9Anna Shymchenko
 
Tutorial to setup OpenStreetMap tileserver with customized boundaries of India
Tutorial to setup OpenStreetMap tileserver with customized boundaries of IndiaTutorial to setup OpenStreetMap tileserver with customized boundaries of India
Tutorial to setup OpenStreetMap tileserver with customized boundaries of IndiaArun Ganesh
 
2017-03-11 02 Денис Нелюбин. Docker & Ansible - лучшие друзья DevOps
2017-03-11 02 Денис Нелюбин. Docker & Ansible - лучшие друзья DevOps2017-03-11 02 Денис Нелюбин. Docker & Ansible - лучшие друзья DevOps
2017-03-11 02 Денис Нелюбин. Docker & Ansible - лучшие друзья DevOpsОмские ИТ-субботники
 
Infrastructure as code - Python Saati #36
Infrastructure as code - Python Saati #36Infrastructure as code - Python Saati #36
Infrastructure as code - Python Saati #36Halil Kaya
 
Puppet at Opera Sofware - PuppetCamp Oslo 2013
Puppet at Opera Sofware - PuppetCamp Oslo 2013Puppet at Opera Sofware - PuppetCamp Oslo 2013
Puppet at Opera Sofware - PuppetCamp Oslo 2013Cosimo Streppone
 
Improving build solutions dependency management with webpack
Improving build solutions  dependency management with webpackImproving build solutions  dependency management with webpack
Improving build solutions dependency management with webpackNodeXperts
 
Automating Your Workflow with Gulp.js - php[world] 2016
Automating Your Workflow with Gulp.js - php[world] 2016Automating Your Workflow with Gulp.js - php[world] 2016
Automating Your Workflow with Gulp.js - php[world] 2016Colin O'Dell
 
10 Cool Facts about Gradle
10 Cool Facts about Gradle10 Cool Facts about Gradle
10 Cool Facts about GradleEvgeny Goldin
 
Grunt & Front-end Workflow
Grunt & Front-end WorkflowGrunt & Front-end Workflow
Grunt & Front-end WorkflowPagepro
 

Similar to Frontend JS workflow - Gulp 4 and the like (20)

CollabSphere 2021 - DEV114 - The Nuts and Bolts of CI/CD With a Large XPages ...
CollabSphere 2021 - DEV114 - The Nuts and Bolts of CI/CD With a Large XPages ...CollabSphere 2021 - DEV114 - The Nuts and Bolts of CI/CD With a Large XPages ...
CollabSphere 2021 - DEV114 - The Nuts and Bolts of CI/CD With a Large XPages ...
 
Warsaw Frontend Meetup #1 - Webpack
Warsaw Frontend Meetup #1 - WebpackWarsaw Frontend Meetup #1 - Webpack
Warsaw Frontend Meetup #1 - Webpack
 
Data integration with embulk
Data integration with embulkData integration with embulk
Data integration with embulk
 
Angular JS in 2017
Angular JS in 2017Angular JS in 2017
Angular JS in 2017
 
Node.js basics
Node.js basicsNode.js basics
Node.js basics
 
Rails Engine | Modular application
Rails Engine | Modular applicationRails Engine | Modular application
Rails Engine | Modular application
 
Browserify
BrowserifyBrowserify
Browserify
 
Webpack: your final module bundler
Webpack: your final module bundlerWebpack: your final module bundler
Webpack: your final module bundler
 
Workflow automation for Front-end web applications
Workflow automation for Front-end web applicationsWorkflow automation for Front-end web applications
Workflow automation for Front-end web applications
 
How and why i roll my own node.js framework
How and why i roll my own node.js frameworkHow and why i roll my own node.js framework
How and why i roll my own node.js framework
 
Illia shestakov - The Future of Java JDK #9
Illia shestakov - The Future of Java JDK #9Illia shestakov - The Future of Java JDK #9
Illia shestakov - The Future of Java JDK #9
 
Java 9
Java 9Java 9
Java 9
 
Tutorial to setup OpenStreetMap tileserver with customized boundaries of India
Tutorial to setup OpenStreetMap tileserver with customized boundaries of IndiaTutorial to setup OpenStreetMap tileserver with customized boundaries of India
Tutorial to setup OpenStreetMap tileserver with customized boundaries of India
 
2017-03-11 02 Денис Нелюбин. Docker & Ansible - лучшие друзья DevOps
2017-03-11 02 Денис Нелюбин. Docker & Ansible - лучшие друзья DevOps2017-03-11 02 Денис Нелюбин. Docker & Ansible - лучшие друзья DevOps
2017-03-11 02 Денис Нелюбин. Docker & Ansible - лучшие друзья DevOps
 
Infrastructure as code - Python Saati #36
Infrastructure as code - Python Saati #36Infrastructure as code - Python Saati #36
Infrastructure as code - Python Saati #36
 
Puppet at Opera Sofware - PuppetCamp Oslo 2013
Puppet at Opera Sofware - PuppetCamp Oslo 2013Puppet at Opera Sofware - PuppetCamp Oslo 2013
Puppet at Opera Sofware - PuppetCamp Oslo 2013
 
Improving build solutions dependency management with webpack
Improving build solutions  dependency management with webpackImproving build solutions  dependency management with webpack
Improving build solutions dependency management with webpack
 
Automating Your Workflow with Gulp.js - php[world] 2016
Automating Your Workflow with Gulp.js - php[world] 2016Automating Your Workflow with Gulp.js - php[world] 2016
Automating Your Workflow with Gulp.js - php[world] 2016
 
10 Cool Facts about Gradle
10 Cool Facts about Gradle10 Cool Facts about Gradle
10 Cool Facts about Gradle
 
Grunt & Front-end Workflow
Grunt & Front-end WorkflowGrunt & Front-end Workflow
Grunt & Front-end Workflow
 

Recently uploaded

IP addressing and IPv6, presented by Paul Wilson at IETF 119
IP addressing and IPv6, presented by Paul Wilson at IETF 119IP addressing and IPv6, presented by Paul Wilson at IETF 119
IP addressing and IPv6, presented by Paul Wilson at IETF 119APNIC
 
Company Snapshot Theme for Business by Slidesgo.pptx
Company Snapshot Theme for Business by Slidesgo.pptxCompany Snapshot Theme for Business by Slidesgo.pptx
Company Snapshot Theme for Business by Slidesgo.pptxMario
 
Unidad 4 – Redes de ordenadores (en inglés).pptx
Unidad 4 – Redes de ordenadores (en inglés).pptxUnidad 4 – Redes de ordenadores (en inglés).pptx
Unidad 4 – Redes de ordenadores (en inglés).pptxmibuzondetrabajo
 
SCM Symposium PPT Format Customer loyalty is predi
SCM Symposium PPT Format Customer loyalty is prediSCM Symposium PPT Format Customer loyalty is predi
SCM Symposium PPT Format Customer loyalty is predieusebiomeyer
 
『澳洲文凭』买拉筹伯大学毕业证书成绩单办理澳洲LTU文凭学位证书
『澳洲文凭』买拉筹伯大学毕业证书成绩单办理澳洲LTU文凭学位证书『澳洲文凭』买拉筹伯大学毕业证书成绩单办理澳洲LTU文凭学位证书
『澳洲文凭』买拉筹伯大学毕业证书成绩单办理澳洲LTU文凭学位证书rnrncn29
 
TRENDS Enabling and inhibiting dimensions.pptx
TRENDS Enabling and inhibiting dimensions.pptxTRENDS Enabling and inhibiting dimensions.pptx
TRENDS Enabling and inhibiting dimensions.pptxAndrieCagasanAkio
 
ETHICAL HACKING dddddddddddddddfnandni.pptx
ETHICAL HACKING dddddddddddddddfnandni.pptxETHICAL HACKING dddddddddddddddfnandni.pptx
ETHICAL HACKING dddddddddddddddfnandni.pptxNIMMANAGANTI RAMAKRISHNA
 
Cybersecurity Threats and Cybersecurity Best Practices
Cybersecurity Threats and Cybersecurity Best PracticesCybersecurity Threats and Cybersecurity Best Practices
Cybersecurity Threats and Cybersecurity Best PracticesLumiverse Solutions Pvt Ltd
 
『澳洲文凭』买詹姆士库克大学毕业证书成绩单办理澳洲JCU文凭学位证书
『澳洲文凭』买詹姆士库克大学毕业证书成绩单办理澳洲JCU文凭学位证书『澳洲文凭』买詹姆士库克大学毕业证书成绩单办理澳洲JCU文凭学位证书
『澳洲文凭』买詹姆士库克大学毕业证书成绩单办理澳洲JCU文凭学位证书rnrncn29
 

Recently uploaded (9)

IP addressing and IPv6, presented by Paul Wilson at IETF 119
IP addressing and IPv6, presented by Paul Wilson at IETF 119IP addressing and IPv6, presented by Paul Wilson at IETF 119
IP addressing and IPv6, presented by Paul Wilson at IETF 119
 
Company Snapshot Theme for Business by Slidesgo.pptx
Company Snapshot Theme for Business by Slidesgo.pptxCompany Snapshot Theme for Business by Slidesgo.pptx
Company Snapshot Theme for Business by Slidesgo.pptx
 
Unidad 4 – Redes de ordenadores (en inglés).pptx
Unidad 4 – Redes de ordenadores (en inglés).pptxUnidad 4 – Redes de ordenadores (en inglés).pptx
Unidad 4 – Redes de ordenadores (en inglés).pptx
 
SCM Symposium PPT Format Customer loyalty is predi
SCM Symposium PPT Format Customer loyalty is prediSCM Symposium PPT Format Customer loyalty is predi
SCM Symposium PPT Format Customer loyalty is predi
 
『澳洲文凭』买拉筹伯大学毕业证书成绩单办理澳洲LTU文凭学位证书
『澳洲文凭』买拉筹伯大学毕业证书成绩单办理澳洲LTU文凭学位证书『澳洲文凭』买拉筹伯大学毕业证书成绩单办理澳洲LTU文凭学位证书
『澳洲文凭』买拉筹伯大学毕业证书成绩单办理澳洲LTU文凭学位证书
 
TRENDS Enabling and inhibiting dimensions.pptx
TRENDS Enabling and inhibiting dimensions.pptxTRENDS Enabling and inhibiting dimensions.pptx
TRENDS Enabling and inhibiting dimensions.pptx
 
ETHICAL HACKING dddddddddddddddfnandni.pptx
ETHICAL HACKING dddddddddddddddfnandni.pptxETHICAL HACKING dddddddddddddddfnandni.pptx
ETHICAL HACKING dddddddddddddddfnandni.pptx
 
Cybersecurity Threats and Cybersecurity Best Practices
Cybersecurity Threats and Cybersecurity Best PracticesCybersecurity Threats and Cybersecurity Best Practices
Cybersecurity Threats and Cybersecurity Best Practices
 
『澳洲文凭』买詹姆士库克大学毕业证书成绩单办理澳洲JCU文凭学位证书
『澳洲文凭』买詹姆士库克大学毕业证书成绩单办理澳洲JCU文凭学位证书『澳洲文凭』买詹姆士库克大学毕业证书成绩单办理澳洲JCU文凭学位证书
『澳洲文凭』买詹姆士库克大学毕业证书成绩单办理澳洲JCU文凭学位证书
 

Frontend JS workflow - Gulp 4 and the like