Suche senden
Hochladen
grunt.jsのススメ
•
Als PPTX, PDF herunterladen
•
4 gefällt mir
•
1,432 views
Takahiro Shibuya
Folgen
チーム内パワーランチで発表したgrunt.jsの紹介資料です
Weniger lesen
Mehr lesen
Technologie
Melden
Teilen
Melden
Teilen
1 von 10
Jetzt herunterladen
Empfohlen
学校では教えてくれないWebセキュリティ
学校では教えてくれないWebセキュリティ
Yuto Maeda
串
串
Yuto Maeda
PNGalt0x04
PNGalt0x04
MichaelFoF
JPEG Glitch入門
JPEG Glitch入門
Yuto Maeda
Gruntでフロントの生産性up
Gruntでフロントの生産性up
Kazuyoshi Goto
Node.js Error & Debug Leveling
Node.js Error & Debug Leveling
kumatch kumatch
Grunt.jsを使った Expressの開発環境構築
Grunt.jsを使った Expressの開発環境構築
kamiyam .
フロント開発をがんばるためにGulpとGruntに入門してみた
フロント開発をがんばるためにGulpとGruntに入門してみた
Shou Takenaka
Empfohlen
学校では教えてくれないWebセキュリティ
学校では教えてくれないWebセキュリティ
Yuto Maeda
串
串
Yuto Maeda
PNGalt0x04
PNGalt0x04
MichaelFoF
JPEG Glitch入門
JPEG Glitch入門
Yuto Maeda
Gruntでフロントの生産性up
Gruntでフロントの生産性up
Kazuyoshi Goto
Node.js Error & Debug Leveling
Node.js Error & Debug Leveling
kumatch kumatch
Grunt.jsを使った Expressの開発環境構築
Grunt.jsを使った Expressの開発環境構築
kamiyam .
フロント開発をがんばるためにGulpとGruntに入門してみた
フロント開発をがんばるためにGulpとGruntに入門してみた
Shou Takenaka
自動化ツール「Grunt.js」について
自動化ツール「Grunt.js」について
Seiko Kuchida
GruntでJavaScript 前作業の自動化!
GruntでJavaScript 前作業の自動化!
leverages_event
WebP入門
WebP入門
Norishige Fukushima
Gruntを導入しよう!の話
Gruntを導入しよう!の話
Koji Nakamura
早く家へ帰るための Grunt入門 [+gulp紹介]
早く家へ帰るための Grunt入門 [+gulp紹介]
Masayuki Maekawa
Yeomanについて
Yeomanについて
jsugiyama
Backbone.js入門
Backbone.js入門
AdvancedTechNight
はじめよう Backbone.js
はじめよう Backbone.js
Hiroki Toyokawa
Gulp入門 - コーディングを10倍速くする
Gulp入門 - コーディングを10倍速くする
Hayashi Yuichi
Grunt入門
Grunt入門
Tsuyoshi Maeda
CTO, VPoE, テックリードなどリーダーポジションに登用したくなるのはどんな人材か?
CTO, VPoE, テックリードなどリーダーポジションに登用したくなるのはどんな人材か?
akihisamiyanaga1
デジタル・フォレンジックの最新動向(2024年4月27日情洛会総会特別講演スライド)
デジタル・フォレンジックの最新動向(2024年4月27日情洛会総会特別講演スライド)
UEHARA, Tetsutaro
自分史上一番早い2024振り返り〜コロナ後、仕事は通常ペースに戻ったか〜 by IoT fullstack engineer
自分史上一番早い2024振り返り〜コロナ後、仕事は通常ペースに戻ったか〜 by IoT fullstack engineer
Yuki Kikuchi
クラウドネイティブなサーバー仮想化基盤 - OpenShift Virtualization.pdf
クラウドネイティブなサーバー仮想化基盤 - OpenShift Virtualization.pdf
FumieNakayama
AWS の OpenShift サービス (ROSA) を使った OpenShift Virtualizationの始め方.pdf
AWS の OpenShift サービス (ROSA) を使った OpenShift Virtualizationの始め方.pdf
FumieNakayama
業務で生成AIを活用したい人のための生成AI入門講座(社外公開版:キンドリルジャパン社内勉強会:2024年4月発表)
業務で生成AIを活用したい人のための生成AI入門講座(社外公開版:キンドリルジャパン社内勉強会:2024年4月発表)
Hiroshi Tomioka
モーダル間の変換後の一致性とジャンル表を用いた解釈可能性の考察 ~Text-to-MusicとText-To-ImageかつImage-to-Music...
モーダル間の変換後の一致性とジャンル表を用いた解釈可能性の考察 ~Text-to-MusicとText-To-ImageかつImage-to-Music...
博三 太田
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
NTT DATA Technology & Innovation
Weitere ähnliche Inhalte
Andere mochten auch
自動化ツール「Grunt.js」について
自動化ツール「Grunt.js」について
Seiko Kuchida
GruntでJavaScript 前作業の自動化!
GruntでJavaScript 前作業の自動化!
leverages_event
WebP入門
WebP入門
Norishige Fukushima
Gruntを導入しよう!の話
Gruntを導入しよう!の話
Koji Nakamura
早く家へ帰るための Grunt入門 [+gulp紹介]
早く家へ帰るための Grunt入門 [+gulp紹介]
Masayuki Maekawa
Yeomanについて
Yeomanについて
jsugiyama
Backbone.js入門
Backbone.js入門
AdvancedTechNight
はじめよう Backbone.js
はじめよう Backbone.js
Hiroki Toyokawa
Gulp入門 - コーディングを10倍速くする
Gulp入門 - コーディングを10倍速くする
Hayashi Yuichi
Grunt入門
Grunt入門
Tsuyoshi Maeda
Andere mochten auch
(10)
自動化ツール「Grunt.js」について
自動化ツール「Grunt.js」について
GruntでJavaScript 前作業の自動化!
GruntでJavaScript 前作業の自動化!
WebP入門
WebP入門
Gruntを導入しよう!の話
Gruntを導入しよう!の話
早く家へ帰るための Grunt入門 [+gulp紹介]
早く家へ帰るための Grunt入門 [+gulp紹介]
Yeomanについて
Yeomanについて
Backbone.js入門
Backbone.js入門
はじめよう Backbone.js
はじめよう Backbone.js
Gulp入門 - コーディングを10倍速くする
Gulp入門 - コーディングを10倍速くする
Grunt入門
Grunt入門
Kürzlich hochgeladen
CTO, VPoE, テックリードなどリーダーポジションに登用したくなるのはどんな人材か?
CTO, VPoE, テックリードなどリーダーポジションに登用したくなるのはどんな人材か?
akihisamiyanaga1
デジタル・フォレンジックの最新動向(2024年4月27日情洛会総会特別講演スライド)
デジタル・フォレンジックの最新動向(2024年4月27日情洛会総会特別講演スライド)
UEHARA, Tetsutaro
自分史上一番早い2024振り返り〜コロナ後、仕事は通常ペースに戻ったか〜 by IoT fullstack engineer
自分史上一番早い2024振り返り〜コロナ後、仕事は通常ペースに戻ったか〜 by IoT fullstack engineer
Yuki Kikuchi
クラウドネイティブなサーバー仮想化基盤 - OpenShift Virtualization.pdf
クラウドネイティブなサーバー仮想化基盤 - OpenShift Virtualization.pdf
FumieNakayama
AWS の OpenShift サービス (ROSA) を使った OpenShift Virtualizationの始め方.pdf
AWS の OpenShift サービス (ROSA) を使った OpenShift Virtualizationの始め方.pdf
FumieNakayama
業務で生成AIを活用したい人のための生成AI入門講座(社外公開版:キンドリルジャパン社内勉強会:2024年4月発表)
業務で生成AIを活用したい人のための生成AI入門講座(社外公開版:キンドリルジャパン社内勉強会:2024年4月発表)
Hiroshi Tomioka
モーダル間の変換後の一致性とジャンル表を用いた解釈可能性の考察 ~Text-to-MusicとText-To-ImageかつImage-to-Music...
モーダル間の変換後の一致性とジャンル表を用いた解釈可能性の考察 ~Text-to-MusicとText-To-ImageかつImage-to-Music...
博三 太田
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
NTT DATA Technology & Innovation
Kürzlich hochgeladen
(8)
CTO, VPoE, テックリードなどリーダーポジションに登用したくなるのはどんな人材か?
CTO, VPoE, テックリードなどリーダーポジションに登用したくなるのはどんな人材か?
デジタル・フォレンジックの最新動向(2024年4月27日情洛会総会特別講演スライド)
デジタル・フォレンジックの最新動向(2024年4月27日情洛会総会特別講演スライド)
自分史上一番早い2024振り返り〜コロナ後、仕事は通常ペースに戻ったか〜 by IoT fullstack engineer
自分史上一番早い2024振り返り〜コロナ後、仕事は通常ペースに戻ったか〜 by IoT fullstack engineer
クラウドネイティブなサーバー仮想化基盤 - OpenShift Virtualization.pdf
クラウドネイティブなサーバー仮想化基盤 - OpenShift Virtualization.pdf
AWS の OpenShift サービス (ROSA) を使った OpenShift Virtualizationの始め方.pdf
AWS の OpenShift サービス (ROSA) を使った OpenShift Virtualizationの始め方.pdf
業務で生成AIを活用したい人のための生成AI入門講座(社外公開版:キンドリルジャパン社内勉強会:2024年4月発表)
業務で生成AIを活用したい人のための生成AI入門講座(社外公開版:キンドリルジャパン社内勉強会:2024年4月発表)
モーダル間の変換後の一致性とジャンル表を用いた解釈可能性の考察 ~Text-to-MusicとText-To-ImageかつImage-to-Music...
モーダル間の変換後の一致性とジャンル表を用いた解釈可能性の考察 ~Text-to-MusicとText-To-ImageかつImage-to-Music...
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
grunt.jsのススメ
1.
grunt.jsのススメ 海賊 渋谷 貴裕
2.
背景 • 近年のソーシャルゲームはリッチ化している • いかに待ち時間を少なくユーザーに提供するかが重要 •
そこでcssやjsの圧縮が高速化に貢献 問題:CSSやjsの圧縮(難読化)をし忘れてしまう! 自動化したい!
3.
gruntとは • そこでgrunt • gruntとは…
コマンドラインで使用するタスクベースのビルドツールのこと • 設定ファイル上で指定したファイルに対してminifyのような タスクを割り当てコマンドラインから実行できる! タスク例 難読化、SassやCoffeeScriptのコンパイル、画像最適化など…
4.
demo
5.
pros/cons • cssは更新されたファイルのみ難読化してくれる(comapssのおか
げ) • jsは設定ファイルで切り分けてあげないと全jsファイルに圧縮が 走ってしまう • 切り分けするには全jsファイルを、設定ファイルに記述しな ければならない • grunt0.4.0から「grunt.file.watchFiles」で更新があったファ イルを取得可能(この機能削除されました)
6.
インストール手順 • wiki参照 • node.jsが必要 •
最近gruntからgrunt-cliに移行した • gruntの開発速い
7.
インストールしたモジュール • grunt-contrib-compass
• compassをgruntで使用するためのモジュール • compass→cssのフレームワークライブラリ • grunt-contrib-uglify • uglify.js を用いてjsを圧縮するためのモジュール • grunt-contrib-watch • 監視するためのモジュール
8.
0.3から0.4への変更点 • 設定ファイルがgrut.jsからGruntfile.jsにリネーム
• Gruntfile.coffeeでも大丈夫です。 • grunt.registerHelperの廃止 • grunt.registerTaskのエイリアス記法が変更 • grunt.registerTask('default', ['jshint', 'nodeunit', 'concat']);という 感じで、第2引数が配列になってます。 • コンフィグの記述変更 • <config:prop.subprop> → <%= prop.subprop %> • <json:file.json> → grunt.file.parseJSON('file.json') • <file_template:file.js> → grunt.template.process(grunt.file.read('file.js'))
9.
Gruntfile.js • https://gist.github.com/4314906#file-gruntfile-js
10.
結論 • Gruntを使えば自動でタスクを実行できる • js全部に圧縮走ってしまう→要対応 •
開発が速いので今後の動向をチェックする必要あり • stableな環境を求めてpackage.jsonでバージョン管理する必要あ り
Jetzt herunterladen