サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
デスク環境を整える
qiita.com/trapple
https://github.com/peco/peco 標準入力をフィルタリングして標準出力に返すツールです。golangで書かれています。 pecoを使ってディレクトリ移動を便利にするエントリーをみかけたのでシェルスクリプトで再実装してみました。 Windows のコマンドプロンプトを10倍便利にするコマンド「peco」 気に入りリストからフィルタリングしてディレクトリ移動します。 シェルスクリプトファイルだとcdコマンドが実行中のプロセス内でしかきいてないので .[zs|bas]hrcあたりに書きました。 function pcd() { local PCD_FILE=$HOME/.peco/.peco-cd local PCD_RETURN if [ $1 ] && [ $1 = "add" ]; then if [ $2 ]; then ADD_DIR=$2 if [ $2 =
-y オプションをつける diffに-yオプションをつけるとファイル内容を左右に並べて比較表示してくれました。 差分のある部分は|や>などで目印つきつつ、colordiffなら色がつきます。 ちなみにこの出力をlessに渡すと盛大に文字化けしました。colordiff -y file1 file2 | less -Rとすればよいらしいです。 .colordiffrcで色設定も変更できます。 -y --suppress-common-lines をつける -yオプションにさらに--suppress-common-linesオプションをつけると変更のある行だけを表示してくれます。 思い切りばっさりと関係ない行を消してくれるのですが、こんどは情報が少なすぎる感が・・・。 これに行番号表示できないですかね。 --suppress-common-linesオプションを覚えるのは厳しいので alias
Browserify使いはじめてしばらくたって、自分なりのコツがつかめてきた気がするのでまとめてみます。 まず今回のコンテキストとしては画面遷移をそれなりに含み、同じモジュールを各画面で使う前提。 SPAだとちょっと考え方が変わるかもしれません。 【対策以前】全部をbundleすると太る Browserify覚えてしばらくは、ページ毎の実行部分も含めてbundle.jsにひとまとめしてたけど、各ページ共通部分があるにもかかわらず別ファイルになってしまい、ブラウザキャッシュも生かせず、ファイルサイズも肥大化して微妙だなぁと感じていました。ビルドも毎回でgulpタスクも重くなりがちでした。 共通部分も別々のファイル ブラウザキャッシュ活かせない ファイルサイズ肥大化 ビルド重め ファイル配置例 . ├── node_modules │ ├── knockout │ └── unders
Register as a new user and use Qiita more conveniently You get articles that match your needsYou can efficiently read back useful informationYou can use dark themeWhat you can do with signing up
{ "env": { "node": true, "es6: true }, "ecmaFeatures": { "jsx": true }, "plugins": [ "react" ], "rules": { "react/jsx-uses-vars": 1 } } ESLintは標準パッケージでjsxをサポートしてるのですが、React独自表記の部分はサポート外となっていて、そこはpluginでカバーする感じになっています。 例えばreact/jsx-uses-varsを無しでReact/ESLintを使うとHoge is defined but never used (no-unused-vars)とエラーが出てしまいます。 Hogeが定義されているけど使われないですよというエラーなのですが、この設定により<Hoge />と使うのを許可します。
reactにfluxを採用してアプリケーションを設計していると、親->子->孫コンポーネントへpropsのバケツリレーになってしまう事がありました。 そもそもイケてない設計が悪いのですが、reactバケツリレーつらいという声を聞くことも多かったし、自分も辛いと思っていたところ助言をいただいて解決法が見えてきたのでまとめてみます。 propsバケツリレー まず、バケツリレーを再現してみます。 DOM構造 おおまかにdiv[class="app"](親), div[class="group"](子), div[class="item"](孫)というツリー構造になってます。 <div class="app"><!--親--> <div class="group"><!--子--> <h2>1番目のグループ</h2> <p class="count">13</p> <div class="item
この記事は Perl入学式 Advent Calendar 2014 の 5日目です。 こんにちは。サポーターさせていただいてます まっすー(@trapple )です。 今日は昨日までと少し流れを変えて、普段のPerl入学式と同じような内容で行きたいと思います。 今年のPerl入学式の進行具合ですと、第4回サブルーチン/正規表現が終わったり終わらなかったりな進行具合だと思います。 今回はそのサブルーチンをちょっと発展させた内容になります。 サブルーチンまだ習ってないよ! or 忘れちゃったよ!って人はまずは講義資料に目を通してみてください。 復習問題 それでは簡単な復習問題からスタートします。 mon, tue, wedといった3文字英語表記の曜日を引数として受け取り、月曜日, 火曜日, 水曜日といった日本語3文字表記の曜日を返すサブルーチンtranslate()を作ってください。 標準入
と書ける。素敵。 追記 コメント欄でご指摘頂きました。 ありがとうございます! mv ではなくてシェル(bash)の機能です。 Man page of BASH の ブレース展開 Register as a new user and use Qiita more conveniently You get articles that match your needsYou can efficiently read back useful informationYou can use dark themeWhat you can do with signing up
最近はヘッドレスブラウザで気軽にE2Eテストをできる時代になったと聞くのでちょっと試してみた。 CasperJSの場合 casper.test.begin('google search simple test', 4, function (test) { casper.start("https://www.google.co.jp/", function () { test.assertExists("title"); // titleタグがある test.assertTitle("Google", "title is Google"); // titleタグ内容はGoogleである test.assertEval(function () { // <meta name="description">のcontent属性は空ではない return __utils__.findOne("met
# ログの出力レベル変更 npm install -d grunt-contrib npm install --loglevel info grunt-contrib # package.jsonに書き込み npm install --save-dev grunt-contrib npm install -D grunt-contrib Register as a new user and use Qiita more conveniently You get articles that match your needsYou can efficiently read back useful informationYou can use dark themeWhat you can do with signing up
このページを最初にブックマークしてみませんか?
『qiita.com』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く