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
Lass Deinen Computer die langweiligen Sachen ma...
Search
Heiko Mamerow
April 18, 2016
Programming
0
270
Lass Deinen Computer die langweiligen Sachen machen! Automatisierung beim Frontend Coden
Slides meines Vortrages auf dem WordCamp Nürnberg 2016
Heiko Mamerow
April 18, 2016
Tweet
Share
More Decks by Heiko Mamerow
See All by Heiko Mamerow
Datenkompression - Ein praktischer Leitfaden für den Einstieg
heikomamerow
0
430
Stress lass nach
heikomamerow
0
92
Das kleine 1x1 der Web-Performance
heikomamerow
1
1.1k
Einführung in Grunt
heikomamerow
1
230
Other Decks in Programming
See All in Programming
もう僕は OpenAPI を書きたくない
sgash708
5
1.7k
プログラミング言語学習のススメ / why-do-i-learn-programming-language
yashi8484
0
130
ARA Ansible for the teams
kksat
0
150
動作確認やテストで漏れがちな観点3選
starfish719
6
1k
SwiftUI Viewの責務分離
elmetal
PRO
1
240
Immutable ActiveRecord
megane42
0
140
なぜイベント駆動が必要なのか - CQRS/ESで解く複雑系システムの課題 -
j5ik2o
10
3.7k
DROBEの生成AI活用事例 with AWS
ippey
0
130
GAEログのコスト削減
mot_techtalk
0
120
Boost Performance and Developer Productivity with Jakarta EE 11
ivargrimstad
0
300
技術を根付かせる / How to make technology take root
kubode
1
250
ペアーズでの、Langfuseを中心とした評価ドリブンなリリースサイクルのご紹介
fukubaka0825
2
320
Featured
See All Featured
A Modern Web Designer's Workflow
chriscoyier
693
190k
Raft: Consensus for Rubyists
vanstee
137
6.8k
The Cost Of JavaScript in 2023
addyosmani
47
7.3k
YesSQL, Process and Tooling at Scale
rocio
172
14k
Unsuck your backbone
ammeep
669
57k
The Straight Up "How To Draw Better" Workshop
denniskardys
232
140k
The Invisible Side of Design
smashingmag
299
50k
Designing Experiences People Love
moore
140
23k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
133
33k
Code Reviewing Like a Champion
maltzj
521
39k
Automating Front-end Workflow
addyosmani
1368
200k
Practical Orchestrator
shlominoach
186
10k
Transcript
Lass Deinen Computer die langweiligen Sachen machen! Automatisierung beim Frontend
Coden #wcnbg XVI-IV-MMXVI @heikomamerow
Heiko Mamerow • Frontend Entwickler • Individuelle Themes • WordPress
Genie$er
ES IST NICHT EINFACH!!!
Übersicht I. Die langweiligen Sachen II. Automatisierung III.How To
Lass Deinen Computer die langweiligen Sachen machen!
Die langweiligen Sachen • Browser aktualsieren • Formatieren (beautify/uglify) •
Präfixe • Linting/Testen • Deploy (Dev, Test, Client) • Zusammenfassen • Redundanz • Umrechnung (PX–EM–REM-%) • Preprozessoren • Bilder optimieren • CSS Sprites
Die langweiligen Sachen Wiederholung Zeitaufwand Fehlerquelle
None
Automatisierung => Task Runner
Task Runner „Automation, performing repetitive tasks like minification, compilation, unit
testing and linting.“ Quelle: Grunt
Taskrunner
How To Linux https://github.com/nodesource/distributions Mac OS X, Windows https://nodejs.org/en/download/stable
How To I. npm init II. package.json III. Package IV.
scripts V. Tasks
package.json
Packages • https://www.npmjs.com • Installation: npm install --save-dev [ packagename
]
Packages: autoprefixer, postcss-cli
scripts / tasks
Lets try… ;-)
Fragen?
None
Vielen Dank! :-)
Fernsehturm (Slide 2) Urheber: von Kazuyanagae (Eigenes Werk) [CC BY-SA
4.0 ( http://creativecommons.org/licenses/by-sa/4.0)], via Wikimedia Commons Bildnachweis