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
160
Other Decks in Technology
See All in Technology
相互運用可能な学修歴クレデンシャルに向けた標準技術と国際動向
fujie
0
210
Claude CodeでKiroの仕様駆動開発を実現させるには...
gotalab555
3
930
LTに影響を受けてテンプレリポジトリを作った話
hol1kgmg
0
320
風が吹けばWHOISが使えなくなる~なぜWHOIS・RDAPはサーバー証明書のメール認証に使えなくなったのか~
orangemorishita
15
5.6k
AIのグローバルトレンド 2025 / ai global trend 2025
kyonmm
PRO
1
120
ホリスティックテスティングの右側も大切にする 〜2つの[はか]る〜 / Holistic Testing: Right Side Matters
nihonbuson
PRO
0
610
【OptimizationNight】数理最適化のラストワンマイルとしてのUIUX
brainpadpr
1
380
Bet "Bet AI" - Accelerating Our AI Journey #BetAIDay
layerx
PRO
4
1.6k
MCP認可の現在地と自律型エージェント対応に向けた課題 / MCP Authorization Today and Challenges to Support Autonomous Agents
yokawasa
5
2k
LIFF CLIとngrokを使ったLIFF/LINEミニアプリのお手軽実機確認
diggymo
0
240
いかにして命令の入れ替わりについて心配するのをやめ、メモリモデルを愛するようになったか(改)
nullpo_head
6
2.2k
JAWS AI/ML #30 AI コーディング IDE "Kiro" を触ってみよう
inariku
3
320
Featured
See All Featured
RailsConf 2023
tenderlove
30
1.2k
YesSQL, Process and Tooling at Scale
rocio
173
14k
Building Applications with DynamoDB
mza
95
6.5k
Building a Scalable Design System with Sketch
lauravandoore
462
33k
The World Runs on Bad Software
bkeepers
PRO
70
11k
Building a Modern Day E-commerce SEO Strategy
aleyda
43
7.4k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
33
2.4k
StorybookのUI Testing Handbookを読んだ
zakiyama
30
6k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
31
2.5k
Become a Pro
speakerdeck
PRO
29
5.5k
Making the Leap to Tech Lead
cromwellryan
134
9.5k
Done Done
chrislema
185
16k
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