Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Build Tools: Entendendo as Ferramentas de Const...
Search
Rita Lino
August 10, 2019
Technology
1
260
Build Tools: Entendendo as Ferramentas de Construção Front-End
Rita Lino
August 10, 2019
Tweet
Share
More Decks by Rita Lino
See All by Rita Lino
O Mundo Front-End
ritalino
0
96
Clean Code: Escrevendo funções que falam por si só
ritalino
3
280
Criando aplicações acessíveis em React Native
ritalino
2
170
Other Decks in Technology
See All in Technology
incident_commander_demaecan__1_.pdf
demaecan
0
120
やる気のない自分との向き合い方/How to Deal with Your Unmotivated Self
sanogemaru
0
500
All About Sansan – for New Global Engineers
sansan33
PRO
1
1.2k
Findy Team+ QAチーム これからのチャレンジ!
findy_eventslides
0
130
Claude Codeを駆使した初めてのiOSアプリ開発 ~ゼロから3週間でグローバルハッカソンで入賞するまで~
oikon48
2
740
OAuthからOIDCへ ― 認可の仕組みが認証に拡張されるまで
yamatai1212
0
100
ユーザーの声とAI検証で進める、プロダクトディスカバリー
sansantech
PRO
1
140
Codexとも仲良く。CodeRabbit CLIの紹介
moongift
PRO
0
200
Simplifying Cloud Native app testing across environments with Dapr and Microcks
salaboy
0
150
大規模サーバーレスAPIの堅牢性・信頼性設計 〜AWSのベストプラクティスから始まる現実的制約との向き合い方〜
maimyyym
9
4.6k
2025-10-09_プロジェクトマネージャーAIチャンス
taukami
0
140
ガバメントクラウドの概要と自治体事例(名古屋市)
techniczna
2
240
Featured
See All Featured
Site-Speed That Sticks
csswizardry
12
900
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
46
7.7k
Being A Developer After 40
akosma
91
590k
Build your cross-platform service in a week with App Engine
jlugia
232
18k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
45
2.5k
Context Engineering - Making Every Token Count
addyosmani
6
250
Large-scale JavaScript Application Architecture
addyosmani
514
110k
The Language of Interfaces
destraynor
162
25k
jQuery: Nuts, Bolts and Bling
dougneiner
65
7.9k
For a Future-Friendly Web
brad_frost
180
9.9k
Into the Great Unknown - MozCon
thekraken
40
2.1k
The Power of CSS Pseudo Elements
geoffreycrofte
79
6k
Transcript
Build Tools: Entendendo as Ferramentas de Construção Front-End
SOBRE MIM! Rita Lino Caiçara Desenvolvedora Front-End na Creditas Idealizadora
da comunidade "Mulheres na Tecnologia Baixada Santista" @ritalinux @rita-lino
#1
#2
#3
Minification Concatenation Tree Shaking Transpilation Bundling Image Optimization Code Splitting
Compression
Imagina só ter que fazer isso tudo na mão?
É onde as Build Tools entram em cena!
Build Tools Task Runners Bundlers
Build Tools Task Runners Bundlers
Task Runners > Grunt e Gulp Processo de execução Arquivos
temporários no disco local Memória Número de tasks simultâneas Uma Múltiplas Conceito Configuração acima do código Código acima da configuração
Task Runners > npm scripts e yarn
Build Tools Task Runners Bundlers
Bundlers > browserify Analisa todas as chamadas require() da sua
aplicação para criar um bundle que possa ser mandado para o browser em uma única tag <script>
Bundlers > Webpack .js .hbs .css .sass .js .ts .sass
.png .jpg .js .css .png .jpg
Bundlers > Webpack Entry Output ./src/index.js ./dist/main.js ./dist
Loaders Mode Bundlers > Webpack production development none Nos permitem
gerar bundles a partir de qualquer tipo de asset
Tá… mas qual eu uso?
Build Tools possuem uma curva de aprendizado, aprenda o necessário.
Lembre-se: Automatização é a chave da produtividade
Obrigada! @ritalinux @rita-lino Temos vagas! jobs.kenoby.com/creditas