[B! gulp] kasahiのブックマーク

kasahi id:kasahi

gulpに関するkasahiのブックマーク (12)

[意訳]私がGulpとGruntを手放した理由 - Qiita
このポストは、Why I Left Gulp and Grunt for npm Scriptsを筆者の許諾を得て意訳したものです。間違いがありましたら、ご指摘いただけると幸いです。（以下、訳）私はGulpとGruntが不要な抽象化レイヤーだと気づきました。npmのscriptsはとても強力で、そっちの方が便利だったりします。例を挙げましょう私はかつてはGulpが大好きでした。しかし結局のところ、100行ものgulpfileと大量のgulpプラグインを扱うハメになりました。Gulp上でWebpackやBrowsersync、Mochaなどを統合するのは本当にたいへんでした。なぜでしょうか？それは、プラグインによってはドキュメントが不十分だったり、APIの一部しか公開されていなかったためです。これらを解決しようと思えばできました。しかしなんとそれらのツールを直接使用すると不具合が
kasahi 2016/01/31
gulp

grunt

javascript

programming

node.js
リンク
React・Reduxを使ったElectronアプリのboilerplateを作ってみました - DJ lemon-Sour's diary (prod.hisasann)
hisasann/electron-react-redux-boilerplate はじめに Node.js + Babel 6 + React + Redux + Webpack + Gulp + Electron Electronを母体として、React・Reduxを使ったフロントエンドのアーキテクチャについて試したことをメモメモ Webpackはbrowserifyとしか使っていません Electron 最近はやりのElectron（MacやWindowsのアプリ化）を使った場合の開発の仕方や、どうやるのが効率的かを少しずつメモしていきます現時点では、Electronでビルドしたアプリのリリースやアップデートに関しては未調査になります Livereload まずは Livereload これがないとはじまりません以下の記事を参考に、gulpのタスクを作ってみましたぼくのかんがえ
kasahi 2016/01/28
redux

gulp

react

javascript

node.js

babel
リンク
gulp.js を今一度キチンと！gulp.js 導入基礎
フロントエンドのお仕事として、HTMLやCSS、JavaScript のコーディング回りを行っていると、以前に比べてやらなければならないことが増えてきていました。そのため、細々した作業でも、自動化して効率よく開発をすすめないと、時間がかかってしまうことが多いです。そんなときに活用できるのが、今回使い方を紹介する gulp です。 gulp.js このエントリーでは、gulp が使えるように、gulp とはどういうものなのかの簡単な説明から、導入の基礎部分までを書いておきます。コピペでしか使ったことがない！という人や、誰かのコピペに頼って使っていたような人も、今後の活用していくための参考に利用してもらえたら嬉しいです。 gulp とは？ gulp.js は Node.js 製の毎回行うような作業を自動化してくれるツールです。よく様々なサイトでタスクランナーとして紹介されていますが、正確には
kasahi 2016/01/24
gulp

node.js
リンク
モダンJavaScriptアプリケーション開発 in Salesforce - Qiita
はじめに HTML5でのアプリケーション開発は、エンタープライズ向けアプリケーションでも当たり前のようになってきました。これはSalesforceにおけるアプリケーション開発でも同じです。 Salesforceでのアプリケーション開発はVisualforce/Apexで行うというのが数年ほど続いてきたので、HTML5つまりJavaScriptを主体とするアプリケーション開発にはなれていないベンダーも多数あるかと思います。自分は創業当時からJavaScriptでのSPA(Single Page Application)をメインプロダクトに据えた会社を運営しており、Salesforceのパートナーとしても長いことやっていますので、このあたりのノウハウは比較的多い方です。そのためこのエントリはそれなりに説得力を持ってお届けできるとは思います。真っ先に行うべきこともしあなたがSalesforc
kasahi 2015/04/21
javascript

grunt

gulp

node.js
リンク
フロントエンド開発の３ステップ（npmことはじめ） - Qiita
スライド当記事は以前勉強会でLTしたものです。スライドは下記にあります。フロントエンド覚えること多すぎ問題モダンなフロントエンド開発で、入門記事を探そうとすると、まずwebpackやTypeScript, Babelによるビルド環境構築から始まる記事が多くヒットします。ですが、Node.jsの初心者がいきなり複数のツールを習得しようとすることが挫折の原因になっていると感じています。ですので、まずNode.jsをインストールした直後から、必ず使うことになる、 npmの機能をまず覚えておきましょう。フロントエンド開発で覚えるべき３つのコマンド以下の3つだけ覚えておきましょう。 npm init npm install npm run これだけ覚えれば、ひとまずフロントエンド開発を進めることができます。完璧なワークフローを構築するのは、書いているアプリが大きくなってきてから
kasahi 2015/04/13
node.js

grunt

gulp

javascript

