仕事で使う資料にトレードオフスライダーを使おうと思ったが、意外にもテンプレートの類が簡単に見つからなかったので自作した。
Google スライドで作って会社の G Suite アカウントのスライドテンプレートとして登録したが、個人用の Google アカウントではそういうことはできないようなので、 Microsoft PowerPoint (.pptx) 形式と OpenDocument Presentation (.odp) 形式でダウンロードしたものを GitHub にも置いておいた。
仕事で使う資料にトレードオフスライダーを使おうと思ったが、意外にもテンプレートの類が簡単に見つからなかったので自作した。
Google スライドで作って会社の G Suite アカウントのスライドテンプレートとして登録したが、個人用の Google アカウントではそういうことはできないようなので、 Microsoft PowerPoint (.pptx) 形式と OpenDocument Presentation (.odp) 形式でダウンロードしたものを GitHub にも置いておいた。
recompose の withState がわからなかったけどブログ記事とコードを読んだらなんとなくわかった(たぶん)。
公式の API ドキュメントのこのサンプルコードがわからなかった。
https://github.com/acdlite/recompose/blob/master/docs/API.md#withstate
const addCounting = compose( withState('counter', 'setCounter', 0), withHandlers({ increment: ({ setCounter }) => () => setCounter(n => n + 1), decrement: ({ setCounter }) => () => setCounter(n => n - 1), reset: ({ setCounter }) => () => setCounter(0) }) )
withState の第二引数には stateUpdaterName を渡す。 次のステップの withHandlers の中で stateUpdaterName で名前を指定した関数、この例では setCounter が利用可能だが、 setCounter 関数自体は定義されてないのになんで利用できるの? setCounter 関数の実装はどうなってるの?というのが疑問だった。
その疑問が解決するきっかけはこのブログ記事にあった。
withStateを用いることでstateとそれを更新する為の関数を追加することができます。
props.msgはwithStateの内部のthis.stateであり、setMsgではsetStateが呼び出されているので、再レンダリングが可能です。
ここで、「もしかして setCounter って、 setState({ counter: }) 的なことをする関数で、 withState の内部で自動的に定義されるのか?」と思いついて、 withState の実装を読んだ。
いろいろやってるけど、やはり setState している。なので先ほどの例でいうと setCounter は、要するにこういう関数として定義される。
function setCounter(updateFn) { var newStateValue = updateFn(currentStateValue); this.setState({ 'counter': newStateValue }); }
なので、 withHandlers の中で setCounter(function(currentValue) { return currentValue + 1 }) のような感じで使われることになり、最終的に setState される。
es2015 の arrow 関数の書き方がいまだにパッと理解できない。
({ stateValue }) => ({ stateValue: typeof updateFn === 'function' ? updateFn(stateValue) : updateFn, }),
これは、 babel で es5 文法に変換すると、こうなる。
'use strict'; (function (_ref) { var stateValue = _ref.stateValue; return { stateValue: typeof updateFn === 'function' ? updateFn(stateValue) : updateFn }; });
ともかく、 withState が何をするのかがなんとなくわかれば、仕事で読み書きする必要があるコードにはなんとか対応できそうなのでよかった。同じ要領で recompose の他の API も読み下せるだろう。
コールドリーディングをしていて他にも馴染みのない表記に出くわした。
これも es2015 からの新しい文法で、オブジェクトのキーに変数を使うとき角括弧で囲うと変数展開してくれる。
買って数枚撮影してすぐに、買って正解だったなと思った。
OM-D E-M1 Mark II を買ってから、 M.ZUIKO DIGITAL 14-42mm F3.5-5.6 Ⅱ R と M.ZUIKO DIGITAL 17mm F2.8 を使ってきたが、 AF-S DX NIKKOR 35mm f/1.8G のような明るい単焦点レンズが欲しいなと思っていた。しかし OM-D E-M1 Mark II は M.ZUIKO DIGITAL ED 12-40mm F2.8 PRO と組み合わせたいという気持ちもあり、他にもたくさん選択肢があるが主に「PRO vs 単焦点」で悩んでいた。
しかし最終的には自分が撮りたいものを一番よく撮れそうなレンズを選ぶことにした。室内で猫を撮るのが主な撮影目的で、次に空と雲。室内の猫ならできるだけ明るい単焦点レンズのほうがよいだろうし、軽くて小さいほうが撮影もしやすいだろうと考えた。
AF-S DX NIKKOR 35mm f/1.8G で撮った写真はとてもすてきで自分の好みに合っていた。 APS-C とマイクロフォーサーズでは同じ F1.8 でも違いがあるとはいえ、焦点距離も同じくらいだし、作例を見ても同じイメージだったので、実際に撮った写真も同じイメージでよかった。
なかなかリアルなグロシーンが不気味だった。観た後でこの法律の成り立ちとかについて調べたりして、考えさせられた。あと、原作の小説を書いたのが永井豪の兄だった。
記事数が 900 を超えた。
800 のときの記事はこれ。
経過日数は、7ヶ月半くらい。だいたい前と同じペースを維持している。たぶん半分以上の記事はスマホアプリから書いている。