読者です 読者をやめる 読者になる 読者になる

夢見がちWeb屋の浮かれ雑記帳

フロントエンド周りの技術ネタやらなんやらね

自動生成用のテンプレートを自動生成してみることにした

四六時中プログラムを書いていると自然にお約束パターンが出てきてソースコードの雛形的なのを作りたくなることがままある。 俺様Scaffold的なやつが欲しくなる。 テンプレートエンジン的なやつはいくらでも転がっているので、Scffold的なのは割と簡単と作れ…

JavaScriptのソースコードのインデントは空白2文字である。異論は認めない。

まあw3schools.comのJavaScript Style Guide and Coding Conventionsでは思いっきり4だって言ってんだけどね。 Always use 4 spaces for indentation of code blocks: WebStormもデフォルトだと4だったりする。 でも、最近人気のStandard.jsでは 2 spaces – …

React.jsでPureRenderをHOCパターン化したらReduxでも捗った件

React.jsでのパフォーマンス最適化に関しては、昔はPureRenderMixinを使ってRenderを最小化しろと言われてた。 でもある時、公式ブログでやっぱMixin難しくね?って話が出てきて、shallowCompareを使えとなった。 facebook.github.io var shallowCompare = r…

JavascriptでCamelやらSnakeやらの変化をば

作ったのは結構昔なのだけど。 CamelCaseとかSnakeCaseとか変換するためのnpmパッケージ。 github.com もちろん似たようなのは腐るほどあった。 けど結局痒いところに手が届かず、いつも通りの車輪の大発明。 以下のように文字列を変形する 'use strict' con…

React界隈の人はひょっとしてみんな`process.env.NODE_ENV === "development"`を毎回手で書いているのだろうか?

React関連のソースを見ると if (process.env.NODE_ENV === "development") { /* ... */ } みたいな記述をめっちゃ見るのだけれど、 長くね?そしてtypoのリスクがあるんじゃね? 個人的にはdevelopmentすらよく打ち間違えるのだけど、英語Nativeはそんなこと…

Node.jsでローカルの空きPortを探すぜ

Webサーバのテストコード書くときに、ポート固定させたくない場合が多々ある。環境依存だし、適当な空きポート使ってほしい。 5分ほどnpmを探したけどいいのがない。ポート探すのはあるけどインターフェースがCallbackだ。欲しいのはそう、Promiseだ。 探す…

JavaScriptでDestructuringするときに別名やらデフォルト値が設定できるのを最近まで知らなかったのはここだけの話な。

Node.jsの6やES2015から使えるようになったDestructuring。変数宣言するときに、オブジェクトのプロパティを一括して取り出せる機能だ。 const user01 = { name : 'Okunishinishi' } let { name } = user01 // `let name = user01.name`と書くのと同じ なん…

JavaScriptでネストしたオブジェクトのプロパティへのアクセスを工夫してみる

例えばRubyだとSafe Navigation Operator(&.)を使えばネストしたプロパティに安全にアクセスできる。 name = product&.retailer&.name とやれば retailerの部分がnilでも例外を吐かずにnameが安全にnilになる。 これをJavaScriptでもやりたいぜ。 もちろん言…

Gitで間違えてMasterにPushしちゃった時に

本来ならローカルで別ブランチを切るべきところを間違えてmasterのまま作業してCommitしてPushしてああ、やべえ!となった時に。 git push -f origin cc4b63bebb6:master -fオプションをつけて"<commit>:<branch>"とやるとRemote側のHistoryが改ざんされ…

furを使ったFaviconの自動生成

Web開発とかしていると、ファビゴンやらバナーを手抜きでちゃちゃっと作りたくなる時がよくある。 多くの場合は、それっぽい色でタイトルやら頭文字やら書いてあるだけで十分だったりする。 でもそのためにわざわざペイントツールを開いてなんやかんやとやり…