コーディング環境 (2014.08) | soohei.net

コーディング環境 (2014.08) 日々進化している最近のコーディング (フロントエンド開発) 環境について、 ここ1年くらいのノウハウを詰めて、 極端には新しいもの好きではない視点で整理します。 目次: 1. psdからのスライス 2. Compass 3. スプライトイメージの自動化 4. CoffeeScript 5. Gruntによる自動化 6. ローカルサーバー 7. その他 1. psdからのスライス Slicyというアプリを使い始めてからは、ずっとこれです。 Photoshopのレイヤーやグループ名に画像のファイル名(+拡張子)を付けることで、 ワンクリックで画像を書き出せます。 ファイル名に@2xと付けることで、Retina用画像(@2x)と、 等倍画像を同時に書き出すこともできます。 その他に@boundsというレイヤーをつくって矩形領域を指定したり、 @slicesと