フロントエンドの開発を色々と捗らせてくれる Grunt について、初めて Grunt を使うならこれだけまずはやってみたら？ という入門的な解説記事を書いてみました。 この記事は公開からかなりの時間が経過して内容が古いのと、Gulp を使ったフロントエンド開発環境構築について新しい記事 「Web サイト作るお仕事をしている人向け Gulp で作るフロントエンド開発環境」 を書いていますのでそちらをご覧ください。 Grunt の導入記事なんか珍しくもないし、色々な方がわかりやすい記事を過去にも書かれていているので今さらではありますが...... とはいえ、まだ使ったことがない人もいるだろうということで、「Grunt って何ですか？」 とか「使ってみたいけどよくわからない......」 なんていう Web デザイナー （主に HTML や CSS を書くフロントエンドな人） さん向けに、初めて
SassなどのCSSプリプロセッサを使うWebデザイナが増えてきました。Sassをコンパイルするだけなら黒い画面（ターミナル）を使わずともGUIアプリからの利用で問題ありません。が、ここは一歩踏み込んでGrunt（JavaScript製のタスクランナー）を使って、Sass以外のコンパイルやライブリロード、画像最適化、CSSのリントやスタイルガイド生成など、あらゆる作業をGruntに任せてより効率的な開発環境を手に入れてみませんか。 ども、Front-end Developerをしております@t32kです。今日はがんばります。 Frontrendというコミュニティ活動をしています。通常は東京で3~4ヶ月の周期でフロントエンドをテーマにした勉強会を開催しています。良かったらみなさんもご参加くださいませ。 Agenda 今日の話す内容は以下のとおりです。 なぜGruntを使うの？ Gruntの使
デバイスの多様化が進んでいる現在、さまざまな環境にあわせてWebサイトの見た目を調整するとなると（それが良いか悪いかはさておき）、CSSの編集・管理がだいぶ煩雑になってきます。これまでもレイアウト用のCSS、フォントのCSSなどなど切り分けて作業するということはありましたが、ページの表示速度の最適化の面からもばらけているのはあまりよくありません。 サイトの情報構造が複雑化すれば、そこにどのようなスタイルが適用されていて、他のスタイルがどう作用してるかもわかりにくいものです。「ご利用は計画的に」って言葉もあるぐらいですから、最初からきちんと設計しておくのが良いですね。そういうところもあって、最近これまで以上にLESSやSassといった「CSSプリプロセッサ」の話題を目にすることが増えてきました。 既存のスタイルをLESSにする LESS、Sass/SCSS、CompassにStylusと、C
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く