フロントエンド自動化ツールをまとめて理解する

http://www.youtube.com/watch?v=1OAfGm_cI6Y

1 comment | 4 points | by WazanovaNews 3年弱前 edited


Jshiike 3年弱前 edited | ▲upvoteする | link

GoogleのAddy OsmaniによるFuture of Web Appのキーノートスピーチです。 49分間 [Video]で下記の話題を全てまとめてます。フロント関連の便利ツールが一通り網羅されてます。おかげで、Yeoman (Yo/Grunt/Bower) の概要もすっきり理解できました。スライド(236枚)で確認されたい方はこちら

  • Codekit
  • Hammer
  • Prepros
  • Koala
  • Mixture
  • compass.app
  • scout-app
  • Yeoman / Grunt
    • grunt-image: JPG/PNG/Gifを最適化して軽量化
    • grunt-concurrent: タスクを並列で実行してスピードアップ
    • grunt-newer: 前回から変更のあったソースファイルに関連するタスクのみ実行
    • grunt-uncss: ビルドのときに使ってないCSSを削除してくれる
  • Yeoman / Bower
    • Bower Search
  • Yeoman / Yo
    • yo angular
    • yo express-angular
    • yo jekyllrb
    • yo chrome-extension
    • yo mobile
  • addyosmani/dotfiles
  • Alfred.app
  • Lanuchy
  • Automator
  • Macro Recorder
  • Sublime
    • Autoprefixer
    • Emmet (Zen Coding)
    • STProjectMaker
    • TernJS
    • Build System
    • SublimeLinter
  • Chrome DevTools
    • Workspaces
    • Create New Files
    • Sass Source Maps
    • Less Source Maps
    • CSS Pretty-printing
    • Ignoring library code
    • DevTools Terminal
  • Sublime Web Inspector
  • Emmet LiveStyle
  • Adobe Brackets
  • WebStorm
  • LightTable
  • Sublime jsRun
  • Tailor
  • Remote Preview
  • Adobe Edge Inspect CC
  • Grunt + LiveReload
  • GhostLab
  • DevTools Remote Debugging
    • RAW USB Debugging
    • jsConsole
  • jshybugger.com
  • iOS WebKit Debug Proxy
  • MIHTool
  • Wraith
  • Huxley
  • PhantomCSS
  • charlesproxy.com
  • Network Link Conditioner
  • slowyapp.com
  • fiddler2.com
  • Netwerm, WANEm (Linux)
  • Open Device Labs
  • Sauce Labs
  • BrowserStack
  • browserling
  • simulatorlist
  • Chrome DevTools Overrides

[Jan/2014] ワザノバTop25アクセスランキング


#yeoman

Back