背景 React書いていると以下のような...propsのような記述がたまに見られるが、どういう振る舞いになるのか少し混乱したから整理する。 const DeleteButton = ({className, ...props}) => ( <span className={[style.root, className].join(' ')} {...props}> <TrashCanIcon /> <Baloon>削除する</Baloon> </span> ); スプレッド構文 ドットを3つつなげたこれはスプレ…

背景 デフォルトでは1階層しかパスが切れない。 例えばAtomsのButton、MoleculesのFormがあったとして、理想的には以下のように整理したい。 Atoms Button with text with some emoji Molecules Form ContactForm MailAddressForm しかしデフォルトでは以下…

前提 $ node --version v.9.11.1 React, ReduxでSPAを作っている。 背景 connectで渡されたpropsをComponentで加工してFormを作っている場合、Formを触って変更された値をStoreまで持っていっても、その値はあくまでもFormのみで有効な値であるから、Storeに…

背景 WebStormのフォーマッターがいけてない。例えば import React from 'react' としたら import React from 'react'; とセミコロン付けて欲しいが付けてくれない。 ほかにもダブルクオーテーションとクォーテーションを統一してくれない、とか、細かい不満…

前提 $ node --version v.9.11.1 背景 import React from 'react'; import {render} from 'react-dom'; 前者のように{}無しで書く場合と後者のように{}有りで書く場合があって、よくわからなかったから調べる。 名前付きエクスポートとデフォルトエクスポー…

なんかいつも忘れるからメモ 書き方 docker -v ホストのディレクトリ:コンテナのディレクトリ image名 ホストのディレクトリは絶対パスで記述する。 カレントディレクトリをマウントしたいとき docker -v $(pwd):/path/to/directory image 覚え方 前と後ろの…