Carlos Henrique
Front-end engineer at Holmes
-
Maintenance
-
Evolution
-
Many projects
evolutionary build
Task Runner
Today
gulp-angular-generator
Project 1
Project 2
Project 3
Project 4
Project 5
Projects
Maintenance
Component
Project 1
Project 2
Project 3
Project 4
Project 5
Component
C
C
C
C
C
basebuild-angular
+
Tools
Tools
gulp.task('myTask', [/* deps */], function(){
return gulp.src('src/**/*.json')
.pipe(gulp.dest('dist'));
});Streams?
- Streams are like channels, where data can flow through it
- You can access data chunk by chunk
- Readable, writable or both
Streams
http.createServer(function(request, response){
response.writeHead(200);
response.write("<p>first text</p>");
setTimeout(function(){
response.write("<p>Last text</p>");
response.end();
}, 5000);
}).listen(8080);Readable
Writable
Writable
Streams
http.createServer(function(request, response){
response.writeHead(200);
request.on('readable', function(){
var chunk;
while(null !== (chunk = request.read()) ){
response.write(chunk);
}
});
request.on('end', function(){
response.end();
});
}).listen(8080);Readable
All streams are EventEmitters
Streams
http.createServer(function(request, response){
response.writeHead(200);
request.pipe(response);
}).listen(8080);Readable
All streams are EventEmitters
gulp.task('myTask', [/* deps */], function(){
return gulp.src('src/**/*.json')
.pipe(gulp.dest('dist'));
});basebuild-angular
node_module
Show me the code!!
How it works?
Node module
Gulp
npm
How it works?
Gulp
== {}
{
tasks: []
}Only the host project must install gulp
How it works?
node
module
node_modules
- dependenceX
- MyComponent
+ node_modules
Project
Only the host project must install gulp
Last words...
- Create your component as a node_module
- Install gulp
- Install your component
- Require your component in Gulpfile
The end
evolutionary build
By Carlos Henrique