frontend
リンク
Grunt/Gulpで憔悴したおっさんの話 | MOL
先人たちが1年前に通った道で、いろいろいまさらかよって話なんですが。基本的に以下の記事読んだら分かります。要はGulpとかGruntといったモノ使わずにnpm run hogehogeでビルドしよーぜって話です。 task automation with npm run オレ的Gruntに対する最新の気持ち - from scratch Node - npm で依存もタスクも一元化する How to Use npm as a Build Tool // package.json "scripts": { "start": "npm run start-serve & npm run watch", "test": "stylestats public/files/css/maple.css", "start-serve": "browser-sync start --server publ
kasahi 2015/03/28
grunt

gulp

node.js

javascript
リンク
エンジニアがいい感じにフロントエンド開発を爆速化できる環境構築の手順 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
今年もHTML5 Minutesに登壇してきました。こんにちは、先生です。当日は「フロントエンド開発スピードをあげるための環境を作ってみた話」をしてきました。今回はその環境を使ってみるまでの手順を書いていきたいと思います。必要なものをインストール NodeJS Gulp WebPack Bower PhantomJS NodeJSとGulpのインストールは過去の記事「Gulp.js入門 – コーディングを10倍速くする環境を作る方法まとめ」をご覧ください。 WebPackのインストール WebPackはさまざまな形式のモジュールを静的なファイルにまとめて出力してくれるツールで、拡張性が高く最近好んで使っています。 WebPack http://webpack.github.io/ インストールはnpmを使って簡単にできます。 npm install webpack -g ※ macは
kasahi 2015/02/04
javascript

gulp

node.js

frontend

moku
リンク
ビルドシステム gulp を試してみる【すぐに動かせるサンプル付き】 | コワーキングスペース7F
こんにちは！スタッフのめぐみです。今回は私が Web 制作の際に使用している gulp というビルドシステムの紹介をしたいと思います。タイトルの通り gulp を試してみよう！ということで、用意したサンプルを使って実際に手を動かしながら記事を読み進めてみてください。 ※ この記事では sass (ver 3.1 以上)がすでにインストールされているものとして話を進めますので、ご留意下さい。 gulp とは gulp は Node.js をベースにした、 Sass のコンパイルや js ファイルの結合・圧縮などを自動化してくれるビルドシステム(ツール)です。同じようなものに Grunt があり、タスクの記述の仕方が違いますができることはほとんど同じです。gulp の場合、必要なタスクはgulpfile.jsに記述します。ちなみに、 Node.js についての説明は割愛します。以下の記事
kasahi 2015/01/19
gulp

moku

node.js
リンク
Gulp入門 - コーディングを10倍速くする
2014/9/12に行われた週末ランサーズでのGulpハンズオンで使用したスライドです。 LIGブログでこの内容をさらにまとめています。 http://liginc.co.jp/web/tutorial/117900
kasahi 2014/10/06
gulp

node.js

javascript
リンク
【第8回】potatotipsでPromiseについて発表してきた
【第8回】potatotips (iOS/Android開発Tips共有会) - connpass に参加してきました。自分はObjective-CでのPromiseと非同期処理について発表しました。 Xcode で gulp を使うお話 - saku2saku Xcode で gulp を使うお話 gulpを使った話 RettyはWebViewを使ったハイブリッドで利用ターミナルから毎回コマンド打つのが面倒 Xcode で gulp を実行ビルドフェーズに実行する入れてない人に向けにちゃんと分岐するべきマルチバイトが上手くいかないちゃんと環境変数の内容がターミナルと違う Account Manager and Sync Adapter - Shungho Arai Account Managerとはアプリのアカウントの総合窓口一度Googleアカウントでログインすると共
kasahi 2014/08/25
gulp

swift

event

xcode
リンク
Googleのベストプラクティスに沿ったモダンな製作の出発点「Web Starter Kit」
Web Starter Kitで用意されている各種の設定ファイルなどは、そのまま使うのではなく、各自が自分のスタイルに合わせてカスタマイズするとよいでしょう。ファビコンやスマートフォンでサイトをホーム画面に追加した際に表示されるアイコンなど、各自で差し替える必要があります。 humans.txtやrobots.txtなども使用する場合には適宜編集する必要があります。動作環境の構築 Web Starter Kitに用意されたツールを使用するためには、以下の言語の環境が必要となります。 Node.js (v0.10.x以上) Ruby (1.8.7以上) これに加えて、以下のツールのインストールが必要になります。 Nore.js上で動くタスクランナーのgulp (3.5.x以上) Sassのコンパイルを行うRubyのgem (3.3.x以上) それぞれのインストール方法について、簡単に紹介し
kasahi 2014/08/25
gulp

node.js

ruby
リンク
まずは「gulp」を動かしてみよう！～セットアップとはじめてのタスク実行
CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。
kasahi 2014/08/25
gulp

javascript
リンク
1