continuous delivery e ferramentas javascript
TRANSCRIPT
![Page 1: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/1.jpg)
B r u n o Ta v a r e s , M a r c o s V i n i c i u s
FERRAMENTAS JAVASCRIPT E CONTINUOUS DELIVERY
Programando, automatizando e distribuindo aplicações no mundo JS
![Page 2: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/2.jpg)
2
@bltavares
@bymarkone
![Page 3: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/3.jpg)
AGENDA
▫︎UM POUCO SOBRE O CONTEXTO
▫︎ FUNDAMENTOS
▫︎CONTINUOUS DELIVERY
▫︎ POSSIBILIDADES DO MUNDO JAVASCRIPT
▫︎ SERÁ QUE EU DEVERIA COMPRAR UM CARRO
▫︎ FERRAMENTAS JAVASCRIPT
▫︎ * EXEMPLOS E MAIS EXEMPLO
▫︎ * PALESTRAS E LIVROS
3
![Page 4: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/4.jpg)
UM POUCO SOBRE O CONTEXTOPor que desenvolvedores têm que se preocupar com automatização, testes, qualidade, integração e entrega contínua?
4
![Page 5: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/5.jpg)
CONTEXTO
5
Design Thinking
Lean Startup Agile
![Page 6: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/6.jpg)
DESIGN THINKING
6
“Innovation powered by… direct observation of what people want and need in their lives and what they like or dislike about the way particular products are made, package, marketed, sold and
supported… [It’s] a discipline that uses the designer’s sensibility and methods to match people’s needs with what is technologically
feasible and what viable business strategy can convert into customer value and market
opportunity.” (Tim Brown, IDEO)
![Page 7: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/7.jpg)
LEAN STARTUP
7
“Lean Startup initially advocates the creation of rapid prototypes designed to test market
assumptions and uses costumer feedback to evolve them much faster than more traditional
software then more traditional software engineering practices… Lean Startup processes
reduce waste by increasing frequency of contact with real costumers, therefore testing and
avoiding incorrect market assumptions as early as possible” (Eric Ries)
![Page 8: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/8.jpg)
AGILE SOFTWARE DEVELOPMENT
8
![Page 9: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/9.jpg)
CONTINUOUSDELIVERYA resposta técnica para as necessidades de processo, produto e mercado.
9
![Page 10: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/10.jpg)
3 PRINCÍPIOS DE CONTINUOUS DELIVERY
▫︎Cada mudança deve iniciar um processo de feedback
▫︎O feedback deve ser recebido o mais rápido o possível
▫︎O time de entrega deve receber feedback e então atuar nisto
10
![Page 11: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/11.jpg)
11
At an abstract level, a deployment pipeline is an automated manifestation of your process of getting software from version control into the
hands of your users. ( Jez Humble)
![Page 12: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/12.jpg)
CONTINUOUS DELIVERY
12
Padrões e anti-padrões na automação
de infraestrutura
Quarta - 2:15 - 3:05
P a l e s t r a - Q C O N 2 0 1 5
Ballroom 4
Jeferson Girão & Fábio Santos
![Page 13: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/13.jpg)
POSSIBILIDADES DO MUNDO JAVASCRIPTQuando o NodeJS chegou ele mudou tudo
13
![Page 14: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/14.jpg)
14
https://www.google.com/trends/explore#q=single%20page%20applications%2C%20single%20page%20apps&cmpt=q
![Page 15: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/15.jpg)
15
![Page 16: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/16.jpg)
SHOULD I EVER BUY A CAR?Uma aplicação para descobrir se vale a pena ter um carro ou não
16
![Page 17: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/17.jpg)
17
![Page 18: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/18.jpg)
18
![Page 19: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/19.jpg)
19
![Page 20: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/20.jpg)
THE JAVASCRIPT TOOLKIT
An attempt to organize the recent explosion of Javascript based technologies and frameworks into a coherent toolkit to be used by a web application developer.
20
2.1
![Page 22: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/22.jpg)
Let’s talk about this needs,
And take a look at some tools
22
![Page 23: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/23.jpg)
BASIC BLOCKS OF THE TOOLKIT
▫︎ Infrastructure & Development
▫︎ Testing
▫︎Application & Product
▫︎Utilities & Support
23
![Page 24: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/24.jpg)
INFRASTRUCTURE & DEVELOPMENT
24
![Page 25: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/25.jpg)
SCAFFOLD
25
Several tools. Several ways.
Several Practices. Need to
organize, and give some good
foundation - best practices,
good design.
![Page 26: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/26.jpg)
26
bootstraps seed projects
![Page 27: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/27.jpg)
AUTOMATION
27
Lots of tasks to execute. Compile. Test. Minify. Concat. Uglify. Etc.
![Page 28: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/28.jpg)
28
github.com/broccolijs/broccoli
…ake’s (Make, Rake, etc)
![Page 29: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/29.jpg)
AUTOMATION UTILITIES
29
Tasks that can be put in the build pipeline.
![Page 30: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/30.jpg)
30
minify-tools
concat-tools watch
![Page 31: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/31.jpg)
DEPENDENCY MANAGEMENT
31
Applications are getting complex. They rely on several other libraries and
frameworks.
![Page 32: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/32.jpg)
32
![Page 33: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/33.jpg)
JAVASCRIPT PREPROCESSOR
33
The way you organize code in development time is different the way
you publish your code. Need to do some processing in your javascript files before
using them.
![Page 34: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/34.jpg)
34
github.com/webpack/webpack
![Page 35: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/35.jpg)
OTHER LANGUAGES
35
Have a syntactic sugar element, or even completely different syntax (that in the end turn into javascript to run in the
browser)
![Page 36: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/36.jpg)
36
github.com/clojure/clojurescript
![Page 37: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/37.jpg)
TESTING
37
![Page 38: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/38.jpg)
TEST RUNNER
38
Execute and visualize test results
![Page 39: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/39.jpg)
39
![Page 40: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/40.jpg)
TEST FRAMEWORKS
40
Write tests
![Page 41: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/41.jpg)
41
![Page 42: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/42.jpg)
TESTING END TO END
42
Write tests for the whole application flow
![Page 43: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/43.jpg)
43
github.com/angular/protractor
![Page 44: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/44.jpg)
TEST SUPPORT
44
Support for tests and others helpers
![Page 45: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/45.jpg)
45
![Page 46: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/46.jpg)
APPLICATION & PRODUCT
46
![Page 47: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/47.jpg)
APPLICATION FRAMEWORKS
47
Applications on web are getting complex, need for frameworks that
support app development.
![Page 48: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/48.jpg)
48
Google Closure Tools
![Page 49: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/49.jpg)
APPLICATION UTILITIES
49
Several application features that can be necessary (e.g. routing)
![Page 50: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/50.jpg)
50
![Page 51: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/51.jpg)
DYNAMIC LOADING
51
Big projects are split among several pieces of javascript for the sake of
modularisation. No all of them should be loaded at the same time.
![Page 52: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/52.jpg)
52
github.com/cujojs/curl
github.com/amdjs/amdjs-api
github.com/amdjs/caolan/async
![Page 53: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/53.jpg)
UTILITIES & SUPPORT
53
![Page 54: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/54.jpg)
DOM UTILITIES
54
DOM selection and manipulation, some auxiliary functions, need for utilities that make work simple (and cross-browser)
![Page 55: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/55.jpg)
55
![Page 56: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/56.jpg)
JS UTILITIES
56
Clean code, functional programming style, reactive programming features,
helpers and utilities
![Page 58: Continuous Delivery e Ferramentas Javascript](https://reader034.vdocuments.mx/reader034/viewer/2022051112/55a5ecd91a28ab036b8b461a/html5/thumbnails/58.jpg)
58
Microservices, an unexpected journey: where they came from,
where they're going
Sexta - Keynote
P a l e s t r a - Q C O N 2 0 1 5
Ballroom 1-4
Sam Newman