border-box指定でjQueryを使うときのheightとwidthに注意

経緯 グリッドデザインを使う上で、paddingやborderの幅がwidthやheightに含まれているとそこまで計算した上でmarginやwidthを決定しないといけないので、結構面倒くさいです。 そういうときに [crayon-5a328ea4926a5469957395/] と指定しておくと、widthとheightにpaddingやborderの幅が含まれるようになります。 自分がコーデ... 続きを読む

Bowerでインストールしたファイルのディレクトリを変更する

経緯 Bowerを使ってるとbower_componentsの中にjsのファイルが入っていきますが、jsだけでなく、README.mdやbower.jsonなどの余計なファイルもたくさんあって、あまり見やすいとは言えません。それが嫌で毛嫌いされているような感じがするBowerですが、ちゃんとそのあたり解決する術は残されています。 こんなときこそ、GruntJSです。GruntJSの導入はここでは触... 続きを読む

Gruntで自動的にブラウザをリロードする方法

経緯 フロントを構築するときに面倒くさいSassやCoffeeScriptのコンパイルやらなんやらを自動化できるツールのGrunt。 Gruntのすばらしさはこれだけにとどまらず、もっt様々なことを自動化することができます。 たとえば、地味に面倒くさいCSS変更後のブラウザの更新。デュアルディスプレイにして、片方の画面でブラウザを見ながら、もう一つでコーディングなんていうことをしていると、わざわざ... 続きを読む

Grunt.jsでフロントエンド開発を自動化してみた

Gruntはフロントエンド開発において、CoffeeScriptやSassなどを使うときに、コンパイルを自動化してくれるツールです。 gruntコマンドのインストール Grunt.jsはnode.jsで動くツールです。もし、node.jsがインストールされていなければ、brewなどを使って [crayon-5a328ea498d31894456347/] としてインストールしておきましょう。 [c... 続きを読む

TAG LIST

AngularJS Arduino C++ CoffeeScript CSS FuelPHP Gem Grunt HTML5 Illustrator iPhoneアプリ JavaScript jQuery Midi MySQL Node.js OpenCV openFrameworks OpenGL osc Pd-extended PHP Processing Raspberry Pi Ruby Ruby on Rails WordPress イベント イラスト ゲーム フロントエンド ライフハック ライブ レポート 作曲 展示会 数論 日記 社会 考え事 自戒 記事紹介 資料 電子工作 音楽