gulpで幸せにマークアップする - かとけんのブログ
2015-05-02 gulpで幸せにマークアップする 最近コーディングがっらぃので幸せになるためgulpを使ってます。ので設定とかを自分へのメモ代わりに残す。ググって適当にやってるからより良い方法あったら教えてほしいです。 gulpとは 一言で言えばフロントエンド開発で使えるタスクランナー。画像圧縮とかsassのコンパイルとかしてくれる。昔はこういうことするときはGruntだったり、GUIツールのCodekitとかが主流だったみたいだけど、最近はみんなこれつかってるぽい。以下を参考にしました。（ただちょっと古い）2015年はgulpで決まり！開発環境をgruntから乗り換えよう！（コーダー編）lab.sonicmoov.com 導入方法 事前にすること gulpはnode.jsでできてるのでnodeいれて、 sudo npm install gulp -gでグローバル環境にgulpをイン
JS とかの管理を grunt+bower でやるようにしてみた - tokuhirom's blog
bower 的なものを使わないと､｢これどこから拾ってきたんや……｣という感じになりがちなので､一応やったほうがいいでしょうと｡ bower は直接使っていると､git のレポジトリをぶちまけるばかりで､あきらかに不要なファイルを配信することになり気持ち悪いなーと思っていたのですが､grunt なり gulp なりを使うと､いらないファイルは展開されないようです(ちゃんと main というプロパティを bower.json に記述している場合)｡ Perl なりなんなりで書いていると､node.js のツールを一部だけ使うのとかだるくてアレですが､Java の案件だとみんな何かしら LL を併用しながらやるので､まあいいかな､と｡ package.json に以下のように記述します｡そうすれば grunt の依存とかもなんとなく入る｡ { "name": "jmx-dashboard",
僕がGrunt.jsで使っているPlugin一覧 - Qiita
どんなニーズに基いているか デザインやちょっとしたプログラミングをする人なので、単体テストとかはないです。 デザイナーだけどフロントエンドに興味ある人向け。 2015-02-07: gulp編を作成 gruntからgulpへ移行したので、gulp版の一覧も作成しました。 僕がGulpで使っているPluginとnode.jsモジュール一覧 - Qiita プラグイン一覧：非Contrib系 grunt-aws-s3 S3にアップロードできるプラグインはいくつかあるけど、いくつか試して一番良かったのがこれ。 同名ファイルは確認なしで上書き可能 デフォルトでpublic-readになるので、Web関係には便利 配布元 https://github.com/MathieuLoutre/grunt-aws-s3 grunt-bless IE9のセレクタ数限界を解消する「bless」を実行できる。 昔
そのページで使われているCSSだけまとめてくれるgrunt-uncssについて紹介するよ - Qiita
addyosmani/grunt-uncss 今回紹介するgrunt-uncssはそのページに使用されているCSSだけ抽出してくれるgrunt-pluginである。Frontrend x ChromeFrontrend x Chromeのときに講演してくれたAddyさん作である。 使い方 例えば上記のようなMapleのページがあるが、ここで読み込んでいるmaple.cssの全てのスタイルを使っているわけではない。あると便利なHelper系のスタイル_helper.scssも、このページだけで言えば、そんなに使っていない。 # A grunt task for removing unused CSS from your project builds uncss: dist: files: 'app/files/css/tidy.css': ['app/index.html'] ということで、
Gruntを使ったプロジェクトの自動化。もうCodeKitもMAMPもいらないよ。 | 5 LOG
Grunt を使ったwebsite製作用のデフォルトセットを一式作ってみた ソースコード一式 準備 下記がインストールされていない場合は、要インストール node.js grunt-cli node.js のインストール node.jsをインストール nodebrewを使って管理する grunt-cli のインストール grunt-cli はgrunt を実行するためだけのパッケージなので、「-g」でグローバルにインストールしておく $ npm install -g grunt-cli Grunt のインストール Grunt を実行するには下記が必要 package.json （プロジェクトの情報を記述した設定ファイル） Grunt.js Gruntプラグイン （sassのコンパイルなど、Gruntで実行するタスク） Gruntfile.js （Gruntで実行するタスクを記述したファイル
Gulp入門 - コーディングを10倍速くする
2014/9/12に行われた週末ランサーズでのGulpハンズオンで使用したスライドです。 LIGブログでこの内容をさらにまとめています。 http://liginc.co.jp/web/tutorial/117900
今更だけどやるgrunt入門編・インストールから基本的な使い方
JavaScriptやCSSの結合や圧縮などいろいろな事を自動で処理してくれるGruntですが、もう話題になってずいぶん立ちますが今更ながら入れてみましたのでその方法です。 前にGruntの話題で盛り上がった時に試してみたのですがどうしても動かず原因もわからずで止まっていたのですが、情報も増えてきたので再チャレンジでした。 結果的に原因もわかったのでGruntの入れ方と基本的な使い方を書いておこうと思います。 node.jsのインストール Gruntを使うためにはnode.jsが必要になりますので、以下のサイトからnode.jsをダウンロードします。 node.js ダウンロードしたものを実行します。 これでnode.jsがインストールできたはずです。 コマンドを起動 次にコマンドを起動します。「管理者として実行」をクリックします。 まずはnode.jsが入ったか確認してみましょう。以下の
あなたのWeb開発人生を変えるYeoman、Bower、Yoのインストールと使い方
連載目次 前回記事「Gruntで独自タスクを定義し、独自プラグインをnpmモジュールとして作成・公開するには」では、Gruntを使っていろいろな手法でタスクを定義する手法や、独自プラグインを作成してnpmで公開する方法について解説しました。 今回は少し角度を変えて、Gruntを自身の機能として利用しており、快適な開発ワークフローを提供してくれるツール、「Yeoman」について解説します。 3つのツールを統合したワークフローを提供する「Yeoman」 Yeomanとは、公式サイトいわく、「The web's scaffolding tool for modern webapps」とのことです。 訳すと、「今風のWebアプリのための土台／基盤を作ってくれるツール」といったところでしょうか。「scaffolding」はRuby on Railsの主要機能として有名になった言葉で、コマンドを打つだ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
