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
91
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
WAF に頼りすぎない AWS WAF 運用術 meguro sec #1
izzii
0
450
データ基盤の成長を加速させる:アイスタイルにおける挑戦と教訓
tsuda7
3
610
30分でわかる『アジャイルデータモデリング』
hanon52_
8
1.5k
Building Products in the LLM Era
ymatsuwitter
5
1.4k
マルチデータプロダクト開発・運用に耐えるためのデータ組織・アーキテクチャの遷移
mtpooh
1
400
AWSでRAGを実現する上で感じた3つの大事なこと
ymae
3
950
DeepSeek on AWS
hariby
1
200
依存関係があるコンポーネントは Barrel ファイルでまとめよう
azukiazusa1
3
500
Culture Deck
optfit
0
200
Googleマップ/Earthが一般化した 地図タイルのイマ
mapconcierge4agu
1
180
実践!OpenTelemetry
oracle4engineer
PRO
0
210
Active Directory の保護
eurekaberry
7
3.8k
Featured
See All Featured
Fontdeck: Realign not Redesign
paulrobertlloyd
82
5.4k
What's in a price? How to price your products and services
michaelherold
244
12k
What’s in a name? Adding method to the madness
productmarketing
PRO
22
3.3k
No one is an island. Learnings from fostering a developers community.
thoeni
21
3.1k
Designing on Purpose - Digital PM Summit 2013
jponch
117
7.1k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
113
50k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
33
2k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
29
2.4k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
280
13k
[RailsConf 2023] Rails as a piece of cake
palkan
53
5.2k
Speed Design
sergeychernyshev
25
780
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